Skip to content

Latest commit

 

History

History
327 lines (227 loc) · 9.79 KB

rest-fundamentals.md

File metadata and controls

327 lines (227 loc) · 9.79 KB
Raw

RESTful Web APIs

Introduction to RESTful Web APIs

What is REST?

  • Representational state transfer:
    • Originally for accessing and manipulating textual representations of Web resources using a set of stateless operations
    • Today: More generic, encompassing every entity that can be identified, named, addressed or handled, in any way whatsoever, on the Web
  • Architectural pattern, not a standard
  • Today, HTTP-based RESTful APIs dominate

Important Tools (Examples)

Sample Requests

<!--#include file="rest-fundamentals/0010-rest-clients/pokeapi.http" -->

<!--#include file="rest-fundamentals/0010-rest-clients/northwind.http" -->

Exercise: Try this sample with different REST clients

Sample Requests (cont.)

<!--#include file="rest-fundamentals/0010-rest-clients/post.http" -->

Exercise: Try this sample with different REST clients

Important REST principles

  • Stateless
    • No client context stored on the server
    • Each request is complete
  • Cacheable
    • Responses explicitly indicate their cacheability
  • Layered System
    • Client cannot tell if connected directly to the server (e.g. reverse proxies)
  • URIs
    • Resources are identified using Uniform Resource Identifiers (URIs)
  • Resource representation
  • XML, JSON, Atom - today mostly JSON

RESTful Web APIs in the Browser

<!--#include file="rest-fundamentals/0020-rest-client/app-promise.js" -->

RESTful Web APIs in the Browser (cont.)

With async/await:

<!--#include file="rest-fundamentals/0020-rest-client/app.js" -->

RESTful Web APIs in the Browser (cont.)

With jQuery:

<!--#include file="rest-fundamentals/0020-rest-client/app-jquery.js" -->

Building RESTful Web APIs with Node.js

  • In practice, frameworks are used for that
  • Here: Express.js
    • Larger framework, not just for RESTful Web APIs
    • Very commonly used
    • Lots of plugins
  • Installation
    • npm install express
    • For TypeScript: npm install @types/express --save-dev

RESTful Web API with Express.js

<!--#include file="rest-fundamentals/0030-express-basics/app.ts" -->

<!--#include file="rest-fundamentals/0030-express-basics/request.http" -->

RESTful Web API with Express.js

  • express() function
  • Application
    • Represents the Express application
    • Created with express()
    • Documentation
  • request object
    • Represents the HTTP request
    • Use it to get headers, parameters, body, etc.
    • Documentation
  • response object
    • Represents the HTTP response
    • Use it to build response (e.g. status, headers, body, etc.)
    • Documentation

Express.js Examples

<!--#include file="rest-fundamentals/0040-express-verbs/app.ts" -->

Express.js Examples (cont.)

<!--#include file="rest-fundamentals/0040-express-verbs/data.ts" -->

<!--#include file="rest-fundamentals/0040-express-verbs/get-all.ts" -->

Express.js Examples (cont.)

<!--#include file="rest-fundamentals/0040-express-verbs/get-single.ts" -->

Express.js Examples (cont.)

<!--#include file="rest-fundamentals/0040-express-verbs/post.ts" -->

Express.js Examples (cont.)

<!--#include file="rest-fundamentals/0040-express-verbs/delete-single.ts" -->

Lokijs

  • Lightweight in-memory key-value store
  • Fast and easy to use
  • Works in...
    • ...browser
    • ...apps
    • ...Node.js on the server or in the command line
  • Persistence adapter can write data to disk/indexeddb

Lokijs

<!--#include file="rest-fundamentals/0050-express-loki/db.ts" -->

Express.js Examples with Lokijs

<!--#include file="rest-fundamentals/0050-express-loki/app.ts" -->

Express.js Examples with Lokijs (cont.)

<!--#include file="rest-fundamentals/0050-express-loki/get-all.ts" -->

Express.js Examples with Lokijs (cont.)

<!--#include file="rest-fundamentals/0050-express-loki/get-single.ts" -->

Express.js Examples with Lokijs (cont.)

<!--#include file="rest-fundamentals/0050-express-loki/post.ts" -->

Express.js Examples with Lokijs (cont.)

<!--#include file="rest-fundamentals/0050-express-loki/delete-single.ts" -->

Express.js Server-Side Rendering

  • Express.js also supports server-side rendering
  • HTML is generated on the server-side
  • Server-Side Rendering can be combined with client-side logic

Server-side rendering

Server-side rendering

  • Client is a browser
  • Most of the business logic runs on the server
    • Minor parts of the logic runs on the client
      (e.g. form validation in JavaScript)
    • Server accesses databases and external services
  • Server generates HTML, CSS, JavaScript

Web APIs + Single Page Apps (SPA)

Web APIs + Single Page Apps (SPA)

  • Client can be a browser
    • Anything that can speak HTTP, JSON, etc.
      (e.g. mobile app, CLI, server, desktop app, IoT device)
  • Static HTML/CSS/JS for SPA
  • Logic
    • HTTP Web API requests for running server-side business logic
    • View logic (e.g. manipulating DOM) runs on client
    • JSON for transmitting data

Express.js Server-Side Rendering

<!--#include file="rest-fundamentals/0060-express-server-side-html/src/app.ts" -->

Express.js Server-Side Rendering (cont.)

<!--#include file="rest-fundamentals/0060-express-server-side-html/src/views/index.hbs" -->

Further Readings and Exercises