90 lines
1.9 KiB
Markdown
90 lines
1.9 KiB
Markdown
# bp-rect
|
|
|
|
React + Vite + TypeScript + TailwindCSS application.
|
|
|
|
## Quick Start
|
|
|
|
```bash
|
|
# Install dependencies
|
|
npm install
|
|
|
|
# Start development server
|
|
npm run dev
|
|
|
|
# Build for production
|
|
npm run build
|
|
|
|
# Preview production build
|
|
npm run preview
|
|
```
|
|
|
|
## Deploy to Unity Infrastructure
|
|
|
|
### Prerequisites
|
|
|
|
1. DNS record pointing to Gateway (3.0.22.121)
|
|
2. Git repository on Gitea (git.qikbite.asia)
|
|
|
|
### Deployment Steps
|
|
|
|
1. **Push to Gitea:**
|
|
```bash
|
|
git remote add origin https://git.qikbite.asia/git_admin/bp-rect.git
|
|
git push -u origin main
|
|
```
|
|
|
|
2. **Create app in Coolify:**
|
|
```bash
|
|
curl -sk -X POST 'https://coolify.qikbite.asia/api/v1/applications/dockerfile' \
|
|
--header 'Authorization: Bearer <COOLIFY_TOKEN>' \
|
|
--header 'Content-Type: application/json' \
|
|
--data '{
|
|
"project_uuid": "r8so044sg4cgcko84o8kgcks",
|
|
"server_uuid": "v8s4kw84o00gcocwcwos4k4s",
|
|
"destination_uuid": "tg80co08408s04oo80cg80ok",
|
|
"environment_name": "production",
|
|
"git_repository": "https://git.qikbite.asia/git_admin/bp-rect.git",
|
|
"git_branch": "main",
|
|
"build_pack": "dockerfile",
|
|
"ports_exposes": "3000",
|
|
"name": "bp-rect"
|
|
}'
|
|
```
|
|
|
|
3. **Add Gateway route** (SSH to 3.0.22.121):
|
|
```yaml
|
|
# /home/ubuntu/traefik/config/dynamic/services.yml
|
|
http:
|
|
routers:
|
|
bp-rect:
|
|
rule: "Host(`bp-rect.qikbite.asia`)"
|
|
service: coolify-apps
|
|
tls:
|
|
certResolver: letsencrypt
|
|
entryPoints:
|
|
- websecure
|
|
```
|
|
|
|
4. **Verify:** https://bp-rect.qikbite.asia
|
|
|
|
## Project Structure
|
|
|
|
```
|
|
src/
|
|
├── components/ # Reusable UI components
|
|
├── pages/ # Route pages
|
|
├── hooks/ # Custom React hooks
|
|
├── lib/ # Utilities and API clients
|
|
└── styles/ # Global styles
|
|
```
|
|
|
|
## Tech Stack
|
|
|
|
- React 18
|
|
- TypeScript
|
|
- Vite 5
|
|
- TailwindCSS 3
|
|
- React Router 6
|
|
- TanStack Query
|
|
- Zustand (state management)
|