Web Design AI Header

Lesson 3: Running the Application and Database Setup

Learn to run your Flask application locally, troubleshoot phantom processes that prevent proper startup, and set up your database schema and seed data using Claude AI automation.

Lesson Objectives

  • Launch Flask applications locally with python app.py in terminal
  • Troubleshoot and eliminate phantom processes using Claude AI assistance
  • Deploy database schema automatically using Claude AI integration
  • Populate database tables with seed data through AI automation
  • Validate complete CRUD functionality in the starter template
  • Test all starter kit features: create modals, edit preloading, and delete confirmations

Watch: Running Application and Database Setup Tutorial

Running the Application and Database Setup - Notes

Running Your Flask Application

Starting the Application:

  • Open PowerShell or terminal in your project directory
  • Ensure your virtual environment is activated (you should see "(venv)")
  • Run the command: python app.py
  • Navigate to http://127.0.0.1:5000 in your browser

Expected Initial Behavior:

  • Application should load and display the starter template
  • When you click "Examples", you should get an error: "The table does not exist"
  • This error is expected - it means the database schema hasn't been set up yet

Troubleshooting Phantom Processes

What is a Phantom Process?

  • Sometimes applications keep running in the background after closing Cursor
  • When you run python app.py, it may show content that doesn't match your current code
  • This means an old version is still running on port 5000

Using Claude AI to Kill Phantom Processes:

  • Open Claude in Cursor
  • Type: "kill the processes running on 127.0.0.1:5000"
  • Claude will search for and terminate background processes
  • It may take several attempts - Claude will try different methods
  • Once successful, you can run your application normally

Database Schema Setup with Claude AI

Using Claude to Deploy Your Database Schema:

  • Identify the schema.sql file in your project (contains CREATE TABLE statements)
  • Tell Claude: "Using the database connection in the .env file, send up the schema.sql to the MySQL database"
  • Add: "and seed the table using the seed data"
  • Claude will automate the entire database setup process

What Claude Will Do:

  • Try to connect directly via command line first
  • If that fails, install MySQL connector for Python
  • Create a Python script to handle the database connection
  • Execute the schema.sql file to create tables
  • Run seed data to populate tables with initial records
  • Handle any errors automatically and try alternative methods

Alternative Manual Method:

  • Copy the contents of schema.sql
  • Open MySQL Workbench and paste into query window
  • Click the lightning bolt to execute the queries
  • This creates the tables directly in MySQL Workbench

Verifying Your Starter Kit

Testing Application Functionality:

  • After database setup, refresh your browser
  • Click on "Examples" (or whatever your template uses)
  • You should now see the table with data instead of an error
  • This confirms your database connection and schema are working

Starter Kit Features to Test:

  • Modal for Adding: Working modal dialog for creating new records
  • Edit Functionality: Pre-loads existing data for editing
  • Delete Confirmation: Modal confirmation before deletion
  • Data Display: Proper table rendering with all records

Lesson 3 Goals:

  • Preload your database with schema and seed data
  • Check that your application actually works
  • Confirm all starter kit features are functional