Skip to content
Sandny Blog
  • Home
  • Java
  • JavaScript
  • AWS
  • Embedded
  • About
nodemon to build api Express.js

babel + express.js + node.js + nodemon to build…

  • October 30, 2017August 26, 2018
  • by Coder Kai

This guide will take you through on how to use nodemon to build api which is simply to create a web app with node.js + express.js in a babel environment. Often we need to use babel to increase readability of our code. And nodemon was used to watch and re-build the project and serve it consistently.

Nodemon to build api

As a prerequisite, you will have to install the node.js and npm/yarn in your environment. I will be using yarn as it will make the . package maintenance easy. But I have included the npm command as well for your convenience.

First, initiate the project with

yarn init
--------npm--------
npm init

Then install the project dependencies. I have run following in the terminal to install express(https://expressjs.com/), babel and nodemon(https://nodemon.io/).

yarn add express
yarn add --dev babel-preset-env
yarn add --dev nodemon

--------npm--------
npm install express
npm --save-dev babel-preset-env
yarn --save-dev nodemon

The babel-preset-env will install the presets es2015, es2016, es2017 along with some other(http://babeljs.io/docs/plugins/#presets). After that, you can add the script to start nodemon in the package.json.

 "scripts": {
   "start": "nodemon src/app.js --exec babel-node --presets babel-preset-env"
 },

Here babel-node is provided with the babel-cli. More of its usages are in the official doc: http://babeljs.io/docs/usage/cli/
Now all are set. We need to add the app.js file which I have specified in the script above. Create a filesrc/app.js and add the hello world code mentioned below.

import express from 'express'

const app = express();

app.get('/', function (req, res) {
 res.send('Hello World!')
});

app.listen(3000, function () {
 console.log('Example app listening on port 3000!')
});

Then run the app you have build. Run yarn start on the terminal. You will see an output like below in the terminal.

$ yarn start
yarn start v0.27.5
$ nodemon src/app.js --exec babel-node --presets babel-preset-env
[nodemon] 1.12.1
[nodemon] to restart at any time, enter `rs`
[nodemon] watching: *.*
[nodemon] starting `babel-node src/app.js --presets babel-preset-env`
Example app listening on port 3000!

The github link for the above project is: https://github.com/sandaruny/node-express-babel

How to create a Vertx EventBus js client and use it with a web server with CORS
Debounce and avoid multiple clicks event generation on React.js components using Lodash
Coder Kai
A humble developer
api babel babel-preset es2015 es2016 es2017 es5 es6 es7 express express.js hello world hot reloading javascript node node.js nodemon npm sever yan start yarn

Related articles

Multiple refs for an array of React Elements
Using multiple refs for an…
Immutable and Mutable Values in Javascript
07. Immutable and Mutable Values…
wrapper objects in javascript
06. Wrapper objects in Javascript
globals undefined and null values in javascript
05 Global, null and undefined…
Javascript Booleans and Equality
04. Javascript Guide Booleans and…
How to add Chakra UI Animations
Chakra UI Animations
SSL Websocket using Nginx Proxy
SSL Websocket proxy with Nginx…
Change python version correctly
Python is not setting correct…
optimize React.js load time
How to optimize React.js app…
Multiple refs for an array of React Elements
How to use IntersectionObserver to…
Multiple refs for an array of React Elements
How to dismiss dropdowns when…
Javascript guide Strings
03. Javascript Guide – Strings
How to fetch data with useEffect
How to fetch data with…
add styles to stripe elements
How to add styles to…
Typescript
How to use Typescript with…
how to optimize react-native map view
How to optimize react-native map…
debounce with react hooks
Avoid multiple clicks using debounce…
Numbers inJavascript
02. Javascript Guide – Numbers
Introduction to Javascript
01. Javascript Guide – Introduction…
Nginx Load Balancer with docker…

Categories

  • android 3
  • Apollo Client 1
  • AWS 8
    • AppSync 5
    • EC2 1
    • EKS 1
    • Route53 1
    • S3 1
  • AWS Amplify 1
  • Chakra UI 1
  • Docker 1
  • Embedded 1
  • EmberJS 1
  • FCM 1
  • Godaddy 1
  • GraphQL 3
  • ios 1
  • Jasper 1
  • Java 10
    • Java 11 1
    • Java 14 1
  • JavaEE 2
  • JavaScript 39
    • Express.js 4
    • Javascript Guide 7
    • Node.js 3
    • react-native 4
    • React.js 17
    • Typescript 1
  • Kubernetes 1
  • machine learning 1
  • Maven 2
  • OCaml 3
  • PostgreSQL 1
  • Python 2
  • react-native 4
  • ReactJS 3
  • sass 1
  • Server 6
  • spark 1
  • Terraform 2
  • Ubuntu 4
  • Uncategorized 1
  • webpack 2

Recent Comments

  • pg soft on Android/iOS React-native heap limit allocation failed error
  • pengeluaran china on Android/iOS React-native heap limit allocation failed error
  • jeannette on How to create Lambda function with Terraform

Meta

  • Log in
  • Entries feed
  • Comments feed
  • WordPress.org

Archives

  • October 2022 3
  • September 2022 7
  • May 2022 1
  • December 2021 1
  • August 2021 1
  • July 2021 6
  • June 2021 3
  • February 2021 1
  • July 2020 1
  • December 2019 5
  • November 2019 6
  • October 2019 3
  • August 2019 1
  • March 2019 1
  • February 2019 1
  • January 2019 2
  • December 2018 1
  • September 2018 2
  • August 2018 1
  • June 2018 1
  • February 2018 1
  • November 2017 2
  • October 2017 5
  • September 2017 1
  • June 2017 1
  • May 2017 10
Sandny Blog space
Theme by Colorlib Powered by WordPress