MVC Architecture
Sharmila Sambasivam
What is MVC? and Parts of MVC ?
It is a design pattern used in software development to separate the application's logic, UI, and
user input.
• MODEL-- REPRESENTS DATA
• VIEW – REPRESENTS UI
• CONTROLLER – REQUEST HANDLER
M-V-C Architecture in a Shopping Cart Application
MODEL Stands as the data layer of the application .
It is directly involved in managing the data as well as the control of the
application’s logic and rules.
1. Model (Data & Logic Layer)
•Stores and manages data related to products, cart, users, orders, etc.
•Contains business logic like:
• How many items are in the cart
• Total price calculation
• Stock availability
Example in Shopping Cart:
•Product: ID, Name, Price, Stock
•Cart: List of Products, Quantity, Total Amount
•Order: Order ID, Items, Amount, Payment Status
M-V-C Architecture in a Shopping Cart Application
VIEW-The View is in the presentation tier.
It plays a role of presenting the information given by the Model to the user and transferring the
user commands to the Controller.
The View is used to display the data to the user in a readable and manageable way using the
interface created by the Controller.
View (User Interface Layer)
What the user sees and interacts with.
Displays:
• Product list
• Cart summary
• Checkout page
• Confirmation messages
Example in Shopping Cart:
• Homepage showing products
• "Add to Cart" buttons
• Cart page with items and total
• Checkout form
M-V-C Architecture in a Shopping Cart Application
CONTROLLER works in the middle between the Model and the View.
It takes the input from the View, sometimes modifies it with the help of the Model, and sends it
back to the View.
Controller (Logic Connector)
Takes input from the user (clicks, form entries)
Processes the input, updates the model
Decides which view to show based on the outcome
Example in Shopping Cart:
User clicks "Add to Cart" → Controller tells the Model to add the item to the cart
User updates quantity → Controller updates the Cart Model
User clicks "Checkout" → Controller processes the order and sends success/failure to the View
How it works :
How It Works – Step by Step Example:
User has some items In cart adds a T-shirt to Cart:
View: User clicks "Add to Cart" on a T-shirt.
Controller: Receives this action → asks Model to add the T-shirt.
Model: Adds the item to the cart data and recalculates the total.
Controller: Tells the View to refresh the cart.
View: Shows updated cart with new item and price.
Features of MVC - The MVC architecture provides a structured way to build applications by separating
logic into three distinct layers.
1. Separation of concerns
Divides the application into Model, View, and Controller.
Each component has a single, well-defined responsibility.
2.Ease to Debug and Test
Modification In one component does not affect other .
3. Faster Development
Teams can develop in parallel: designers on View, developers on Controller & Model.
Improves productivity and development speed.
4. Multiple Views for One Model
A single data model can be represented in many views (e.g., list view, grid view, dashboard).
5. Scalability
Supports large-scale applications by keeping layers independent.
Multiple developers can work on Model, View, and Controller separately.
6.Customizable?
Yes, MVC is highly customizable.
One of its core strengths is that you can modify or extend each component (Model, View, Controller)
independently to fit the specific needs of your application.
MVC (Model–View–Controller) architecture with
some real-time relatable examples so it’s easy
to visualize.
1. Food Delivery App (e.g., Swiggy, Zomato)
Model (Data & Logic)
Stores and manages menu data, restaurant info, prices, order status.
Business logic for placing orders, applying coupons, calculating bills.
View (User Interface)
Screens you see — restaurant list, food menu, cart, order tracking page.
Controller (Middleman)
Takes your taps/clicks (like “Add to cart”) and tells the Model to update the data, then asks
the View to refresh.
Example flow:
You tap “Place Order” → Controller processes it → Model stores order in DB →
View shows “Order Confirmed” screen.
Movie Ticket Booking App (BookMyShow)
Model: Movie list, showtimes, seat availability, pricing.
View: Movie posters, date selector, seat layout.
Controller: Handles seat selection, booking requests, payment gateway
calls.
Railway Reservation System
• Model: Train schedules, seat availability, booking records, cancellation
rules.
• View: Search page, seat map, booking confirmation screen.
• Controller: Gets search filters, fetches from Model, updates View
with results.
Online Banking Website
Model: Account details, transaction history, balance logic, fund transfer
rules.
View: Dashboard, transaction list, fund transfer form.
Controller: Handles requests like “Show last 10 transactions” or
“Transfer ₹5000 to account XYZ”.
END
