fusero-site-frontend/README.md

Fusero Fullstack App

This project is a fullstack web application using:

• 🧩 React + TypeScript + Vite (frontend)
• ⚡ Fastify + MikroORM + PostgreSQL (backend)
• ✅ Vitest (testing framework for both frontend and backend)

---

📁 Folder Structure

fusero-frontend/
├── src/                 # React frontend (Vite)
├── tests/               # Frontend unit/component tests
├── backend/             # Fastify backend lives here
│   ├── src/             # Fastify app + MikroORM logic
│   ├── entities/        # MikroORM entity definitions
│   ├── tests/           # Backend unit/integration tests
│   └── tsconfig.json    # TypeScript config for backend
├── vite.config.ts       # Vite config
└── README.md

---

🛠️ Tech Stack

Frontend

Tool	Purpose
React	UI framework
TypeScript	Type safety
Vite	Fast dev server + build
Vitest	Unit & component testing
React Testing Library	Test components like real users

Backend

Tool	Purpose
Fastify	Lightweight backend server
TypeScript	Type safety
MikroORM	Database ORM
PostgreSQL	SQL database
Vitest + Supertest	HTTP & logic testing

---

🧪 Testing Setup

Frontend

• Run tests:

  pnpm test
  

• Uses:

  • vitest for fast unit testing
  • @testing-library/react for testing UI components

Backend

• Run tests:

  cd backend
  pnpm test
  

• Uses:

  • vitest + supertest for testing Fastify routes and logic

---

🚀 Getting Started

1. Install dependencies

pnpm install
cd backend && pnpm install

2. Run frontend

pnpm dev

3. Run backend

cd backend
pnpm dev

---

📦 Deployment

Frontend and backend can be deployed separately or behind a proxy (e.g. Nginx or Vercel + API routes). You can also Dockerize both services if needed.

---

📚 Environment Variables

Set these in .env files:

• Frontend: (optional)
• Backend:

  DATABASE_URL=postgresql://user:pass@localhost:5432/mydb
  

---

Let me know if you'd like a .env.example, CI config, or Docker setup.