Summer Camps for Session 3 starting July 29th | Summer Classes for Session 3 starting Aug 5th. Enroll Now
Student Login Parent Login
High School Coding Program, Guy with Laptop

Course Description

In Mastering MVC Framework, the first course in Wizard Level 3 of our high school program, students learn how to use the MVC design pattern in their Flask web applications. The MVC design pattern allows developers to build large full-stack applications more efficiently by breaking their apps into three logical units: the View (UI), Controller (Flask app), and Model (database). Getting students to think at this higher level about the structure of an application allows them to see similarities between what may seem like unique applications. Spotting larger architectural patterns between applications is an essential skill for any programmer. After completing this course, students move on to the next course in our structured curriculum: Object Relational Mapping.

High School Coding Program, Girl With Backpack

Learning Objectives

When students complete the Mastering MVC Framework course, they will be able to:

  • Break large apps into three logical parts: the View (UI), Controller (Flask app), and Model (database)
  • Use the MVC design pattern to make structuring applications more consistent and easier to maintain
  • Create route-based applications where users visiting URLs trigger application actions
Level III

Prerequisites

These courses must be completed before Mastering MVC Framework:

Mastering MVC Framework Class LessonsExpand All Lessons
  • MVC class, Flask Routes
    1. Revisiting Flask Routes

    In this lesson, students go back in time while revisiting the basics of building a Flask app. They learn about an exciting service that allows them to view archived versions of web pages. Using this service, they create their own Flask app to go back to the early version of some famous apps like YouTube. In the process, they refresh their skills with URL routing and also learn about the HTML iframe tag to embed external HTML in their page.

  • MVC class, template macros
    2. Template Macros

    In this lesson, students learn how they can reuse HTML template code with the help of Flask template macros to make customizable and reusable component patterns. Using macros, they create a blog post component. They also revisit variable routes, and conditional rendering using if-statements.

  • MVC class, decorators
    3. Decorators

    In this lesson, students learn about a new concept called Python decorators. With decorators, they can modify the behavior of existing functions without changing their structure. They have been using inbuilt decorators to add routes to their app. They learn how to create custom decorators to add a welcome page. In addition to that, they also revisit session variables to show the welcome page only once.

  • MVC class, MVC approach
    4. MVC approach

    In this lesson, students explore the term MVC. MVC stands for Model, View, Controller. It’s a programming architecture used by professionals while creating apps. They observe how MVC works in Flask and how it makes it easier for multiple developers to collaborate on the same codebase. In addition to that, they revisit SQL queries to insert the post data in the database.

  • MVC class, UI
    5. UI Improvements

    In this lesson, students revisit the Bootstrap CSS framework, exploring how a framework facilitates the rapid development of complex, well-designed interfaces. The students gain practical experience by using the built-in components of Bootstrap to add a navigation bar and icons to the blog. 

  • MVC class, UI
    6. UI Improvements Continued

    In this lesson, students add an editor for creating new posts for their blog. First, they revisit building a webpage form using Bootstrap. Then they add a rich text editor using Quill, an open-source text editor designed for the web and used by companies like Slack and Microsoft. Finally, they integrate the form with the backend to store new posts on the database.

  • MVC class, pagination
    7. Pagination

    In this lesson, students tackle design problems related to displaying large amounts of data. They learn how to retrieve data selected data in pages, making the app more efficient and improving the user experience. While doing so, they revisited SQL functions like count(), limit, and offset. As a bonus, they use Bootstrap to style the pagination links.

  • MVC class, logging and messaging
    8. Logging and Messaging

    In this lesson, students explore the Flask app’s log, giving them insight into how developers debug, maintain, and operate an app. They view the app’s default log of regular network traffic and then log some messages of their own. In addition to that, they also learn how to send messages from one route to another using flash messages

  • MVC class, login
    9. Adding the Login

    In this class, students revisit the critical skills of user authorization by adding a login feature to their existing blog project. To secure the blog post editor, students create a custom decorator that restricts the route to logged-in users. They revisit session variables to save the login status of the user.

  • MVC class, database
    10. Database Migrations

    In this lesson, students learn a fundamental concept of database management, updating the structure of an existing table. They add a new column to a table to save the publish date. Other topics include error handling with try-except blocks and date formatting using Python’s datetime module.

  • MVC class, Final Project
    11. Final Iteration – I

    In this lesson, students add a new feature to the blog and take a quick review of the concepts they have learned so far. Students work toward completing a standard CRUD app that knits together frontend, server, and database skills by adding the ability to update existing posts. 

  • MVC class, Final Project
    12. Final Iteration – II

    For the final lesson of the MVC course, students complete their blog project. In this class, students implement user comments to the blog posts. Instead of saving the post comments in their local database, they used a popular third-party service called Disqus. 

Class Schedule

All students start in Intro to Python at Wizard Level I. If you have previous coding experience, take the Advanced Placement test. Returning students can continue with the class where they left off.

  • loading icon

#1 Most Comprehensive Program for Your Student’s Success!

The CodeWizardsHQ program comes with everything your child needs to be successful in learning to code.

All of the below are included at no extra cost.

Interactive Live Classes
Structured and Comprehensive Curriculum
Video Recordings of Every Class
Downloadable Slides for Every Class
1×1 Office Hours (Advanced Courses)
Weekly Progress Report & Alerts
Daily Homework Help
Individual Course Certification
Highly Qualified and Experienced Teachers
24/7 Access to Proprietary Coding Platform
Supportive Online Student Community
Path to Real-World Internship
Hands-on, Project Based Learning

Course Duration & Time Commitment
All courses are 12 weeks long. A Wizard will receive a certification for their achievement at the end of the course.

Expect a weekly time commitment of 2-3 hours. 55 minutes of class time, plus 1-2 hours of practice time, with instructor support throughout, including weekends.

100% Guarantee

Our goal is to make all our students successful. If your child is not happy with our program, please notify us within the first four class sessions and you will receive a full refund. See refund details.

Get Your Wizard Started

Start coding with our experienced teachers today.
Enroll risk-free with our 4 session money-back guarantee. Full guarantee details.