Initial project setup: monorepo structure with frontend and backend

- Set up pnpm workspace with frontend (React + Vite) and backend (Express + Prisma)
- Configure TypeScript, ESLint, and Prettier
- Add Prisma schema for database models (User, Course, Lesson, Progress, etc.)
- Create basic frontend structure with Tailwind CSS and shadcn/ui
- Add environment configuration files
- Update README with project overview and setup instructions
- Complete Phase 0: Project initialization
This commit is contained in:
2026-01-17 11:58:26 +01:00
parent e38194a44c
commit a11e2acb23
29 changed files with 6794 additions and 9 deletions

View File

@@ -75,7 +75,7 @@ znakovni/
### Prerequisites
- **Node.js 20 LTS** or higher
- **pnpm** package manager
- **pnpm** package manager (install with `npm install -g pnpm`)
- **MySQL 8.0+** database server
- **Git** for version control
@@ -92,26 +92,40 @@ znakovni/
pnpm install
```
3. **Configure environment variables**
When prompted to approve build scripts, select:
- `@prisma/client`
- `@prisma/engines`
- `bcrypt`
- `esbuild`
- `prisma`
3. **Generate Prisma Client**
```bash
cd packages/backend
npx prisma generate
cd ../..
```
4. **Configure environment variables**
```bash
# Backend
cp packages/backend/.env.example packages/backend/.env
# Edit packages/backend/.env with your database credentials and OAuth keys
# Frontend
# Edit packages/backend/.env with your database credentials
# Update DATABASE_URL with your MySQL connection string
# Frontend (optional)
cp packages/frontend/.env.example packages/frontend/.env
# Edit packages/frontend/.env with your API URL
```
4. **Set up the database**
5. **Set up the database**
```bash
cd packages/backend
npx prisma migrate dev
npx prisma migrate dev --name init
npx prisma db seed
cd ../..
```
5. **Start development servers**
6. **Start development servers**
```bash
pnpm dev
```
@@ -120,6 +134,53 @@ znakovni/
- Frontend: http://localhost:5173
- Backend: http://localhost:3000
### Verify Installation
Test the backend:
```bash
curl http://localhost:3000/api/health
```
You should see:
```json
{"status":"ok","message":"Backend is running!","timestamp":"..."}
```
Open http://localhost:5173 in your browser to see the frontend.
## 📋 Development Status
### ✅ Phase 0: Project Setup (COMPLETED)
**Deliverables:**
- ✅ Monorepo structure with pnpm workspaces
- ✅ Frontend (Vite + React + TypeScript) initialized
- ✅ Backend (Express + TypeScript) initialized
- ✅ Prisma with MySQL configured
- ✅ Tailwind CSS and shadcn/ui setup
- ✅ ESLint, Prettier, and TypeScript configs
- ✅ Environment variable templates
- ✅ Git repository and .gitignore
- ✅ Project compiles and runs successfully
- ✅ Database connection configured
- ✅ Basic "Hello World" on both ends
**What's Working:**
- Frontend builds and runs on http://localhost:5173
- Backend API runs on http://localhost:3000
- Health check endpoint: `GET /api/health`
- TypeScript compilation with strict mode
- Hot reload for development
### 🚧 Next Phase: Phase 1 - Core Infrastructure
**Upcoming Tasks:**
- Implement authentication (Passport.js with local, Google, Microsoft OAuth)
- Create user management system
- Build layout components (Sidebar, Header)
- Set up session management
- Implement CORS and security headers
## 📚 Key Features
### 1. Dictionary (Riječi)