Trainer Store

Trainer Store is a modern Flask web application for selling products online, with integrated Stripe payments and Google OAuth for trainer login. Trainers can log in, facilitate sales, and have their transactions recorded in a PostgreSQL (Neon) database. The app features a responsive, mobile-friendly UI styled with Tailwind CSS.

---

Features

• Product Catalog: Dynamically lists active Stripe products and prices.
• Stripe Checkout: Secure payment processing for each product.
• Trainer Login: Google OAuth login for trainers, with a personalized greeting and sign-out.
• Trainer Sales Tracking: Each successful payment is recorded in a PostgreSQL database with trainer email and transaction amount.
• Free Item Handling: (Optional/test) Free items can be tracked as trainer sales.
• Responsive UI: Mobile-friendly, with products in rows of two on mobile and three on desktop.
• Modern Stack: Flask, SQLAlchemy, Neon (Postgres), Stripe, Google OAuth, Tailwind CSS, HTMX.
• Testing: Pytest-based tests for payment and database logic.

---

Setup & Installation

1. Clone the Repository

git clone <your-repo-url>
cd smush-site

2. Install Dependencies

pip install -r requirements.txt

3. Environment Variables

Create a .env file in the project root with the following:

STRIPE_SECRET_KEY=sk_test_...
GOOGLE_OAUTH_CLIENT_ID=...
GOOGLE_OAUTH_CLIENT_SECRET=...
FLASK_SECRET_KEY=your-random-secret
DATABASE_URL=postgresql://<user>:<password>@<host>/<port>/<database>
FRONTEND_URL=http://localhost:5000

• Get Stripe keys from your Stripe dashboard.
• Get Google OAuth credentials from Google Cloud Console.
• Get a free Postgres database from Neon or Supabase.

4. Database Setup

The app will auto-create the trainer_payments table on first run using SQLAlchemy.

---

Running the App

Local Development

flask run

Or, for debug mode:

python app.py

Production (e.g., Render.com, Heroku)

• Use the provided Procfile:

  web: gunicorn app:app
  

• Make sure all environment variables are set in your deployment dashboard.

---

Folder Structure

smush-site/
├── app.py                # Main Flask app
├── requirements.txt      # Python dependencies
├── Procfile              # For deployment (Gunicorn)
├── static/
│   └── styles.css        # Custom CSS
├── templates/
│   ├── base.html         # Main layout
│   ├── index.html        # Home/product page
│   └── product_list.html # Product partial
├── tests/
│   └── test_stripe.py    # Pytest tests
└── ...

---

Key Components

Stripe Integration

• Lists only active products/prices.
• Handles both paid and (optionally) free items.
• Secure checkout via Stripe Checkout Sessions.

Trainer Login & Tracking

• Google OAuth login for trainers.
• Trainer's email and first name shown in the UI.
• Each sale (with amount and currency) is recorded in the trainer_payments table.

Database (PostgreSQL/Neon)

• Uses SQLAlchemy ORM for all DB operations.
• Table: trainer_payments with columns: id, trainer_email, payment_id, amount, currency, timestamp.
• Easily view/manage data using Neon or Supabase web UI.

Testing

• Run all tests with:

  pytest

• Tests cover payment creation, error handling, and DB recording.

---

Customization & Extending

• Add more product info: Extend the product card in product_list.html.
• Add admin/trainer dashboard: Use SQLAlchemy queries to show trainer stats.
• Switch DB: Change DATABASE_URL to use any Postgres-compatible service.
• Styling: Edit static/styles.css or use Tailwind classes in templates.

---

Deployment Notes

• Make sure to set all secrets and keys as environment variables in your cloud provider.
• For Stripe and Google OAuth, set the correct callback/redirect URLs in their respective dashboards.
• For production, use Gunicorn (see Procfile).

---

License

MIT (or your preferred license)

---

Credits

• Flask
• Stripe
• Neon
• Supabase
• Tailwind CSS
• HTMX
• Flask-Dance