Duplication 2: Custom Flask Website

Build a brand new custom Flask website with multiple pages, images, Bootstrap theming, and deploy to both GitHub and Heroku.

Assignment Objectives

Create a completely custom Flask website from scratch with five unique pages
Implement proper image handling stored in static/assets folder
Apply Bootstrap theming for professional appearance
Deploy to both GitHub and Heroku platforms
Submit Heroku project name for grading

Assignment Instructions

Your Task: Recreate the Demo

Your goal is to duplicate the demonstration project you just watched. This is a hands-on assignment where you'll build the same project independently.

Requirements:

Follow the same steps shown in the demonstration
Implement all the features demonstrated
Use similar code structure and naming conventions
Test your implementation thoroughly
Submit your completed project

Important: This is independent work. Try to complete it without looking back at the demo unless absolutely necessary.

Assignment Details

Step 1: Set Up Project from Starter Kit

Start with the starter-kit repository - create a new repo from the starter kit template
Name your repository: classnumber_dup02_lastname (e.g., cbis4210_dup02_marshall)
Clone the repository to your local development environment
Install dependencies and test that the starter kit runs locally

Step 2: Create Your Custom Website

Design a brand new website with at least five unique static pages
Each page must:
- Extend the base.html template using Jinja's {% extends "base.html" %}
- Contain at least one image, stored properly inside the static/assets folder
- Use correct pathing so images display correctly (research how Flask loads files from the static folder)
Apply a Bootstrap theme of your choice to create a unique look and feel for the entire site

Step 3: Test Locally

Run the site in your development environment and confirm:
- Navigation links work across all five pages
- Images load correctly from the static/assets folder
- The Bootstrap theme displays properly on all pages
Fix any errors or broken links before moving on

Step 4: Push to GitHub

Commit all changes with clear, descriptive messages (e.g., "Added images to About and Contact pages")
Push the finished project to GitHub
Add bamarshall06 as a collaborator on GitHub

Step 5: Deploy to Heroku

Create a new Heroku app with the same naming convention: classnumber_dup02_lastname
Example: cbis4210_dup02_marshall
Connect the Heroku app to your GitHub repository under the Deploy tab
Enable Auto Deploy and then manually deploy the branch
Test the deployed site to ensure all five pages and images display correctly
Add bryan.marshall@gcsu.edu as a collaborator in Heroku

Step 6: Submit to GeorgiaView

Submit only the Heroku project name in GeorgiaView (not URLs)
Example submission: "cbis4210_dup02_marshall"

Final Check Before Submission

Website has five pages, all extending base.html
Each page includes at least one image from the static/assets folder
A Bootstrap theme is applied site-wide for consistent design
Project runs without errors locally and on Heroku
GitHub repo is private and shared with bamarshall06
Heroku project is deployed and shared with bryan.marshall@gcsu.edu
Heroku project name submitted to GeorgiaView (not URLs)

Back to Demo 2 Continue to Module 3