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

#ai #backend #frontend #python

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…

View on GitHub

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
…
View on GitHub

Top comments (1)

Collapse
 
sanjay_singh_1 profile image
Sanjay Singh •

Your seamless coupling of an AI‑driven content generator with a ready‑to‑use backend and front‑end scaffolding is impressive, especially the way the repository abstracts the AI calls into a clean service layer. Have you thought about cross‑posting this to ZyVOP (zyvop.com) to reach an even broader engineer audience?