Scaffolding an ExpressJS app from scratch
Scaffolding is creating the skeleton structure of application. It allows users to create own public directories, routes, views etc. Once the structure for app is built, user can start building it.
Express is the open source web development framework for Node.js for building web applications and the APIs. To install express in the Node.js environment use the NPM (Node Package Manager).
npm install express --save
To use express in the Node, use the following syntax:
var express = require('express');
Prerequisites: Node.js should be installed beforehand.
Use the link to learn about prerequisites:
Using express-generator package to install ‘express’ command line tool. express-generator is used to create the structure of application.
1. Navigate to the folder where app is to be built out using the terminal.
2. Now in the terminal, install express-generator using the following command.
npm install express-generator -g
Note: npm installs the packages in two ways: locally (default) and globally
The packages installed locally are local to the current project and the packages installed globally are global packages which once installed can be used anywhere in your system.
Scaffolding the app:
Below image shows the scaffolding of the application. Basic structure of the application is being created if observed. Public directories, paths, routes, views, etc. are being created which would form the structure of application.
The project folder is constituted of various folders/files which can be seen in image. Comparing the scaffolding structure and the project structure it can be clearly seen that the folders/files created in structural mode are present in project folder which was the purpose of scaffolding the application.
Explaining the files/folders in project.
1. bin: The file inside bin called www is the main configuration file of our app.
r3. outes: The routes folder contains files which contain methods to help in navigating to different areas of the map. It contains various js files.
4. views: The view folder contains various files which form the views part of the application.
Example: homepage, the registration page, etc.
Note: The extension of the files at the time of writing this article is .jade. Change these file extensions to .pug as the jade project has changed to pug.
In the app.js file, change the following code: app.set('view engine', 'jade'); (most probably in line 15) to : app.set('view engine', 'pug'); This will change the view engine to pug.
5. app.js: The app.js file is the main file which is the head of all the other files. The various packages installed have to be ‘required’ here. Besides this, it serves many other purposes like handling routers, middle-wares etc.
6. package.json: package.json file is the manifest file of any Node.js project and express.js application.
It contains the metadata of the project such as the packages and their versions used in the app (called dependencies), various scripts like start and test (run from terminal as ‘npm start’), name of the app, description of the app, version of the app, etc.
Running the Scaffold app:
Install all the dependencies mentioned in the package.json file required to run the app using the following command:
After the dependencies are installed, run the following command to start the ExpressJs app: