Definitive Getting Started Guide to DevSpace for Kubernetes

Published:15 July 2022 - 9 min. read

Azure Cloud Labs: these FREE, on‑demand Azure Cloud Labs will get you into a real‑world environment and account, walking you through step‑by‑step how to best protect, secure, and recover Azure data.

Are you looking for a cloud-native tool you can use to build and deploy applications locally in a way that mimics a real-time Kubernetes environment? Well, look no further. DevSpace is just around the corner.

DevSpace is a cloud-native tool that lets you deploy applications locally using either a local or remote Kubernetes cluster. In this tutorial, you’ll learn how to initialize a Node application with DevSpace and perform hot-reloading with DevSpace.

Read on and start building your applications on the cloud!

Prerequisites

This tutorial will be a hands-on demonstration. If you’d like to follow along, be sure you have the following:

  • NPM globally installed.
  • A local or remote Kubernetes cluster – This tutorial uses Minikube.

Installing DevSpace on Local Machine

Before building your applications with DevSpace, you must install the DevSpace CLI on your machine. You have a handful of options to install the DevSpace CLI; via NPM, Yarn, and Curl for Linux, Mac, Windows, and brew.

But in this tutorial, you’ll install DevSpace CLI globally using NPM:

Open your terminal and run the below npm command to install devspace globally (-g) on your local machine.

npm install -g devspace
Installing the DevSpace CLI

Now, run the command below to check DevSpace CLI’s installed version.

devspace --version

Below, you can see DevSpace CLI’s installed version, which indicates you’ve successfully installed the DevSpace CLI.

Confirming DevSpace installed version
Confirming DevSpace installed version

Initializing a Node-based Project

Now that DevSpace is installed on your machine, it’s time to create a Node project. You’ll then create a Dockerfile that DevSpace will use to create a Docker image for your project to deploy to Kubernetes.

1. Run the below commands, which don’t provide output, but create a directory (mkdir) and switch (cd) to that directory.

You can freely name the directory, but this tutorial’s choice is node-devspace.

mkdir node-devspace
cd node-devspace

2. Open the newly-created directory (node-devspace) on your preferred text editor.

code .

3. Run the below command to initialize (init) a package.json file, since you’re creating a Node project, to track important metadata and dependencies.

npm init -y
Creating a package.json file
Creating a package.json file

Now, run the following command to install Fastify. Fastify is a Node.js library used for building fast web applications.

npm i fastify
Installing Fastify
Installing Fastify

5. Create an index.js file and add the code below, which spins up a web server that listens on port 4000.

// Importing fastify and setting fastify logger to true
const fastify = require('fastify')({ logger: true})

// Creating a get request for the  home route
fastify.get('/', (req,res) => {
    res.send('Hello Devspace')
})

// Spinning up the server on port 4000
fastify.listen(4000, () => console.log('server listening on port 4000'))

6. Next, run the below command to install nodemon.

Nodemon is a Node.js tool used to watch for changes in a Node-based application by automatically starting the server on code changes.

npm i --save-dev nodemon
Installing Nodemon
Installing Nodemon

7. Add the following line to your package.json file, which initializes nodemon to watch for code changes when the npm start command is run.

"start":"nodemon index"
Adding a start script in the package.json file
Adding a start script in the package.json file

8. Now, run the command below to run (start) your Node application.

npm start
Spinning up the Node application
Spinning up the Node application

9. Visit your localhost via port 4000, and you’ll see the following output.

Accessing the Node application
Accessing the Node application

10. Create a .dockerignore file and add the node_modules folder since the node_modules folder is not part of the application code. Doing so adds efficiency to the Docker image build process.

Ignoring the node_modules folder
Ignoring the node_modules folder

11. Finally, create a Dockerfile and add the following configurations, which creates a Docker image with a node version of 17-alpine.

FROM node:17-alpine //Node version for building the image

WORKDIR /app //A working directory in the image

COPY package.json . // Copy the package.json file to the working directory

RUN npm install // Run npm install to install all dependencies

COPY . . // Copy all other files into the working directory

EXPOSE 4000 //Expose the image container on port 4000

CMD ["npm", "start"] //Run the image container with the `npm start` command

Initializing the Node-based Project with DevSpace

You’ve set up all resources for your project, and now you’re ready to initialize your Node application with DevSpace. You’ll choose options like ones that tell DevSpace to create a Helm chart for your Node application and to build your container image based on your Dockerfile.

1. Run the devspace command below to initialize (init) a DevSpace project for your Node application.

As you initialize your project, DevSpace comes with some questions on how you’d like to initialize your DevSpace project (step two).

devspace init

2. Select the first option since you currently don’t have a local or remote Helm chart or a manifest file configured in your Node project, and press Enter.

This option allows DevSpace to create a Helm chart for your Node application and deploy your application in your Kubernetes cluster as a Helm chart.

Choosing how to deploy the Node project
Choosing how to deploy the Node project

3. Next, select the first option and press Enter.

This option indicates that DevSpace should build the container image based on the Dockerfile it has detected in your project.

Using existing Dockerfile to build container image with DevSpace
Using existing Dockerfile to build container image with DevSpace

4. Lastly, select hub.docker.com and press Enter to set what registry to push your images to.

Authenticating (hub.docker.com)
Authenticating (hub.docker.com)

Once DevSpace has successfully initialized your project, you’ll get the following output. In addition, DevSpace will create some files based on the successful initialization of your project:

  • devspace.yaml – This file is automatically generated by DevSpace based on the configuration settings in your Dockerfile.
  • .gitignore – An auto-generated file that DevSpace creates and adds the devspace.yaml file into it.
  • devspace_start.sh – This contains a shell script that can be used to deploy your application.
  • And a .devspace folder that will contain all logs from your DevSpace project.
Verifying successful project initialization with DevSpace
Verifying successful project initialization with DevSpace

Starting up the Dev Mode in DevSpace

Now that you’ve successfully initialized your project with DevSpace, it’s time to see DevSpace in action with Dev mode. The DevSpace Dev mode is where you can use DevSpace commands to interact with your Kubernetes cluster and develop your project in a development mode in Kubernetes.

To start up Dev mode in DevSpace:

1. Run the DevSpace command below to create a namespace mynodeapp in your Kubernetes cluster.

This command below tells DevSpace to spin up the development mode for your application in a namespace called mynodepp.

devspace use namespace mynodeapp
Creating a namespace with devspace
Creating a namespace with devspace

2. Next, run the following devspace command to start the DevSpace dev mode. devspace dev

devspace dev

After running the command, DevSpace will:

  • Use the namespace mynodeapp, and your KUBE_CONTEXT o set up a Kubernetes development environment on the cluster provisioner your KUBE_CONTEXT is pointing to.
  • Deploy your application as a Helm Chart and give you a URL you can access via localhost to view your project on the DevSpace UI.
Verifying DevSpace namespace, deployment, and DevSpace UI
Verifying DevSpace namespace, deployment, and DevSpace UI
  • Port forwarding is also automatically configured so your application can be accessed via localhost. DevSpace will also sync your local source code with the source code in the container and install all dependencies in the container.
Verifying DevSpace port-forwarding and dependency installation in the container
Verifying DevSpace port-forwarding and dependency installation in the container
  • And lastly opens up the Docker container to interact with the container directly.
Opening the Docker container in Kubernetes development mode
Opening the Docker container in Kubernetes development mode

3. Now, run the below node command to test your application in the Kubernetes development environment. This command spins up your Fastify web server in your container.

node index.js

You’ll see below that your web server is up on localhost:4000 from the pod DevSpace created and not your local machine.

Spinning up fastify server in docker container
Spinning up fastify server in docker container

4. Now, open your favorite web browser and navigate to localhost:4000. If all goes well, you’ll see the following output.

Verifying output in the browser on localhost:4000
Verifying output in the browser on localhost:4000

5. Edit the code in your index.js file to display “Application is reloading message” instead of “Hello DevSpace” on the home route.

You’ll see your container picks up the code changes and reloads automatically. This feature is called hot-reloading.

Confirming that the Docker container is picking up local code changes
Confirming that the Docker container is picking up local code changes

6. Lastly, refresh the web page, and you’ll see the new output, as shown below.

Verifying new output on localhost:4000
Verifying new output on localhost:4000

Deploying Application to Kubernetes with DevSpace

After confirming your project works as expected in the Kubernetes development mode, it’s time to deploy your application to see how it performs in a real-time Kubernetes environment.

DevSpace uses the current KUBE_CONTEXT, which is the same as the one currently configured for KUBECTL. So at this stage, DevSpace will deploy your application to the cluster provisioner your KUBE_CONTEXT is pointing to, which can either be a Kind, Minikube, or a remote Kubernetes cluster.

1. Run the command below to create and use the namespace mynodeapp-in-production.

devspace use namespace mynodeapp-in-production
Instructing DevSpace to create and use the namespace (mynodeapp-in-production)
Instructing DevSpace to create and use the namespace (mynodeapp-in-production)

2. Next, run the following command to deploy your application to Kubernetes (production) with DevSpace.

devspace deploy -p production

After running the command, DevSpace will:

  • Use the namespace mynodeapp-in-production and deploy your application on the Kubernetes cluster provisioner your kube config is pointing to.
  • Build the Docker image of your application.
  • Tag your image with a string by default.
  • Use the Helm chart created by DevSpace to deploy your application to Kubernetes.
Verifying Docker image builds and namespace (mynodeapp-in-production) created by DevSpace
Verifying Docker image builds and namespace (mynodeapp-in-production) created by DevSpace

On successful deployment, you’ll see an output similar to the one below.

Confirming successful deployment with DevSpace
Confirming successful deployment with DevSpace

3. After deployment, run the below command to view your application on your browser.

The command below prompts a question about how you’d like to open your application, either via localhost or a domain.

devspace open
Accepting to open application via localhost
Accepting to open application via localhost

Press Enter to select the first option, which lets DevSpace open your application via localhost.

Viewing port-forwarding for the Node application Docker container
Viewing port-forwarding for the Node application Docker container

DevSpace configures port-forwarding for your application to be accessed via localhost on port 4000 and opens your application on your default browser, as shown below.

Verifying application is accessible via localhost on port 4000
Verifying application is accessible via localhost on port 4000

4. Now, open another terminal and run the command below to launch the container where you can run your commands directly on the container.

devspace enter

You should have the following output:

Opening up the Node application Docker container
Opening up the Node application Docker container
devspace enter

5. Run the command below to spin up (start) your Fastify web server.

npm start

If spun up successfully, you’ll have the following output. You have now successfully deployed your application to Kubernetes using DevSpace.

Spinning up the Fastify server in the Node application Docker container
Spinning up the Fastify server in the Node application Docker container

Confirming Cluster Resources

DevSpace uses your current KUBE_CONTEXT to know which cluster provisioner you’re connected to on your machine and create resources in that cluster. This process happens whether you have a cluster on Minikube, Kind, or any other cluster provisioner

So far, you’ve developed your application on a Kubernetes development environment and deployed it to a Kubernetes production environment with DevSpace.

Now, it’s time to check what resources DevSpace created in your cluster:

1. Run the kubectl command below to check (get) the namespaces (ns) DevSpace created in your cluster.

kubectl get ns

You should see that DevSpace created two namespaces, one for the development mode ( mynodeapp) and one for the production mode (mynodeapp-in-production).

Viewing namespaces created by DevSpace
Viewing namespaces created by DevSpace

2. Next, run the following command to get all other resources DevSpace created in your cluster.

kubectl get all

You should see that DevSpace created the following:

  • A pod to house your Node application as a Docker container.
  • A service to expose your application to port 4000.
  • A deployment to deploy your application.
  • And a replica set to run a single instance of your pod.
Viewing other resources created by DevSpace
Viewing other resources created by DevSpace

3. Lastly, run the below helm command to check the lists (ls) of helm charts available in your cluster.

helm ls

You’ll that DevSpace deployed your application as a Helm chart in the mynodeapp-in-production namespace.

Viewing helm charts created by DevSpace in the mynodeapp-in-production namespace
Viewing helm charts created by DevSpace in the mynodeapp-in-production namespace

Deleting Resources in DevSpace

Now that you’ve verified your application will perform as expected in a real-time Kubernetes environment, you can start deleting the resources DevSpace created.

1. Run the following devspace command to delete (purge) all resources in both the mynodeapp-in-production and mynodeapp namespaces.

devspace purge
Deleting all resources created by DevSpace
Deleting all resources created by DevSpace

2. Next, run the kubectl command below to list all available resources.

kubectl get all

The output below confirms all resources are deleted.

Confirming resources in mynodeapp-in-production namespace
Confirming resources in mynodeapp-in-production namespace

3. Run the following devspace command to instruct DevSpace to use the mynodeapp namespace.

devspace use namespace mynodeapp
Setting default DevSpace namespace (mynodeapp)
Setting default DevSpace namespace (mynodeapp)

4. Now, run the command below to delete all resources (purge) created by DevSpace in the mynodeapp namespace. devspace purge

devspace purge
Deleting all resources in the (mynodeapp) namespace
Deleting all resources in the (mynodeapp) namespace

5. Finally, run the below command to get all available resources and confirm no more resources are available in your cluster.

kubectl get all

The output below confirms there are no more resources in your mynodeapp namespace.

Confirming resources in the mynodeapp namespace
Confirming resources in the mynodeapp namespace

Conclusion

In this tutorial, you’ve learned how to initialize a project with DevSpace, start a development mode, and deploy your application onto Kubernetes.

You’ve seen how DevSpace allows you to redeploy applications when source code changes locally on development mode. And at this point, you can confidently expose your application to being easily accessible through a browser.

What kind of project will you be building with DevSpace next? Perhaps a Python project deployed to Kubernetes using DevSpace and opens up in the browser via a domain?

Hate ads? Want to support the writer? Get many of our tutorials packaged as an ATA Guidebook.

Explore ATA Guidebooks

Looks like you're offline!