203 lines
2.8 KiB
Markdown
203 lines
2.8 KiB
Markdown
Sim, dá para usar **Nixpacks**. Você **não deve compactar `node_modules`, `dist`, `.git`, logs, cache, uploads grandes**.
|
|
|
|
Compacte somente o código-fonte necessário:
|
|
|
|
```txt
|
|
meu-projeto/
|
|
├─ frontend/
|
|
│ ├─ package.json
|
|
│ ├─ package-lock.json
|
|
│ ├─ index.html
|
|
│ ├─ vite.config.*
|
|
│ ├─ src/
|
|
│ └─ public/
|
|
├─ backend/
|
|
│ ├─ package.json
|
|
│ ├─ package-lock.json
|
|
│ ├─ src/
|
|
│ └─ .env.example
|
|
prisma
|
|
nest-cli.json
|
|
tsconfig.build.json
|
|
tsconfig.json
|
|
└─ README.md
|
|
```
|
|
|
|
Ignore no `.zip`:
|
|
|
|
```txt
|
|
node_modules/
|
|
dist/
|
|
build/
|
|
.git/
|
|
.env
|
|
.env.local
|
|
*.log
|
|
.cache/
|
|
.vite/
|
|
coverage/
|
|
uploads/
|
|
tmp/
|
|
```
|
|
|
|
## Recomendado no Coolify
|
|
|
|
Crie **2 aplicações separadas**:
|
|
|
|
```txt
|
|
App 1: frontend React + Vite
|
|
App 2: backend API
|
|
```
|
|
|
|
---
|
|
|
|
# 1. Deploy do Backend
|
|
|
|
No Coolify:
|
|
|
|
**Source:** Upload ZIP ou Git
|
|
**Build Pack:** Nixpacks
|
|
**Base Directory:** `backend`
|
|
|
|
Build:
|
|
|
|
```bash
|
|
npm install
|
|
```
|
|
|
|
Build Command, se usar TypeScript:
|
|
|
|
```bash
|
|
npm run build
|
|
```
|
|
|
|
Start Command:
|
|
|
|
```bash
|
|
npm run start
|
|
```
|
|
|
|
Se o backend roda em dev com `npm run dev`, crie um script de produção no `backend/package.json`:
|
|
|
|
```json
|
|
{
|
|
"scripts": {
|
|
"build": "tsc",
|
|
"start": "node dist/server.js"
|
|
}
|
|
}
|
|
```
|
|
|
|
Ou, se for JavaScript puro:
|
|
|
|
```json
|
|
{
|
|
"scripts": {
|
|
"start": "node src/server.js"
|
|
}
|
|
}
|
|
```
|
|
|
|
No backend, use a porta via variável:
|
|
|
|
```js
|
|
const PORT = process.env.PORT || 3000;
|
|
app.listen(PORT, "0.0.0.0");
|
|
```
|
|
|
|
No Coolify, configure as variáveis de ambiente do backend, exemplo:
|
|
|
|
```env
|
|
DATABASE_URL=...
|
|
JWT_SECRET=...
|
|
NODE_ENV=production
|
|
```
|
|
|
|
---
|
|
|
|
# 2. Deploy do Frontend React + Vite
|
|
|
|
No Coolify:
|
|
|
|
**Build Pack:** Nixpacks
|
|
**Base Directory:** `frontend`
|
|
|
|
Build:
|
|
|
|
```bash
|
|
npm install
|
|
```
|
|
|
|
Build Command:
|
|
|
|
```bash
|
|
npm run build
|
|
```
|
|
|
|
Start Command:
|
|
|
|
```bash
|
|
npm run preview -- --host 0.0.0.0 --port $PORT
|
|
```
|
|
|
|
No `frontend/package.json`, deixe assim:
|
|
|
|
```json
|
|
{
|
|
"scripts": {
|
|
"build": "vite build",
|
|
"preview": "vite preview"
|
|
}
|
|
}
|
|
```
|
|
|
|
Variável para apontar para o backend:
|
|
|
|
```env
|
|
VITE_API_URL=https://api.seudominio.com
|
|
```
|
|
|
|
No código React:
|
|
|
|
```js
|
|
const API_URL = import.meta.env.VITE_API_URL;
|
|
```
|
|
|
|
---
|
|
|
|
# 3. O que compactar
|
|
|
|
Compacte a pasta raiz do projeto contendo `frontend` e `backend`, mas sem arquivos pesados.
|
|
|
|
Exemplo:
|
|
|
|
```bash
|
|
zip -r projeto.zip . \
|
|
-x "*/node_modules/*" \
|
|
-x "*/dist/*" \
|
|
-x "*/build/*" \
|
|
-x ".git/*" \
|
|
-x "*/.env*" \
|
|
-x "*/.cache/*"
|
|
```
|
|
|
|
Melhor ainda: suba no **GitHub/GitLab** e conecte o repositório no Coolify. É mais fácil de atualizar depois.
|
|
|
|
Configuração da imagem:
|
|
|
|
Frontend:
|
|
|
|
```txt
|
|
Install Command: npm install
|
|
Build Command: npm run build
|
|
Start Command: npm run preview -- --host 0.0.0.0 --port $PORT
|
|
```
|
|
|
|
Backend:
|
|
|
|
```txt
|
|
Install Command: npm install
|
|
Build Command: npm run build
|
|
Start Command: npm run start
|
|
```
|