Back to Blog

Call A Pizza - Dynamic Restaurant Website

• 7 min read
Web DevelopmentFlaskReactMSSQLFull-Stack

Call A Pizza

Members: Shingo Morita, Marius Ilg, Chris Johnson
Tools: Flask, HTML, CSS, MSSQL, JavaScript, Jinja, jQuery

Description

In this project, students were required to build a website of their own choice using the technology of their choice. We chose Python due to its ease of learning and the current trends in the industry.

Technology Selection

Framework Choice: Flask vs Django

We had two choices for the framework we could use: Django and Flask.

Flask Benefits:

  • Only has basic functions but could be extended as required
  • Lightweight and flexible
  • Better for smaller projects with specific requirements

Django Benefits:

  • Comes with a lot of built-in functions
  • Easy to get started
  • Better for larger, more complex applications

Our Decision: Considering we are not building a massive website with various functions, we decided to use Flask.

Project Development

Initial Challenges

The hardest part of the project was to start the project like all the other ones. Because most of us had no experience with Flask or any other Web framework, it took the most time learning to set up the project.

Development Process

After we finished setting up the project, we listed out the required pages and backend database variables. Then, we divided the project by each page to finish in the most efficient manner. I took part in building some pages.

Key Features

  • Dynamic Menu System: Menu items are dynamically loaded from the database
  • Real-time Updates: Changes to the database automatically reflect on the website
  • Product Management: Backend system for managing pizza offerings
  • Responsive Design: User-friendly interface for ordering

Technical Implementation

Frontend

  • HTML/CSS for structure and styling
  • JavaScript and jQuery for interactivity
  • React components for dynamic content

Backend

  • Flask framework for server-side logic
  • MSSQL database for data storage
  • Jinja templating for server-side rendering

Database Design

  • Product information storage
  • Menu item management
  • Order tracking capabilities

Key Learnings

  1. Framework Selection: Choosing the right framework (Flask) for project scope is crucial. Not every project needs the full power of Django.

  2. Learning Curve: Starting with a new framework requires significant time investment, but the learning process is valuable.

  3. Team Collaboration: Dividing work by pages allowed parallel development and efficient project completion.

  4. Database Integration: Understanding how to connect frontend and backend through database queries was essential.

  5. Full-Stack Development: This project provided hands-on experience with both frontend and backend development.

Challenges and Solutions

Challenge: Framework Learning

Solution: Dedicated time for learning Flask fundamentals before starting development.

Challenge: Database Integration

Solution: Careful planning of database schema and API endpoints before implementation.

Challenge: Team Coordination

Solution: Clear division of responsibilities and regular communication.

Project Outcomes

  • Successfully built a functional dynamic website
  • Gained experience with Flask framework
  • Learned full-stack development principles
  • Completed project within timeline

Future Enhancements

  • User authentication and accounts
  • Online ordering system
  • Payment integration
  • Order tracking
  • Customer reviews and ratings
  • Mobile app development