Beta-Labs: MVC Architecture

" MVC is an acronym for Model-View-Controller "

It is a design pattern for software projects. It is used majorly by Node developers and by C#, Ruby, PHP framework users too. In MVC pattern, application and its development are divided into three interconnected parts. The advantage of this is it helps in focusing on a specific part of the application name, the ways information is presented to and accepted from, the user. It helps in allowing for efficient code reuse and the parallel development of the application.

Model: Model represents the structure of data, the format, and the constraints with which it is stored. It maintains the data of the application. Essentially, it is the database part of the application.

View: View is what is presented to the user. Views utilize the Model and present data in a form in which the user wants. A user can also be allowed to make changes to the data presented to the user. They consist of static and dynamic pages that are rendered or sent to the user when the user requests them.

Controller: Controller controls the requests of the user and then generates an appropriate response which is fed to the viewer. Typically, the user interacts with the View, which in turn generates the appropriate request; this request will be handled by a controller. The controller renders the appropriate view with the model data as a response.

So, to sum it up:

· Model is data part.

· View is User Interface part.

· Controller is request-response handler.

In short these are the steps:

A Request is sent to the server and handled by the application controllers.
Express.js and its routes can behave like controllers handling requests and determining whether to process the request further or send back a response.
The routes may also trigger more code logic in other modules, communicate with database, or render a view.
The client receives a response after the controller decides to generate views to send back.

Implementation of MVC

Step-1: First, initialize npm in a directory of your choice

npm init

Then accept all the default values by pressing the enter key. It will create the package.json file.

Step-2: Now we will install the Express framework and the basic packages for our application.

npm i express body-parser mongoose express-handlebars --save

express: Fast, efficient, minimalist web framework for node.
body-parser: Node.js body parsing middleware.
express-handlebars: A Handlebars view engine for Express.
mongoose: Mongoose is a MongoDB object modeling tool designed to work in an asynchronous environment.

After installing let’s have a look at the project setup.

Step-3: Project Setup- We have folders Model, View, Controller in our project, the directory structure is as follows:

Step-4: Create a database in MongoDB using the following steps:

Open Mongod Server
Open MongoDB Compass Community
Create database "studentDB" and a collection "students"

Step-5: Now create a folder in your application folder as "Models" and then create a file db.js for creating a connection with the MongoDB database.

db.js

const mongoose = require('mongoose');

mongoose.connect(

' mongodb://127.0.0.1:27017/studentDB',

{

useNewUrlParser: true,

useUnifiedTopology: true,

(err) => {

if (!err) {

console.log('MongoDB Connection Successful');

} else {

console.log('Error in Connection:' + err);

}

);

Step-6: Now create another file student.model.js in "Models" folder for creating a schema for the database, this will be used as a data-structure for getting data from the client and save in the database.

student.model.js

const mongoose = require('mongoose');

var studentSchema = new mongoose.Schema({

fullName: {

type: String,

email: {

type: String,

mobile: {

type: String,

city: {

type: String,

registerOn: {

type: Date,

default: Date.now,

});

mongoose.model('Student', studentSchema);

Step-7: Now create express app in file server.js that listen at Port 3000.

server.js

// Importing Models in Express App

require('./models/db');

const express = require('express');

// App Port

const app = express();

app.listen(3000, () => console.log('App started at 3000'));

Step-8: Now create another folder in your application folder as "Controllers" and then create a file studenController.js for creating routes of the application.

studenController.js

const express = require('express');

const router = express.Router();

router.get('/', (req, res) => {

res.send('sample Text');

});

module.exports = router;

Step-9: Update server.js by importing controller and router middleware.

server.js

// import controller

require('./models/db');

const studentController = require('./controller/studentController');