SlideShare a Scribd company logo
MVC
Model View Controller
MVC purpose?
● An architecture for separating
components of a large code block by
abstracting components of a large code
base into smaller manageable pieces.
● Can be used to structure code of any language
MVC components?
● Model - database management
● View - user interface
● Controller - logic for user requests
MVC.pptx
Model purpose?
● The model in MVC architecture is responsible
for manipulating the data.
● Structuring data.
● Inserting, deleting, updating…
● Never interacts with the view directly
Model example
● The model will define what an acceptable piece of data
should look like.
● Any piece of data not adhering to the model structure
should not be allowed into the database.
Model
Student {
Name: String
Class: String,
Grade: Number,
}
Valid
Student {
Name: “Bob”,
Class: “Math”,
Grade: 80,
}
Not Valid
Student {
ID: 808,
Class:501 ,
Grade: “Pass”,
}
Model using mongoose schema
const mongoose = require(‘mongoose’);
const StudentSchema = new mongoose.Schema({
Name:{ Type: String },
Class:{Type: String},
grade:{Type: Number}
})
Module.exports = mongoose.model(‘Student’, StudentSchema)
View purpose?
● The view is responsible for displaying the
data
● The view never interacts directly with the
model, instead the controller proxys any
data the view may need
View examples
Views provide the user interface in the MVC
architecture and can be simple html or
template engines like EJS and Express-
Handlebars
<%= EJS %>
Controller
● Can be more than one controller in a
project
● Each controller has a specific route or
responsibility with a particular resource
Controller purpose?
● Handles any logic required from user
requests
● The controller acts as a hub for user
requests through the view and retrieval or
modification of the database by way of the
model
Controller answering a request from the
user
//inventory router directs request to applicable
controllers
Router.get('/',inventoryController.getInventory)
Router.post('/', inventoryController.addPart)
● Router has determined controllers responsible for
specific resources to handle requests
const Parts = require("../models/Part");//MODEL
module.exports.getInventory = async (req,res)=>{
//requesting parts from MODEL
const allInventory = await Parts.find()
//VIEW response
res.render('inventory.ejs',{inventory:allInventory})
}
● Controller has ability to query the model for any data
necessary to fulfill the request given by the router
● Once any logic necessary is complete, the view is
provided with any necessary data and then presents
the user with an interface to interact with.
Controller example
student.ejs
MONGODB
/controller/student.js
Const Student =
require(‘./models/student’)
Module.exports.getStudents =
(req,res)=> {
Const allStudents = Student.find();
res.render(students.ejs,{students:allstu
dents})
}
MONGOOSE
./models/student
Server.js
Const studentRoutes=
require(‘./routes/student.js’)
app.use(‘/inventory’,studentRoutes)
/routes/student.js
Const studentCtr=
require(‘./controller/student.js’)
app.get(‘/’, studentCtr.getStudents)

More Related Content

Similar to MVC.pptx

MVC architecture
MVC architectureMVC architecture
MVC architecture
Emily Bauman
 
ASP.NET MVC Presentation
ASP.NET MVC PresentationASP.NET MVC Presentation
ASP.NET MVC Presentation
ivpol
 
Asp.net mvc
Asp.net mvcAsp.net mvc
Asp.net mvc
Taranjeet Singh
 
Model-View-Controller: Tips&Tricks
Model-View-Controller: Tips&TricksModel-View-Controller: Tips&Tricks
Model-View-Controller: Tips&Tricks
Ciklum Ukraine
 
Mvc
MvcMvc
MVC
MVCMVC
MVC
akshin
 
Sitecore MVC (User Group Conference, May 23rd 2014)
Sitecore MVC (User Group Conference, May 23rd 2014)Sitecore MVC (User Group Conference, May 23rd 2014)
Sitecore MVC (User Group Conference, May 23rd 2014)
Ruud van Falier
 
Asp.Net MVC Intro
Asp.Net MVC IntroAsp.Net MVC Intro
Asp.Net MVC Intro
Stefano Paluello
 
Using a model view-view model architecture for iOS apps
Using a model view-view model architecture for iOS appsUsing a model view-view model architecture for iOS apps
Using a model view-view model architecture for iOS apps
allanh0526
 
Spring Framework-II
Spring Framework-IISpring Framework-II
Spring Framework-II
People Strategists
 
Principles of MVC for PHP Developers
Principles of MVC for PHP DevelopersPrinciples of MVC for PHP Developers
Principles of MVC for PHP Developers
Edureka!
 
Introduction to ASP.NET Core MVC and the MVC Pattern.pptx
Introduction to ASP.NET Core MVC and the MVC Pattern.pptxIntroduction to ASP.NET Core MVC and the MVC Pattern.pptx
Introduction to ASP.NET Core MVC and the MVC Pattern.pptx
QuickwayInfoSystems3
 
Technoligent providing custom ASP.NET MVC development services
Technoligent providing custom ASP.NET MVC development servicesTechnoligent providing custom ASP.NET MVC development services
Technoligent providing custom ASP.NET MVC development services
Aaron Jacobson
 
ASp.net Mvc 5
ASp.net Mvc 5ASp.net Mvc 5
ASp.net Mvc 5
ahmedxp kh
 
Asp.net c# MVC-5 Training-Day-1 of Day-9
Asp.net c# MVC-5 Training-Day-1 of Day-9Asp.net c# MVC-5 Training-Day-1 of Day-9
Asp.net c# MVC-5 Training-Day-1 of Day-9
AHM Pervej Kabir
 
Asp.net With mvc handson
Asp.net With mvc handsonAsp.net With mvc handson
Asp.net With mvc handson
Prashant Kumar
 
Jinal desai .net
Jinal desai .netJinal desai .net
Jinal desai .net
rohitkumar1987in
 
Mvc
MvcMvc
Mvc
abhigad
 
Asp.net mvc
Asp.net mvcAsp.net mvc
Asp.net mvc
erdemergin
 
angularJs Workshop
angularJs WorkshopangularJs Workshop
angularJs Workshop
Ran Wahle
 

Similar to MVC.pptx (20)

MVC architecture
MVC architectureMVC architecture
MVC architecture
 
ASP.NET MVC Presentation
ASP.NET MVC PresentationASP.NET MVC Presentation
ASP.NET MVC Presentation
 
Asp.net mvc
Asp.net mvcAsp.net mvc
Asp.net mvc
 
Model-View-Controller: Tips&Tricks
Model-View-Controller: Tips&TricksModel-View-Controller: Tips&Tricks
Model-View-Controller: Tips&Tricks
 
Mvc
MvcMvc
Mvc
 
MVC
MVCMVC
MVC
 
Sitecore MVC (User Group Conference, May 23rd 2014)
Sitecore MVC (User Group Conference, May 23rd 2014)Sitecore MVC (User Group Conference, May 23rd 2014)
Sitecore MVC (User Group Conference, May 23rd 2014)
 
Asp.Net MVC Intro
Asp.Net MVC IntroAsp.Net MVC Intro
Asp.Net MVC Intro
 
Using a model view-view model architecture for iOS apps
Using a model view-view model architecture for iOS appsUsing a model view-view model architecture for iOS apps
Using a model view-view model architecture for iOS apps
 
Spring Framework-II
Spring Framework-IISpring Framework-II
Spring Framework-II
 
Principles of MVC for PHP Developers
Principles of MVC for PHP DevelopersPrinciples of MVC for PHP Developers
Principles of MVC for PHP Developers
 
Introduction to ASP.NET Core MVC and the MVC Pattern.pptx
Introduction to ASP.NET Core MVC and the MVC Pattern.pptxIntroduction to ASP.NET Core MVC and the MVC Pattern.pptx
Introduction to ASP.NET Core MVC and the MVC Pattern.pptx
 
Technoligent providing custom ASP.NET MVC development services
Technoligent providing custom ASP.NET MVC development servicesTechnoligent providing custom ASP.NET MVC development services
Technoligent providing custom ASP.NET MVC development services
 
ASp.net Mvc 5
ASp.net Mvc 5ASp.net Mvc 5
ASp.net Mvc 5
 
Asp.net c# MVC-5 Training-Day-1 of Day-9
Asp.net c# MVC-5 Training-Day-1 of Day-9Asp.net c# MVC-5 Training-Day-1 of Day-9
Asp.net c# MVC-5 Training-Day-1 of Day-9
 
Asp.net With mvc handson
Asp.net With mvc handsonAsp.net With mvc handson
Asp.net With mvc handson
 
Jinal desai .net
Jinal desai .netJinal desai .net
Jinal desai .net
 
Mvc
MvcMvc
Mvc
 
Asp.net mvc
Asp.net mvcAsp.net mvc
Asp.net mvc
 
angularJs Workshop
angularJs WorkshopangularJs Workshop
angularJs Workshop
 

Recently uploaded

Girls Call Churchgate 9910780858 Provide Best And Top Girl Service And No1 in...
Girls Call Churchgate 9910780858 Provide Best And Top Girl Service And No1 in...Girls Call Churchgate 9910780858 Provide Best And Top Girl Service And No1 in...
Girls Call Churchgate 9910780858 Provide Best And Top Girl Service And No1 in...
maigasapphire
 
Semantic-Aware Code Model: Elevating the Future of Software Development
Semantic-Aware Code Model: Elevating the Future of Software DevelopmentSemantic-Aware Code Model: Elevating the Future of Software Development
Semantic-Aware Code Model: Elevating the Future of Software Development
Baishakhi Ray
 
Using LLM Agents with Llama 3, LangGraph and Milvus
Using LLM Agents with Llama 3, LangGraph and MilvusUsing LLM Agents with Llama 3, LangGraph and Milvus
Using LLM Agents with Llama 3, LangGraph and Milvus
Zilliz
 
Patch Tuesday de julio
Patch Tuesday de julioPatch Tuesday de julio
Patch Tuesday de julio
Ivanti
 
"Mastering Graphic Design: Essential Tips and Tricks for Beginners and Profes...
"Mastering Graphic Design: Essential Tips and Tricks for Beginners and Profes..."Mastering Graphic Design: Essential Tips and Tricks for Beginners and Profes...
"Mastering Graphic Design: Essential Tips and Tricks for Beginners and Profes...
Anant Gupta
 
Acumatica vs. Sage Intacct vs. NetSuite _ NOW CFO.pdf
Acumatica vs. Sage Intacct vs. NetSuite _ NOW CFO.pdfAcumatica vs. Sage Intacct vs. NetSuite _ NOW CFO.pdf
Acumatica vs. Sage Intacct vs. NetSuite _ NOW CFO.pdf
BrainSell Technologies
 
High Profile Girls Call ServiCe Hyderabad 0000000000 Tanisha Best High Class ...
High Profile Girls Call ServiCe Hyderabad 0000000000 Tanisha Best High Class ...High Profile Girls Call ServiCe Hyderabad 0000000000 Tanisha Best High Class ...
High Profile Girls Call ServiCe Hyderabad 0000000000 Tanisha Best High Class ...
aslasdfmkhan4750
 
July Patch Tuesday
July Patch TuesdayJuly Patch Tuesday
July Patch Tuesday
Ivanti
 
(CISOPlatform Summit & SACON 2024) Digital Personal Data Protection Act.pdf
(CISOPlatform Summit & SACON 2024) Digital Personal Data Protection Act.pdf(CISOPlatform Summit & SACON 2024) Digital Personal Data Protection Act.pdf
(CISOPlatform Summit & SACON 2024) Digital Personal Data Protection Act.pdf
Priyanka Aash
 
BLOCKCHAIN TECHNOLOGY - Advantages and Disadvantages
BLOCKCHAIN TECHNOLOGY - Advantages and DisadvantagesBLOCKCHAIN TECHNOLOGY - Advantages and Disadvantages
BLOCKCHAIN TECHNOLOGY - Advantages and Disadvantages
SAI KAILASH R
 
Types of Weaving loom machine & it's technology
Types of Weaving loom machine & it's technologyTypes of Weaving loom machine & it's technology
Types of Weaving loom machine & it's technology
ldtexsolbl
 
Girls call Kolkata 👀 XXXXXXXXXXX 👀 Rs.9.5 K Cash Payment With Room Delivery
Girls call Kolkata 👀 XXXXXXXXXXX 👀 Rs.9.5 K Cash Payment With Room Delivery Girls call Kolkata 👀 XXXXXXXXXXX 👀 Rs.9.5 K Cash Payment With Room Delivery
Girls call Kolkata 👀 XXXXXXXXXXX 👀 Rs.9.5 K Cash Payment With Room Delivery
sunilverma7884
 
Best Practices for Effectively Running dbt in Airflow.pdf
Best Practices for Effectively Running dbt in Airflow.pdfBest Practices for Effectively Running dbt in Airflow.pdf
Best Practices for Effectively Running dbt in Airflow.pdf
Tatiana Al-Chueyr
 
Vertex AI Agent Builder - GDG Alicante - Julio 2024
Vertex AI Agent Builder - GDG Alicante - Julio 2024Vertex AI Agent Builder - GDG Alicante - Julio 2024
Vertex AI Agent Builder - GDG Alicante - Julio 2024
Nicolás Lopéz
 
(CISOPlatform Summit & SACON 2024) Gen AI & Deepfake In Overall Security.pdf
(CISOPlatform Summit & SACON 2024) Gen AI & Deepfake In Overall Security.pdf(CISOPlatform Summit & SACON 2024) Gen AI & Deepfake In Overall Security.pdf
(CISOPlatform Summit & SACON 2024) Gen AI & Deepfake In Overall Security.pdf
Priyanka Aash
 
Introduction-to-the-IAM-Platform-Implementation-Plan.pptx
Introduction-to-the-IAM-Platform-Implementation-Plan.pptxIntroduction-to-the-IAM-Platform-Implementation-Plan.pptx
Introduction-to-the-IAM-Platform-Implementation-Plan.pptx
313mohammedarshad
 
BT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdf
BT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdfBT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdf
BT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdf
Neo4j
 
Acumatica vs. Sage Intacct _Construction_July (1).pptx
Acumatica vs. Sage Intacct _Construction_July (1).pptxAcumatica vs. Sage Intacct _Construction_July (1).pptx
Acumatica vs. Sage Intacct _Construction_July (1).pptx
BrainSell Technologies
 
High Profile Girls call Service Pune 000XX00000 Provide Best And Top Girl Ser...
High Profile Girls call Service Pune 000XX00000 Provide Best And Top Girl Ser...High Profile Girls call Service Pune 000XX00000 Provide Best And Top Girl Ser...
High Profile Girls call Service Pune 000XX00000 Provide Best And Top Girl Ser...
bhumivarma35300
 
(CISOPlatform Summit & SACON 2024) Cyber Insurance & Risk Quantification.pdf
(CISOPlatform Summit & SACON 2024) Cyber Insurance & Risk Quantification.pdf(CISOPlatform Summit & SACON 2024) Cyber Insurance & Risk Quantification.pdf
(CISOPlatform Summit & SACON 2024) Cyber Insurance & Risk Quantification.pdf
Priyanka Aash
 

Recently uploaded (20)

Girls Call Churchgate 9910780858 Provide Best And Top Girl Service And No1 in...
Girls Call Churchgate 9910780858 Provide Best And Top Girl Service And No1 in...Girls Call Churchgate 9910780858 Provide Best And Top Girl Service And No1 in...
Girls Call Churchgate 9910780858 Provide Best And Top Girl Service And No1 in...
 
Semantic-Aware Code Model: Elevating the Future of Software Development
Semantic-Aware Code Model: Elevating the Future of Software DevelopmentSemantic-Aware Code Model: Elevating the Future of Software Development
Semantic-Aware Code Model: Elevating the Future of Software Development
 
Using LLM Agents with Llama 3, LangGraph and Milvus
Using LLM Agents with Llama 3, LangGraph and MilvusUsing LLM Agents with Llama 3, LangGraph and Milvus
Using LLM Agents with Llama 3, LangGraph and Milvus
 
Patch Tuesday de julio
Patch Tuesday de julioPatch Tuesday de julio
Patch Tuesday de julio
 
"Mastering Graphic Design: Essential Tips and Tricks for Beginners and Profes...
"Mastering Graphic Design: Essential Tips and Tricks for Beginners and Profes..."Mastering Graphic Design: Essential Tips and Tricks for Beginners and Profes...
"Mastering Graphic Design: Essential Tips and Tricks for Beginners and Profes...
 
Acumatica vs. Sage Intacct vs. NetSuite _ NOW CFO.pdf
Acumatica vs. Sage Intacct vs. NetSuite _ NOW CFO.pdfAcumatica vs. Sage Intacct vs. NetSuite _ NOW CFO.pdf
Acumatica vs. Sage Intacct vs. NetSuite _ NOW CFO.pdf
 
High Profile Girls Call ServiCe Hyderabad 0000000000 Tanisha Best High Class ...
High Profile Girls Call ServiCe Hyderabad 0000000000 Tanisha Best High Class ...High Profile Girls Call ServiCe Hyderabad 0000000000 Tanisha Best High Class ...
High Profile Girls Call ServiCe Hyderabad 0000000000 Tanisha Best High Class ...
 
July Patch Tuesday
July Patch TuesdayJuly Patch Tuesday
July Patch Tuesday
 
(CISOPlatform Summit & SACON 2024) Digital Personal Data Protection Act.pdf
(CISOPlatform Summit & SACON 2024) Digital Personal Data Protection Act.pdf(CISOPlatform Summit & SACON 2024) Digital Personal Data Protection Act.pdf
(CISOPlatform Summit & SACON 2024) Digital Personal Data Protection Act.pdf
 
BLOCKCHAIN TECHNOLOGY - Advantages and Disadvantages
BLOCKCHAIN TECHNOLOGY - Advantages and DisadvantagesBLOCKCHAIN TECHNOLOGY - Advantages and Disadvantages
BLOCKCHAIN TECHNOLOGY - Advantages and Disadvantages
 
Types of Weaving loom machine & it's technology
Types of Weaving loom machine & it's technologyTypes of Weaving loom machine & it's technology
Types of Weaving loom machine & it's technology
 
Girls call Kolkata 👀 XXXXXXXXXXX 👀 Rs.9.5 K Cash Payment With Room Delivery
Girls call Kolkata 👀 XXXXXXXXXXX 👀 Rs.9.5 K Cash Payment With Room Delivery Girls call Kolkata 👀 XXXXXXXXXXX 👀 Rs.9.5 K Cash Payment With Room Delivery
Girls call Kolkata 👀 XXXXXXXXXXX 👀 Rs.9.5 K Cash Payment With Room Delivery
 
Best Practices for Effectively Running dbt in Airflow.pdf
Best Practices for Effectively Running dbt in Airflow.pdfBest Practices for Effectively Running dbt in Airflow.pdf
Best Practices for Effectively Running dbt in Airflow.pdf
 
Vertex AI Agent Builder - GDG Alicante - Julio 2024
Vertex AI Agent Builder - GDG Alicante - Julio 2024Vertex AI Agent Builder - GDG Alicante - Julio 2024
Vertex AI Agent Builder - GDG Alicante - Julio 2024
 
(CISOPlatform Summit & SACON 2024) Gen AI & Deepfake In Overall Security.pdf
(CISOPlatform Summit & SACON 2024) Gen AI & Deepfake In Overall Security.pdf(CISOPlatform Summit & SACON 2024) Gen AI & Deepfake In Overall Security.pdf
(CISOPlatform Summit & SACON 2024) Gen AI & Deepfake In Overall Security.pdf
 
Introduction-to-the-IAM-Platform-Implementation-Plan.pptx
Introduction-to-the-IAM-Platform-Implementation-Plan.pptxIntroduction-to-the-IAM-Platform-Implementation-Plan.pptx
Introduction-to-the-IAM-Platform-Implementation-Plan.pptx
 
BT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdf
BT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdfBT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdf
BT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdf
 
Acumatica vs. Sage Intacct _Construction_July (1).pptx
Acumatica vs. Sage Intacct _Construction_July (1).pptxAcumatica vs. Sage Intacct _Construction_July (1).pptx
Acumatica vs. Sage Intacct _Construction_July (1).pptx
 
High Profile Girls call Service Pune 000XX00000 Provide Best And Top Girl Ser...
High Profile Girls call Service Pune 000XX00000 Provide Best And Top Girl Ser...High Profile Girls call Service Pune 000XX00000 Provide Best And Top Girl Ser...
High Profile Girls call Service Pune 000XX00000 Provide Best And Top Girl Ser...
 
(CISOPlatform Summit & SACON 2024) Cyber Insurance & Risk Quantification.pdf
(CISOPlatform Summit & SACON 2024) Cyber Insurance & Risk Quantification.pdf(CISOPlatform Summit & SACON 2024) Cyber Insurance & Risk Quantification.pdf
(CISOPlatform Summit & SACON 2024) Cyber Insurance & Risk Quantification.pdf
 

MVC.pptx

  • 2. MVC purpose? ● An architecture for separating components of a large code block by abstracting components of a large code base into smaller manageable pieces. ● Can be used to structure code of any language
  • 3. MVC components? ● Model - database management ● View - user interface ● Controller - logic for user requests
  • 5. Model purpose? ● The model in MVC architecture is responsible for manipulating the data. ● Structuring data. ● Inserting, deleting, updating… ● Never interacts with the view directly
  • 6. Model example ● The model will define what an acceptable piece of data should look like. ● Any piece of data not adhering to the model structure should not be allowed into the database. Model Student { Name: String Class: String, Grade: Number, } Valid Student { Name: “Bob”, Class: “Math”, Grade: 80, } Not Valid Student { ID: 808, Class:501 , Grade: “Pass”, }
  • 7. Model using mongoose schema const mongoose = require(‘mongoose’); const StudentSchema = new mongoose.Schema({ Name:{ Type: String }, Class:{Type: String}, grade:{Type: Number} }) Module.exports = mongoose.model(‘Student’, StudentSchema)
  • 8. View purpose? ● The view is responsible for displaying the data ● The view never interacts directly with the model, instead the controller proxys any data the view may need
  • 9. View examples Views provide the user interface in the MVC architecture and can be simple html or template engines like EJS and Express- Handlebars <%= EJS %>
  • 10. Controller ● Can be more than one controller in a project ● Each controller has a specific route or responsibility with a particular resource
  • 11. Controller purpose? ● Handles any logic required from user requests ● The controller acts as a hub for user requests through the view and retrieval or modification of the database by way of the model
  • 12. Controller answering a request from the user //inventory router directs request to applicable controllers Router.get('/',inventoryController.getInventory) Router.post('/', inventoryController.addPart) ● Router has determined controllers responsible for specific resources to handle requests
  • 13. const Parts = require("../models/Part");//MODEL module.exports.getInventory = async (req,res)=>{ //requesting parts from MODEL const allInventory = await Parts.find() //VIEW response res.render('inventory.ejs',{inventory:allInventory}) } ● Controller has ability to query the model for any data necessary to fulfill the request given by the router ● Once any logic necessary is complete, the view is provided with any necessary data and then presents the user with an interface to interact with. Controller example
  • 14. student.ejs MONGODB /controller/student.js Const Student = require(‘./models/student’) Module.exports.getStudents = (req,res)=> { Const allStudents = Student.find(); res.render(students.ejs,{students:allstu dents}) } MONGOOSE ./models/student Server.js Const studentRoutes= require(‘./routes/student.js’) app.use(‘/inventory’,studentRoutes) /routes/student.js Const studentCtr= require(‘./controller/student.js’) app.get(‘/’, studentCtr.getStudents)