Expressjs: Javascript written in ECMAScript 2015 (ES6)

Prerequisites

This tutorial assumes that you have the following:

• Basic knowledge of Node
• Node installed on your machine
• Any code or text editor of your choice

Initially, create Express application with command in terminal.

npx express-generator < your-project-name > --no-view

Here, --no-view flag means that we will not use any template engine such as handlebars, ejs or pug, for our skeleton Express application.

After creating your application, you need to go to your application directory. For Windows Powershell and Linux terminals, use:

cd your-project-name

Then open your desired text editor. For me I only use VSCode so I have my terminal and my text editor open at the same time. But you can use any text editor you want.

Install dependencies with the following command:

npm install

Once we have the generated project ready, we need to install the dependencies and move some folders. Run this command to install other packages.

Here we can use three different kinds or methods to do our job with ease.

First Method:

Type the following in terminal:

npm install esm

and also install nodemon for specific project only as

npm install --save-dev nodemon  or npm install -D nodemon

Nodemon automatically restarts your application and allows you to test new changes to your Express app faster, or install as a global NPM dependency

npm install -g nodemon  

Enable esm for packages: Use esm to load the main ES module and export it as CommonJS in the main entry file, index.js.

require = require("esm")(module);
module.exports = require("./app.js");

create a new file, app.js and add the following.

const express = require('express');
import express from 'express';

var app = express();
var PORT = 3000;

app.listen(PORT, function(err){
    if (err) console.log("Error in server setup")
    console.log("Server listening on Port", PORT);
})

run the app with:

npm start

at this stage if you had any problems use the
codesendbox link as a reference.

Second Method:

add the following in project's package.json file.

"type": "module"

and voila, but you need to add extensions with all files, which you want to add as import, like (filename.js), as example:

import userRoutes from './routes/userRoutes.js';

at this stage if you had any problems use the
codesendbox link as a reference.

Third Method:

using Babel setup

What is Babel?

Babel is a JavaScript compiler, that helps you use the ES6 functions of the JavaScript programming language.

add the following packages, we use the command

npm install --save-dev @babel/core @babel/cli @babel/preset-env @babel/node babel-plugin-module-resolver rimraf

or

npm install -D @babel/core @babel/cli @babel/preset-env @babel/node babel-plugin-module-resolver rimraf

after installing the packages, add the following in project's package.json file.

"scripts": {
    "build": "npm run clean && babel ./src --out-dir dist --copy-files",
    "clean": "rimraf dist",
    "prod": "npm run -s build",
    "start": "node dist/app.js",
    "dev": "nodemon --exec babel-node src/app.js"
},

So once you are done with the installation, create a new file called .babelrc to configure babel. Add the following text in it.

{
  "presets": ["@babel/preset-env"],
  "plugins": [
    [
      "module-resolver",
      {
        "alias": {
          "@routes": "./src/routes"
        }
      }
    ]
  ]
}

conclusion

We learned how to use ES6 in our Node.js project to write the latest JavaScript functions in the best way.

Feel free to check the code on GitHub Repository if you had any trouble following the last part of this article, when we included Babel as a JavaScript compiler.

If you have any questions or comments about this article, please do not hesitate to reach out.

Thank you for reading.

Credits

Express.js, the minimal and flexible Node.js web application framework: https://expressjs.com/

Esm, Tomorrow's ECMAScript modules today!: https://github.com/standard-things/esm#readme

Nodemon, reload, automatically: https://nodemon.io/

Babel, is a JavaScript compiler: https://babeljs.io/docs/en/usage