This article focuses on a strategy to deploy static assets, specifically assets generated with the create-react-app toolchain. The assets are served using Django deployed in a Kubernetes cluster on the Google cloud GKE platform.
The technologies used include Django, React, Docker, gcloud and its related CLIs, e.g. gsutil. It explores an example of a Docker build pipeline that generates the image and pushes the static assets to a gcloud bucket. The article borrows heavily from Google’s own guide titled “Running Django on Google Kubernetes Engine” (referencedas Django GKE for the rest of the article).
It was found that the GKE guide had some blind spots, or rather specific use cases, that were not covered in the guide, and some of these gaps are addressed here. Anything not mentioned in this article is assumed to be covered in the Django GKE guide (e.g., creating GKE clusters as well as buckets and databases) so refer to it if you need to have the whole picture.
The article is divided into three main sections: the React App section, the Django section, and the build and deploy section. Everything in this article can be found in the django_react_k8s GitHub repository. As such, we will only look at the core points as opposed to going into detail on how to set it all up.
In the django_react_k8s repository, the static assets can be found in the ./static
folder and were created using the following command.
npx create-react-app static
This installs a standard React application, but we need to make some modifications in order to serve static assets to Django in a production setting. The first set of modifications is to install packages that allow us to customize the create-react-app config. There packages can be installed by running:
yarn add -D react-app-rewired customize-cra webpack-bundle-tracker@0.4.3 write-file-webpack-plugin
yarn start
allows static content to be also accessed and served from Django locally.#javascript #python #kubernetes #react #programming