Jadge
Run multiple node.js environments with a single command

Run multiple node.js environments with a single command

Easily setup a script to start both client and server environments

Judge-Paul Ogebe's photo
Judge-Paul Ogebe
·

5 min read

Introduction

If you have a repository with two or more environments, let's say your client and server folders and you want to easily start both environments with one command and also get the outputs of both processes in the same terminal window then this article is for you.

Tutorial

Before starting this tutorial ensure you're using bash or a similar shell, if you are using Mac or Linux and use the default shell then you're good (if you don't know what the default shell is then you are good as well). If you use Windows then it might be a bit more complicated to follow along using Command Prompt or Powershell, the best way to follow along with Windows is to download Git Bash.

In your root directory (the folder that contains both folders you are trying to set up start scripts for) create a package.json using your preferred package manager.

npm init -y

In the scripts section create two scripts for starting the client and server folders. In my case, I use npm run dev to start my development server on both my Next.js and Node.js/Express servers.

Pro Tip: Ensure your client and server environments are configured to run on different ports, in my case the client runs on port 3000 and the server on port 8080

// package.json
{
    "name": "playlist-pro",
    "main": "index.js",
    "scripts": {
        "dev-client": "cd client && npm run dev",
        "dev-server": "cd server && npm run dev",
    },
}

You can test if these scripts are working by running npm run dev-client and npm run dev-server

Now you might think that you can just start both servers by running npm run dev-client && npm run dev-server but the issue with this has to do with the way the && command works which means run the first command and when that completes run the next command, but since the first command starts a process that doesn't finish by itself (cause it's running a development server) the second command won't run so it's the same thing as running npm run dev-client.

Taking this into account we have two possible solutions available;

  1. Run one command as a background process

  2. Run both processes concurrently using the concurrently package (Recommended)

Run one command as a background process

The first solution is to start the first process and run it as a background process using the & command which still displays the logs in that same terminal.

So you can create a general dev script

{
    "name": "playlist-pro",
    "main": "index.js",
    "scripts": {
        "dev": "npm run dev-client & npm run dev-server",
        "dev-client": "cd client && npm run dev",
        "dev-server": "cd server && npm run dev",
    },
}

What the above dev script does is it runs the dev-client script and hands it over to a background process and then runs the dev-server script in that terminal process. So both processes are running but the issue with this is you can only kill the second process from that terminal, to kill the first process you need to manually do that by shutting down your PC, using the Task Manager, or finding the Process ID and using the kill command to terminate the process.

Think of it like an asynchronous operation or worker thread in JavaScript

Run both processes concurrently

Another way to set this up so you can have logs from both processes and be able to stop both at the same time is by using the concurrently package.

Install the package as a dev dependency using npm i -D concurrently
Next create a new script to use the concurrently package to run both processes

{
    "name": "playlist-pro",
    "main": "index.js",
    "scripts": {
        "dev": "concurrently \"npm run dev-client\" \"npm run dev-server\"",
        "old-dev": "npm run dev-client & npm run dev-server",
        "dev-client": "cd client && npm run dev",
        "dev-server": "cd server && npm run dev",
    },
}

As you can see it is very easy to tell which logs belong to what process. We passed the command to start the Next.js server to the first argument so it's represented by 0 and the Node.js/Express server to the second argument which is represented by 1 but the most important thing about this is that concurrently handles running the processes so when you kill it, it turns off both processes without additional work.

PS: If you have git setup you should create a .gitignore file at the root of your project so you don't accidentally push the node_modules folder to GitHub, you can also add the package.json if you don't want to share this setup.

Conclusion

After following this tutorial you should be able to efficiently manage multiple node.js environments, you can take this a step further and create different scripts for running a development and production environment.

Thanks for following this article to the end, my name is Judge-Paul Ogebe, and I am a software engineer and technical writer, if you gained anything from this article consider giving it a like or sharing it with someone else.

If you want to check out the GitHub repository I used for this tutorial you can view it here. The web app is a YouTube playlist downloader

PS: If you noticed any issue with this article or you just want to reach out to me for any reason, send me a DM on twitter or a mail.

JavaScriptNode.jsnpmScriptBash