Skip to article frontmatterSkip to article content
Site not loading correctly?

This may be due to an incorrect BASE_URL configuration. See the MyST Documentation for reference.

Why this matters for business: MVC (Model–View–Controller) separates data, presentation, and control logic so analytics code is easier to test, replace, and scale across dashboards and microservices. This notebook shows lightweight, Pyodide-safe examples and guided practice for building small, testable components.


Core Concept

  • Model: data + business rules (e.g., Order, Product).

  • View: presentation layer (console, HTML, Plotly). Keep views simple and testable.

  • Controller: orchestrates model changes and view updates.


Tiny Pyodide-safe MVC demo


Quick MCQ

  • Q: Which MVC component should contain validation rules for an Order object?

    • A) View

    • B) Controller

    • C) Model

    • (Answer: C)

Exercises

  1. Modify the Model to track total_price and update Controller.add_item() to accept a (name, price) tuple and update total_price.

  2. Replace View.render to produce a small Markdown table for the order summary.

  3. (Stretch) Implement a Repository layer that saves orders to an in-memory dict; keep the Controller oblivious to storage details.


Notes: Cells added are intentionally small and deterministic so they run in-browser via Pyodide. Preserve existing user code and plots below.

MVC and Layered Architectures

Separate data, decisions, and presentation so applications stay maintainable as they grow.

MVC is an architectural pattern, not just a class-level trick. It helps larger systems avoid turning views, business logic, and data access into one tangled script.


Business Framing

Consider a sales dashboard:

  • the Model stores and retrieves sales data

  • the View renders tables or charts

  • the Controller receives user actions and coordinates the workflow

This separation makes the app easier to test, extend, and maintain.


Visual Intuition


Responsibility Split

LayerOwnsShould avoid
Modelbusiness data and rulesHTML rendering or UI decisions
Viewpresentationdirect database logic
Controllerrequest flow and coordinationbecoming a god object

Worked Example: Sales Dashboard MVC

Why this scales better

If the data source changes, update the model. If the UI changes, update the view. If the workflow changes, update the controller. Each concern stays in its own lane.


MVC vs Simple Scripts

Simple scriptMVC
Fast for tiny tasksBetter for maintainable apps
Logic often mixed togetherConcerns are separated
Harder to test as it growsEasier to test layer by layer

Mini Quiz

  1. Which MVC part should know how to fetch business data?

  2. Which MVC part should format output for the user?

  3. What is a common controller mistake?

Answer Check
  1. Model

  2. View

  3. Letting the controller absorb too much business logic


Practice Prompt

Sketch an MVC design for an invoice system where:

  • invoices come from a data store

  • the user clicks “send reminder”

  • the UI shows overdue accounts

One Possible Mapping
  • Model: invoice records, due dates, payment status

  • View: overdue invoice table and reminder status messages

  • Controller: handles reminder requests and coordinates model plus view


Key Takeaway

MVC helps you say: data, decisions, and presentation should collaborate, but not collapse into one file.