Development of Node JS skillsets

Node JS API and Middleware

Node JS, is a brilliant frame work for creating servers and device independent API's using the browser and web servers: Below I will demonstrate how to create a Node JS application that can be linked to a local or cloud based Mongo DB database.

Furthermore I will demonstrate how to use Express, in terms of routing, data modelling and views - as well as pass data to the front end (html files) using dynamic pages. Additionally this demonstration also used modern JavaScript.

Setting up Server

We begin by creating an app.js file - you can name it as you please, but this tends to be the convention - this is the main app or programmed that will run and link to other files via the required statements.

Required statement: express, morgan, mongoose, blogRoutes.

Express will be used to create an instance of of a server that can access express' functionality for creating a server (such as the app and app.listener, app.use and app.get (verbs used for a restful applications). Here callbak are used to function chain the server listing for requests to port 3000, and catch the error.

Middleware - Main App file

Middleware is effectively any software used between request calls - typically any use of the app.use and app.set function is middleware; it is important to remember middleware will be called int the order it is placed and even if middleware is between restful verbs in the application (get,post,update,delete) - if the verb's url is not found the middleware will be called; as such placing middle ware at the end of the application (app.use) allows one function to act an as error page.

Also if the next function is not called withing middleware - the application will get stuck withing that piece of middle ware called.

Below Middware has been used to :

Setup the view engine, here I am using ejs (this allows the render functionlaity, as well as dynampic page creation using partials I will explain later.

Setup a public directory to allow the front end of the applications to access any files in this directory -such as style.css files.

Setup the urlencoded data, to allow access to data sent to the server from the front end such as data from form submitions.

Set up the use of morgan('dev') - to return development data and request lod info find out more here: https://www.npmjs.com/package/morgan and https://www.loggly.com/ultimate-guide/node-logging-basics/

Finally middleware is used to call the routing funcationality and error handler (404 page)

Still looking at the image above, if a request is made to the generic local host/ip address it is redirected the request for '/plants' - this will make a request to the express router, and to the middleware app.use('/plants','plantRoutes',(req,res,next)) . Making use of the global express router defined at the top of the file.

Error handling - your also see that I use the 'next()' function as an argument in the various verbs used in the REST API; this allows the error to be passed through the middleware, and stops the program being stuck inside the middleware; eventually all errors pass through an error logging middleware and sequentially then into the error handler for displaying an all in one error page. The error logger writes all error to a txt file - this is good practice for managing a server.

Express Router

The express router in the main app directs all request the start with '/plants' to the router file - the router is a methodology for spiting up the app into categorised components and allows for maintenance to be made easier.

What this means is we have create one route for all '/plant' request - and thus any request for plant data will be found in the plant controller. The routes file will be placed in a 'route' folder in the map app project directory.

The router calls on the functionality of the controller file that will be looked at next.

Note: the /plants/create request must be placed before the /plants/id request - as the req.parame.id will connet to /create as an id and cause an error - never finding the the unique key use in the Mongo DB database.

Data Model

The data model takes the form of an JSON object that will map to a Mongo DB database - via the use of the Mongoose data modelling libray and NPM installion.

The data model file will be placed within a models folder that will be created in the main project directory. The data model must use the Schema based rule set to work.

Note: for the controller class/file to function we need a data model for access the Mongoose data base and submiting data to it. A models folder is added to the main app and contains the data model files.

Controller

The data model takes the form of an JSON object that will map to a Mongo DB database - via the use of the Mongoose data modelling libray and NPM installion.

The data model file will be placed within a models folder that will be created in the main project directory. The data model must use the Schema based rule set to work.

Note: for the controller class/file to function we need a data model for access the Mongoose data base and submiting data to it. A Models folder is added to the main app and contains the data model files.

The controller basically has functions that control the data sent to the views and the data that we get, post, and delete from the data base.

This is where Mongoose is used in sync with the data models to pull and post data using the find(), sort(), new model(req.body) and model.save() funtionality.

Also the id in the url is acquired by accessing the req.params.id variable - that is made accessible due to the url encoded middleware in the map app file.

The data model plantInfo is used to pass data to the various views as well as any other variables such as the error - by placing this data into an object the the render function of EJS

View and Partial View

All views are ejs files, basically making a index.html file and saving it as index.ejs - because the ejs view engine is being used.

A views folder is made in the main project directory - that holds all view files, in this case a plants folder is made in the views directory containg all views that are to do with plants.

As partials folder is created in the view folder - this folder will contain all partical ejs views that hold view components such as nav, footer, header and any other component of a view that can be included in a view, meaning all aspect of the views are compartmentalised.

Note: When access files './filepath' is used to access a file in same directory as the app, or '../filepath' when the file is in a directory that needs to exit two folders.

Project completed!

This project was so much fun - and essentially goes over the use of Node JS as an API for access data from a database and presenting it to the front end; IT was incredible fund creating middleware using the app.use functionality, and an error handler. I have soem references for those who wish to learn Node JS to look into and also thankfull these people all made content and tutorials available online!

I must thank the guys below; they really helped me upskill with Node JS

Net Ninja: https://www.youtube.com/channel/UCW5YeuERMmlnqo4oq8vwUpg

webdev Simplified https://www.youtube.com/channel/UCFbNIlppjAuEX4znoulh0Cw

GeeksforGeeks: https://www.geeksforgeeks.org/express-js-req-xhr-property/

Nodes Best Practices: https://levelup.gitconnected.com/node-js-best-practices-using-modern-features-1f5a4a189ec8

Mission

To digitally transform organisations and entities, creating a web presence through the exclusive use of Node JS and servers.

Vision

This is a Paragraph. Click on "Edit Text" or double click on the text box to start editing the content and make sure to add any relevant details or information that you want to share with your visitors.