ByKasper Siig

Engineers have always tried to make developing applications as easy as possible. Over time, many different languages and frameworks have implemented hot reloading functionality, such asnodemon in Node.js. Simply put,hot reloading is the process of automatically rebuilding or recompiling your application when you save any changes to the application files.

The principle of hot reloading has been common in the developer community for many years, but using it when working with Kubernetes is less common. In this article, you'll be given a high-level overview of what it means to hot reload inside Kubernetes, and how it can be efficiently done usingDevSpace.

Why Do You Need Hot Reloading?

To understand why hot reloading is useful, it's important to understand what the alternative is. Looking at the specific case of Kubernetes, there are quite a few steps needed if you want to directly test your application inside a cluster while in development.

First, you'll need to deploy the application. Assuming that you're doing this in the most efficient way possible, you'll likely be using Helm to do so. This way, you only need to runhelm upgrade ... in order to deploy your application. With the application deployed, you can start to make changes to the application files. To test those changes, you need to rebuild the Docker image (assuming you're using Docker) and run thehelm upgrade ... command again. On top of that, you have to move into a terminal window to run these commands.

When developing Kubernetes applications with a tool like DevSpace, the entire previous paragraph is automated. DevSpace takes care of rebuilding and redeploying your application as soon as you save the application file.

Hot Reloading With DevSpace

It's certainly possible to implement your own hot reloading solution, but the most effective solution is to use an existing tool like DevSpace that implements all the functionality in a simple-to-use CLI-based tool. All you have to do is execute a few commands in a terminal.

Now you'll look at an example of how hot reloading is done using DevSpace, after which you'll be given an explanation of how it works under the hood. You can find the code for this article inthis GitHub Repo.

Using Hot Reloading

To follow along with this tutorial, you need to havenpm andDevSpace installed.

To test this functionality, you need to have an example application. DevSpace supports many different programming languages, and this example will be based on Node.js. Start by creating a file calledindex.js with the following contents:

constexpress=require('express')constapp=express()constport=3000app.get('/',(req,res)=>{res.send('Hello World!')})app.listen(port,()=>{console.log(`Example app listening on port${port}`)})

There's no need to worry if you're not familiar with Node.js. To show the functionality of hot reloading, an example application is needed, but nothing much will be changed in the application. The code above is a simple "Hello World" example. To make sure that the application works, runnpm install express.

Now it's time to add DevSpace to the project. This is done simply by runningdevspace init, which will give you the following output:

$devspace init     ____              ____    |  _\ _____   __/ ___| _ __   __ _  ___ ___    | | | |/ _\ \/ /\___\|'_ \ / _` |/ __/ _ \    | |_| |  __/\ V /  ___) | |_) | (_| | (_|  __/    |____/ \___| \_/  |____/| .__/ \__,_|\___\___|                            |_|? How do you want to deploy this project?  [Use arrows to move, type to filter]> helm: Use Component Helm Chart [QUICKSTART] (https://devspace.sh/component-chart/docs)  helm: Use my own Helm chart (e.g. local via ./chart/ or any remote chart)  kubectl: Use existing Kubernetes manifests (e.g. ./kube/deployment.yaml)  kustomize: Use an existing Kustomization (e.g. ./kube/kustomization/)

For your own application you are free to choose any of these options, but for this tutorial, you should choose the default "Use Component Helm Chart" option. This will give you a Helm chart that's defined by DevSpace, and optimized for developing/deploying applications with DevSpace. The next option will be what Dockerfile you want to choose, and here you should choose "Create a new Dockerfile for this project".

? How should DevSpace build the container imageforthis project?[Use arrows to move,typeto filter]> Create a new Dockerfileforthis project  Based on an existing Dockerfile withininthis project(e.g. ./backend/Dockerfile)  Using a custom build process(e.g. jib, bazel)

DevSpace should detect that it's a JavaScript project, and you should confirm this.

? Select the programming language of this project[Use arrows to move,typeto filter]  dotnet  go  java> javascript  none  php  python

Moving on, you should choose what Docker registry you want to use. You can use any you like, but in this tutorial, Docker Hub is being used.

? Which registry would you want to use to push images to?  [Use arrows to move, type to filter]> Use hub.docker.com => you are logged in as ksiig  Use GitHub image registry  Use other registry  Skip Registry

Finally, you need to confirm with DevSpace that your application is listening on port3000.

? Which port is your application listening on? 3000

With DevSpace initialized, you can start using it. Start by choosing the namespace for your application:

$devspace use namespace hot-reload

Now you're ready to start using DevSpace to develop your application. Rundevspace dev, and you'll see in your terminal that DevSpace is building your application and deploying it to Kubernetes. Once the application is built and deployed, DevSpace will open up a terminal session inside the container that's just been deployed to Kubernetes.

If you now open localhost:3000 in your browser, you'll notice that the application isn't running. To start it, you'll need to runnpm run dev in the container terminal. Now you can make changes to the application files and see that DevSpace is taking care of syncing your local files into the container in Kubernetes, successfully enabling hot reloading for you.

How it Works

In your project you'll find a file calleddevspace.yaml. This file contains all of the configuration options that are relevant to DevSpace. While they are too extensive to go through in this article, if you're curious about the different parts of the file, you can read through thedocumentation.

The relevant part for this article starts on line 60 withreplacePods. The first line is theimageSelector, which specifies that DevSpace will look for a container that has the image specified in this field to replace. Looking at the next line, you can see that the container in the pod will be replaced by a container that is based on the imageloftsh/#"https://loft.sh/" rel="noopener noreferrer">Loft. So far, this is fairly straightforward. However, the next part needs an explanation.

Thepatches section replaced two key values;command andargs. As the file is written, the container will set PID 1 to besleep 9999999, thereby replacing any command that would otherwise start the application. This allows you to control the behavior of the application through a terminal, as you saw earlier, and means that you can run tools likenodemon, which is the software taking care of watching the application files and rebuilding the application. DevSpace helps in this case by syncing your local files into the container, where nodemon can then detect file changes.

Container Restart Helper

When discussing hot reloading, it's worth mentioning another capability of DevSpace, which is theinjectRestartHelper option. This is useful in the cases where you need to manually restart a container, but don't want to terminate and recreate the entire container.

Thedevspace.yaml file allows you to specify animages section, where you can select the images that need to be built when runningdevspace dev ordevspace build. In this article, that would mean such a section could look like:


images:hot-reload:image:${IMAGE}

Using theinjectRestartHelper option is as easy as adding it to this section:


images:hot-reload:image:${IMAGE}injectRestartHelper:true

Now you can restart the pod when it's running in Kubernetes by runningdevspace restart.

Conclusion

By now, you've learned a bit more about what hot reloading is, and how it can also be useful in Kubernetes. You also know how to implement this functionality by yourself, and how it can be more efficiently implemented by using a tool like DevSpace.

If this seems like it might be a useful functionality for you, take a look at what elseDevSpace can do for your workflow.

Photo byBernd Dittrich onUnsplash