Web Design AI Logo

Duplication 5: Professional Multi-Table System with Authentication

Using Demo 5 as your guide, create a professional, polished Flask application with a unique five-table database system, employee authentication, dynamic dashboard, dual navigation systems, and clean production-ready codebase.

Assignment Objectives

  • Follow Demo 5 workflow to create a completely unique professional multi-table application
  • Design and implement custom five-table system with meaningful relationships and authentication
  • Remove ALL example files and create clean, production-ready codebase with custom branding
  • Implement employee authentication with Flask-Login and dual navigation systems
  • Build dynamic dashboard with database-driven metrics and sales calculations
  • Deploy successfully to production with comprehensive testing of all multi-table features

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

Objective

Following the workflow from Demo 5, create a professional Flask application with your own unique five-table database system and employee authentication. Your final application should be well-polished, contain a multi-table architecture with authentication, dynamic dashboard with metrics, dual navigation systems, and have all example files removed for a clean, production-ready codebase.

Step 1: Follow Demo 5 Workflow

  • Use Demo 5 as your complete guide for the development process
  • Create new repository from template (private repository)
  • Set up Heroku app with auto-deployment and JawsDB MySQL
  • Configure local development environment with virtual environment
  • Use Claude AI assistance throughout the development process

Step 2: Custom Five-Table Schema Design

  • Design a custom five-table system for your unique theme (e.g., Library/Books/Authors/Checkouts/Members, Restaurant/Menu/Ingredients/Suppliers/Employees, Gym/Classes/Trainers/Members/Attendance)
  • Include one employee/user table for authentication (user_id, username, first_name, last_name, password)
  • Design four business tables with meaningful relationships and foreign keys
  • Use Claude AI to create and deploy your custom schema with proper constraints
  • Include at least one parent-child detail relationship (like orders/order_details)
  • Generate realistic seed data for all five tables

Step 3: Blueprint Creation and CRUD Operations

  • Use Claude AI to create blueprints for your business tables with modal-based CRUD
  • Implement dropdown functionality for foreign key relationships
  • Create combined blueprint for parent-child table relationships (if applicable)
  • Fix modal jumping issues by placing modals outside loops
  • Generate HTML templates with Bootstrap 5 styling
  • Ensure all CRUD operations work properly with proper data validation

Step 4: Employee Authentication System

  • Use Claude AI to implement Flask-Login authentication using your employee table
  • Create auth blueprint with login/logout routes
  • Implement password hashing with werkzeug.security
  • Configure index.html as login page with prefilled test credentials
  • Add @login_required decorators to protect all business routes
  • Implement cache control headers to prevent back button after logout
  • Test complete login/logout flow with session management

Step 5: Dynamic Dashboard and Dual Navigation

  • Create dual navigation systems: authenticated (Dashboard + business links + Admin User + Logout) and public (Home, About)
  • Build dynamic dashboard with database-driven metrics (counts, totals, statistics relevant to your domain)
  • Include at least 4 metric cards showing real-time data from your database
  • Add recent activity table using SQL JOINs across related tables
  • Create employee profile page accessible from Admin User link
  • Make logo clickable linking back to dashboard

Step 6: Calculations and Business Logic (If Applicable)

  • If your domain includes financial calculations (like sales, fees, totals), implement server-side calculations
  • Use Decimal type for accurate money calculations
  • Add appropriate percentage calculations (tax, fees, discounts, etc.)
  • Display subtotals, fees, and totals appropriately
  • Ensure calculations update correctly when data changes
  • Verify totals match across different views and reports

Step 7: Professional Polish and Clean-Up

  • Remove ALL example files: Ensure no leftover example templates, blueprints, or references remain
  • Remove temporary development files (create_tables.py, verify_data.py, update_passwords.py)
  • Keep schema.sql and seed.sql for reference
  • Customize application title, branding, and theme to match your project
  • Add professional footer with company/project information
  • Ensure consistent container width across header, content, and footer
  • Update navigation to reflect your custom business tables
  • Ensure the application looks professional and production-ready

Step 8: Thorough Testing and Quality Assurance

  • Test login page with prefilled credentials works correctly
  • Test authentication flow: login redirects to dashboard, logout redirects to login
  • Verify back button prevention after logout (cache control headers)
  • Test all business table CRUD operations with modal interfaces
  • Verify dropdown selections work for foreign key relationships
  • Test dashboard metrics display accurate real-time data
  • Verify calculations (if applicable) are accurate
  • Test modal functionality (no jumping, proper display)
  • Use Claude AI for error debugging if needed

Step 9: Production Deployment

  • Use Claude AI to commit and push all changes to GitHub
  • Monitor Heroku Activity tab for auto-deployment progress
  • Wait for build to complete (status: Succeeded)
  • Test production application thoroughly with all functionality
  • Verify database connections work in production environment
  • Test login with prefilled credentials in production
  • Ensure no errors or broken features in production

Step 10: Submission

  • Add bamarshall06 as collaborator on GitHub repository
  • Share Heroku project with bryan.marshall@gcsu.edu
  • Submit only the Heroku project name (not URLs) in GeorgiaView
  • Example submission: "cbis4210_dup05_lastname"

Professional Application Requirements

Submit only the Heroku project name in GeorgiaView. Your application must demonstrate:

  • Professional Quality: Well-polished application that looks production-ready
  • Clean Codebase: NO example files, templates, or placeholder content remaining
  • Custom Five-Table Schema: Five unique tables with meaningful relationships (not Pizza Management)
  • Employee Authentication: Working Flask-Login system with one employee/user table
  • Login/Logout Flow: Index.html login page with prefilled credentials, session management, cache control
  • Dual Navigation: Authenticated navigation (Dashboard + business tables + Admin User + Logout) and public navigation
  • Dynamic Dashboard: At least 4 database-driven metrics and recent activity table with JOINs
  • Foreign Key Relationships: Proper relationship configuration with dropdown functionality
  • Full CRUD Operations: Create, Read, Update, Delete functionality with working modals (no jumping)
  • Employee Profile Page: Accessible from Admin User link showing current user information
  • Professional Footer: Custom footer with consistent container width
  • Calculations (if applicable): Server-side calculations using Decimal type with appropriate percentages
  • Custom Branding: Application title, logo, styling, and theme reflect your unique project
  • Production Deployment: Successfully deployed and tested on Heroku
  • Collaboration Access: bamarshall06 added to both GitHub and Heroku

Final Quality Check Before Submission

  • โœจ NO Example Files: All example templates, blueprints, and references completely removed
  • ๐Ÿงน Temporary Files Removed: create_tables.py, verify_data.py, update_passwords.py deleted
  • ๐Ÿ“‚ Reference Files Kept: schema.sql and seed.sql preserved
  • ๐ŸŽจ Professional Appearance: Custom branding, styling, and theme throughout
  • ๐Ÿ—„๏ธ Five-Table System: Five unique business tables with authentication table (NOT Pizza Management)
  • ๐Ÿ” Authentication Works: Login page (index.html) with prefilled credentials, session management
  • ๐Ÿšช Logout Protection: Cache control headers prevent back button navigation after logout
  • ๐Ÿงญ Dual Navigation: Authenticated (Dashboard, business tables, Admin User, Logout) and public (Home, About)
  • ๐Ÿ“Š Dynamic Dashboard: At least 4 metrics pulling real-time data from database
  • ๐Ÿ“‹ Recent Activity: Table showing recent records using SQL JOINs across related tables
  • ๐Ÿ‘ค Employee Profile: Profile page accessible from Admin User link
  • ๐Ÿ“ Dropdown Interface: Child tables include dropdown selection for parent records
  • โš™๏ธ Full CRUD Functionality: All operations work perfectly with proper modals
  • ๐ŸŽฏ No Modal Jumping: Modals placed outside loops for proper display
  • ๐Ÿ’ฐ Calculations (if applicable): Server-side calculations with Decimal type and appropriate percentages
  • ๐Ÿ“ฑ User Experience: Navigation, titles, footer, and content all match your theme
  • ๐Ÿ”— Data Integrity: Foreign key relationships maintain referential integrity
  • ๐Ÿš€ Production Ready: Application runs flawlessly on Heroku with all features
  • ๐Ÿค Access Granted: bamarshall06 has collaborator access on GitHub and Heroku
  • ๐Ÿ“ค Submission Complete: Only Heroku project name submitted in GeorgiaView
๐ŸŽฏ Key Success Criteria:

This is NOT Demo 5 with minor changes. This should be a completely unique, professional application.

Your five-table system should be meaningful and different from Pizza Management.

Authentication must work with login page, logout, cache control, and dual navigation.

Dashboard must show real-time metrics from your database with at least 4 metric cards.

The instructor should see ZERO trace of example files and full multi-table functionality.