How to use Node.js with Atom IDE [Step-by-Step]

This tutorial shows you how to use Node.js with Atom IDE step-by-step. We will install Node.js and Atom IDE on Ubuntu 22.04. Next, we will configure the IDE to simplify building Node.js projects on it. Finally, we will create a simple web server on the IDE.

Let's get started.

 

Install Node.js

Check if Node.js is installed

The first step toward learning how to use Node.js with Atom IDE is checking whether your system has Node.js and Atom IDE.

Launch the terminal and check the binaries

$ which node
$ which npm

or Node and NPM versions.

$ node -v
$ npm -v

Node.js gets installed with its package manager, NPM, for installing, updating, and deleting packages.

Output

Receiving the following message confirms that your system lacks a Node.js installation.

user@hostname:~$ which node
user@hostname:~$ which npm
user@hostname:~$ node -v
Command 'node' not found, but can be installed with:
sudo apt install nodejs
user@hostname:~$ npm -v
Command 'npm' not found, but can be installed with:
sudo apt install npm

Besides, you may need to install a higher Node.js version than the one in the OS repositories. Let's do that right away.

 

Install Node.js from the source

Although there are multiple ways to install Node.js, we will get it from the source. By so doing, we can pick a Node.js version of choice.

Here are the steps.

Update and upgrade the system.

sudo apt update
sudo apt upgrade

Using curl, download Node.js 18+ from the sources. Before that, it may be necessary to install the curl tool.

# install curl
$ sudo apt install curl

# download the files from Node.js sources to Ubuntu repositories
$ curl -fsSL https://deb.nodesource.com/setup_18.x | sudo -E bash -

Now, let's install the downloaded files.

$ sudo apt-get install -y nodejs

Lastly, verify the installations.

$ node -v
$ npm -v

Node.js and NPM should be available on your system.

 

Install Atom IDE

Before installing Atom

Update and upgrade the system. Next, install the dependencies to accommodate the IDE, and download the IDE's GPG keys into the Ubuntu sources list.

# Update the system
$ sudo apt update

# Upgrade the system
$ sudo apt upgrade

# install dependencies
$ sudo apt install software-properties-common apt-transport-https wget

# Download Atom's GPG Keys
$ wget -q https://packagecloud.io/AtomEditor/atom/gpgkey -O- | sudo apt-key add -

# Import the repository to Ubuntu list sources
$ sudo add-apt-repository "deb [arch=amd64] https://packagecloud.io/AtomEditor/atom/any/ any main"

Installing Atom

Lastly, install Atom IDE from Ubuntu list sources.

$ sudo apt install atom

You should get an output similar to mine:

user@hostname:~$ sudo apt install atom
Reading package lists... Done
Building dependency tree... Done
Reading state information... Done
The following NEW packages will be installed:
  atom
0 upgraded, 1 newly installed, 0 to remove and 0 not upgraded.
Need to get 139 MB of archives.
After this operation, 668 MB of additional disk space will be used.
Get:1 https://packagecloud.io/AtomEditor/atom/any any/main amd64 atom amd64 1.60.0 [139 MB]
Fetched 139 MB in 2min 29s (928 kB/s)                                                                                                                                          
Selecting previously unselected package atom.
(Reading database ... 230660 files and directories currently installed.)
Preparing to unpack .../archives/atom_1.60.0_amd64.deb ...
Unpacking atom (1.60.0) ...
Setting up atom (1.60.0) ...
Processing triggers for desktop-file-utils (0.26-1ubuntu3) ...
Processing triggers for gnome-menus (3.36.0-1ubuntu3) ...
Processing triggers for mailcap (3.70+nmu1ubuntu1) ...

Otherwise, you can try installing the IDE through the snap tool or the Ubuntu Software Center.

 

Use Node.js with Atom IDE

Now that we have installed the key software, let's set up a lab environment and use the setup to practice how to use Node.js with Atom IDE.

 

Lab environment setup

Launch the terminal and create the project directory and the script file.

$ mkdir projectDir && cd projectDir
$ touch index.js

Now open the directory with Atom in readiness to explore how to use Node.js with Atom IDE.

 

Open the project directory with Atom

$ atom .

The dot . means we are opening the current working directory in Atom IDE. Otherwise, we could specify the directory path.

$ cd
$ atom projectDir

Let's install some packages to ease using Node.js with Atom.

 

Install packages

On the Atom interface, navigate to the path Edit → Preferences → Install, or use the short ctrl+shift+p followed by searching install package

and install the following packages:

• script: Run Node.js code based on the file name or line-by-line.
• platformio-ide-terminal: Run the script file on Atom's terminal emulator.
• file-icons: Distinguish .js files from other file types.
• atom-beautify: Reformat code for readability

We can also install a package from atom.io.

 

For example, we can get the script package from atom.io/packages by searching for the script package, and clicking on the Install button.

If you cannot see the Install button, install the package using the apm command.

sudo apm install script

Now we can develop the web server in the index.js script file before running the file in Atom.

 

Develop the project

Open the index.js file and write this code.

const { createServer } = require("http");

const server = createServer( (req, res) => {
  if (req.url === "/")
  res.end("Hello world, I know how to use node.js with Atom IDE!")
});

const PORT = process.env.PORT || 3000;

server.listen(PORT, console.log(`You can make requests on http://localhost:${PORT}.`));

We import the http module's createServer() method to create a server which listens for requests on port 3000.

If we make a request on the slash / endpoint, the server responds with a message Hello world, I know how to use node.js with Atom IDE!

 

Execute a sample script file

Open the terminal emulator using the ctrl+` shortcut.

What did you notice? 

A terminal emulator scrolls into view. We can then run the file with the node command.

node index.js

We receive the message You can make requests on http://localhost:3000.

 

Visit the URL and see if you get the custom message Hello world, I know how to use node.js with Atom IDE!

 

Conclusion

Mastering how to use node.js with Atom IDE is simple. All you do is install Node.js followed by Atom IDE and the required packages, as shown in this tutorial. You can then familiarize yourself with the rich IDE by developing Node.js projects on it.