Skip to content

Jamstack

Jamstack, stands for Javascript, API and Markup (generated by a static site generator)

In the Server side rendering mode, we know we need to run a Node web server to render React or Vue component to HTML on the server side.

How about this way:

  1. In the build stage, we try to render React or Vue component to static HTML (seems like static site generate)
  2. During the build stage, if needed, the Node.js app also send request to the API backend to fetch data.
  3. And then, deploy the built HTML to the CDN network.
  4. The built app will use Javascript and API to talk to backend service, to enable dynamic content on some pages

Jamstack Workflow

Web app built with Jamstack is very fast (because of CDN, and the prebuilt HTML) and is very good option for many CMS application.

For example, many Wordpress applications now ues Jamstack since it is more fast and secure.

Frontend

  1. Gatsby
  2. Next.js
  3. Nuxt.js

It is recommended to deploy the frontend app to

  1. Netlify
  2. Vercel

Serverless Functions

If you do not understand what is Serverless Functions, you can learn

  1. Netlify Functions

Backend

Django

For Django dev, we might also need below packages.

  1. Django REST framework which will help build REST API.
  2. dj-rest-auth or djoser for auth API support.
  3. django-cors-headers will help solve Cross-Origin Resource Sharing (CORS) issue.
  4. graphene-django Integrate GraphQL into your Django project.

Flask

For Flask dev, we might also need below packages.

  1. flask-restful
  2. flask-api
  3. flask-graphql
  4. flask-cors

FastAPI

  1. CORSMiddleware

Reference

  1. jamstack homepage

Demo

Next.js Django Demo