DEV Community

Amir Mohammad Hemmati
Amir Mohammad Hemmati

Posted on

created a full web-site creator codebase fully integrated via AI, Backend and front end ready to use

https://github.com/YoungAlpaccino/simple-website-creator-backend-ai

GitHub logo YoungAlpaccino / simple-website-creator-backend-ai

fully upgradedbackend with modified endpoints in order to fetch all we want for a website creator from auth till response

◆ SiteCreator — Backend

FastAPI service powering auth, projects, AI generation, and publishing.

Python FastAPI SQLModel License: MIT

Part of SiteCreator. This is the API only — the UI lives in ../frontend.


✨ What it does

  • 🔐 Auth — email + password, hashed with bcrypt, JWT access tokens.
  • 🗂️ Projects — per-user CRUD for sites (name, prompt, generated HTML).
  • 🪄 AI generation — streams a complete landing page from a pluggable LLM provider as Server-Sent Events.
  • 🌍 Publishing — gives each site a unique public slug at /p/{slug}.

🚀 Setup

cd backend
python -m venv .venv
# Windows:  .venv\Scripts\activate   |   macOS/Linux:  source .venv/bin/activate
pip install -r requirements.txt

cp .env.example .env          # then edit (see Configuration below)
uvicorn app.main:app --reload --port 8000
Enter fullscreen mode Exit fullscreen mode

Generate a strong SECRET_KEY:

python -c "import secrets; print(secrets.token_urlsafe(48))"
Enter fullscreen mode Exit fullscreen mode

⚙️ Configuration

All settings come from environment variables (.env). See…

https://github.com/YoungAlpaccino/simple-website-creator-frontend

GitHub logo YoungAlpaccino / simple-website-creator-frontend

FULLY FUNCTIONAL PROJECT HAPPENING TO BE RUNNING AT THIS SCALE. create web single pages by prompting to our AI.

◆ SiteCreator — Frontend

The React app: landing page, auth, dashboard, and the live AI Builder.

React TypeScript Vite Tailwind CSS License: MIT

Part of SiteCreator. This is the UI — it talks to the FastAPI service in ../backend.


✨ Highlights

  • 🪄 Live Builder — type a prompt, watch the generated page stream into a sandboxed <iframe> preview in real time.
  • ✏️ Edit & regenerate — refine the prompt or hand-edit the raw HTML.
  • 🌍 Publish flow — one click, with a copyable public link.
  • 🔐 Auth + protected routes — JWT stored client-side, guarded dashboard.
  • TanStack Query — caching, mutations, and tidy server-state.

🚀 Setup

cd frontend
npm install
npm run dev          # http://localhost:5173
Enter fullscreen mode Exit fullscreen mode

The dev server proxies /api and /p to the backend on :8000 (see vite.config.ts), so start the backend first and you only ever deal with one origin.

Scripts

Command What it does
npm run dev Start the Vite

Top comments (0)