bb1a05af07
nodemon now watches both server.js and client/src/. On any change, it rebuilds the React app and restarts Express — so git push makes both backend AND frontend changes visible on the hot domain. - dev script simplified to "nodemon" (reads nodemon.json config) - dev:local added for human developers who want Vite HMR
74 lines
2.3 KiB
Markdown
74 lines
2.3 KiB
Markdown
# Company Website Template
|
|
|
|
React + shadcn/ui + Express + PostgreSQL + Redis scaffold for SAAC deployment.
|
|
|
|
## Stack
|
|
|
|
- **Frontend**: React 19 + Vite + TypeScript + TailwindCSS v4 + shadcn/ui
|
|
- **Backend**: Express.js (Node 20)
|
|
- **Database**: PostgreSQL 16
|
|
- **Cache**: Redis 7
|
|
- **Deploy**: Docker Compose via `saac deploy`
|
|
|
|
## Structure
|
|
|
|
```
|
|
├── server.js # Express backend (API + serves React build)
|
|
├── client/ # React frontend (Vite + shadcn/ui)
|
|
│ ├── src/
|
|
│ │ ├── components/ui/ # shadcn/ui components (Button, Card, Input, etc.)
|
|
│ │ ├── lib/utils.ts # cn() utility for Tailwind class merging
|
|
│ │ ├── pages/ # Page components
|
|
│ │ ├── App.tsx # Router
|
|
│ │ └── main.tsx # Entry point
|
|
│ ├── components.json # shadcn/ui config
|
|
│ ├── vite.config.ts # Vite config with path aliases
|
|
│ └── package.json # Client dependencies
|
|
├── docker-compose.yml # PostgreSQL + Redis + App (see comments inside)
|
|
├── Dockerfile # Multi-stage: build React → serve with Express
|
|
├── SAAC_DEPLOYMENT.md # Deployment rules — READ THIS FIRST
|
|
└── package.json # Server dependencies
|
|
```
|
|
|
|
## Development
|
|
|
|
```bash
|
|
# Install all dependencies (postinstall auto-installs client deps)
|
|
npm install
|
|
|
|
# Run in dev mode (watches server.js + client/src, auto-rebuilds on changes)
|
|
npm run dev
|
|
|
|
# Or for local development with Vite HMR (browser hot-reload):
|
|
npm run dev:local # Express :3000 + Vite :5173 concurrently
|
|
|
|
# Or run separately:
|
|
npm run dev:server # Express on :3000 (with nodemon auto-restart)
|
|
npm run dev:client # Vite on :5173 (proxies /api to :3000)
|
|
```
|
|
|
|
## Adding shadcn/ui Components
|
|
|
|
```bash
|
|
cd client
|
|
npx shadcn@latest add dialog # Add Dialog component
|
|
npx shadcn@latest add table # Add Table component
|
|
npx shadcn@latest add select # Add Select component
|
|
```
|
|
|
|
Import: `import { Button } from "@/components/ui/button"`
|
|
|
|
## Deploy
|
|
|
|
```bash
|
|
saac deploy
|
|
```
|
|
|
|
See `SAAC_DEPLOYMENT.md` for deployment rules, common mistakes, and debugging commands.
|
|
|
|
## API Routes
|
|
|
|
- `GET /health` — Health check (PostgreSQL + Redis)
|
|
- `GET /api/status` — Example API endpoint
|
|
- `GET /*` — React SPA (served from client/dist)
|