fourestfire / podgpt

Project to create a personal AI API interface and explore Django & React.

PodGPT

Objectives

• Explore Generative AI models and test Copilot
• Explore common frontend and backend frameworks and understand production architecture options
• Create a base for future fullstack projects

Screenshot

Tech Stack

• Backend: Django with Gunicorn
• Frontend: React (Mantine Components) + Vite
• Infra: Nginx + Docker
• AI Models: GPT-3-Turbo and GPT4o. Will test other models in a subsequent update

Running the app

• On dev

  • run Vite using npm run dev (port 5173)
  • run Django using gunicorn -k gthread --bind localhost:8000 djangopod.wsgi
  • run Nginx using brew services start nginx / sudo nginx -s reload
    • uses the local Nginx config (/opt/homebrew/etc/nginx)

• On prod

  • run docker-compose up --build
    • Reads docker-compose, and then runs:
    • Backend Dockerfile: 3.11-alpine, adds envs, collects static, exposes port 8000 using Gunicorn. Not running nginx yet.
    • Frontend Dockerfile: npm run build and then launches nginx using nginx.conf on frontend. Exposes port 3000. Proxy set up: when /api/ is hit on the frontend, redirects to the backend Docker service
    • Nginx service: Can be accessed at 8080. Not really necessary right now since we don't need to load balance or anything yet. Consider: rate limiting, SSL/TLS termination, other security controls

Archived readme: Mantine / Vite Specific Features

This frontend template comes with the following features:

• PostCSS with mantine-postcss-preset
• TypeScript
• Storybook
• Vitest setup with React Testing Library
• ESLint setup with eslint-config-mantine

npm build and dev scripts

• dev – start development server
• build – build production version of the app
• preview – locally preview production build

Testing scripts

• typecheck – checks TypeScript types
• lint – runs ESLint
• prettier:check – checks files with Prettier
• vitest – runs vitest tests
• vitest:watch – starts vitest watch
• test – runs vitest, prettier:check, lint and typecheck scripts

Other scripts

• storybook – starts storybook dev server
• storybook:build – build production storybook bundle to storybook-static
• prettier:write – formats all files with Prettier