Javascript — Create a simple server with Express

Today I’ll be talking about how we can make a very simple server in no time using one of the most popular JS frameworks — ExpressJS.

First of all — What is Express?

Express is a super lightweight web framework that can help you build your web application into an MVC structure on a server. You can use it to serve HTML with a bunch of different templating languages or use it to build a backend API. This is what we’re doing today.

You also have to possibility to connect your Express application to a database such as MongoDB using a framework like Mongoose which makes it easy to connect to your database, create schemas and fetch data.

What are we building?

We’re building a very simple web server. This will not be extremely useful for now, but it’s a good start with ExpressJS. We’ll also discuss the difference between POST and GET.

Let’s get into it!

First, let’s make sure you have NodeJS installed on your computer. Do this by running the below command in a terminal window:

If not, then install the LTS version here ☝️

Now that you have NodeJS installed, we need to initialize a new NodeJS project. Do that by going into your terminal and navigating to the folder you want the project to be and running:

For now, you can answer the questions or just press ‘enter’ all the way through and press ‘y’ when it prompts you. Now you’ve generated a package.json file and if you open it in your favorite code editor (i use VSCode), you’ll see something like this:

Package.json is a file that holds all the metadata on your project. It’s very small at the moment but can grow rather large over time. The ‘main’ is the file that’ll be run to start your project. This is your main script and is usually ‘index.js’ although you can change it to whatever you want.

Let’s install ExpressJs

We do that by running:

We’re writing ‘ — save’ to make sure we’re only installing express for the project and not on the computer file system.
If done correctly, it should look something like this:

Let’s write our first lines of code

Create a file in the root directory called ‘index.js’ and open it. Now the first words you want to write are:

const express = require('express')
const app = express()

This code will import the express module and and initliaze a new express object called ‘app’. Now we need to be able to start the server and we can that by typing:

app.listen(6000, () => {
  console.log('We are live at localhost:6000')
})

6000 is the port number of our choice. We can change that if we want to.

Let's create our first route. That way we can see it working. It’s important that this code snippet is above the ‘app.listen()’ function. We do that by typing in:

app.get('/', (request, response) => {
  response.send('Hello World')
})

Now let’s start our server up and see it in action. Do that by typing the below command in the terminal window. It’s important that you are in the directory that your project is:

If done correctly, you should see something like this:

And if you navigate to ‘localhost:1337’ you should see this:

Difference between GET and POST

In this tutorial, we’ve only been using a GET request. Moving forward in some of the upcoming blog posts, we’ll also be using a POST request.

The difference can be explained quite simply.

When you’re asking the server for data, it’s a GET request. For example when fetching all posts from a user on any social media.

When you’re sending data to the server, it’s a POST request. This is useful when logging in or submitting a new blog post to a website.

And that’s it!

Congratulations! You just created your very own and first webserver! Now I know that it’s not really that useful yet, but you dipped your toe in and now we’re ready to move on to bigger projects. Moving on we’ll be building a simple rest API, automated cron, login, and much more.

Stay tuned by following me on Twitter. If you have any comments, feedback, or maybe an idea for a tutorial you want to see, hit me up and I’ll gladly talk to you ☝️ I’ll be posting a new blog post every Monday.

Any love in form of claps or comments on this blog post, so we can spread the word, would be greatly appreciated 😁

If you want to see more of my tutorials then go here ☝️

As always, thank you for reading, and remember to keep on coding on 💙

All the best,

Jonas A.