Skip to content

Commit 6b210d1

Browse files
Softx0Softx0
committed
feat: terminando el template con los ultimos cambios
1 parent 13e82cb commit 6b210d1

File tree

3 files changed

+340
-5
lines changed

3 files changed

+340
-5
lines changed

‎azure-pipelines.yml‎

Lines changed: 61 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,9 +14,70 @@ pool:
1414
variables:
1515
GIT_CLONE_PATH: "$(Build.SourcesDirectory)"
1616
IMAGE_NAME: "your-image-registry.azurecr.io" # Replace 'your-image-registry' with your actual image registry name
17+
NODE_VERSION: "18.x"
1718

1819
stages:
20+
- stage: QualityGate
21+
displayName: "Quality Gate & Testing"
22+
jobs:
23+
- job: CodeQuality
24+
displayName: "Code Quality Checks"
25+
steps:
26+
- task: NodeTool@0
27+
displayName: "Setup Node.js"
28+
inputs:
29+
versionSpec: "$(NODE_VERSION)"
30+
31+
- script: |
32+
echo "📦 Installing dependencies..."
33+
npm ci
34+
displayName: "Install Dependencies"
35+
36+
- script: |
37+
echo "🔍 Running TypeScript type checking..."
38+
npm run type-check
39+
displayName: "TypeScript Type Check"
40+
41+
- script: |
42+
echo "🧹 Running ESLint..."
43+
npm run lint
44+
displayName: "ESLint Check"
45+
46+
- script: |
47+
echo "🎨 Checking code formatting..."
48+
npm run format
49+
displayName: "Prettier Format Check"
50+
51+
- script: |
52+
echo "🧪 Running tests..."
53+
npm run test:coverage
54+
displayName: "Run Tests with Coverage"
55+
continueOnError: true
56+
57+
- script: |
58+
echo "🏗️ Building application..."
59+
npm run build
60+
displayName: "Build Application"
61+
62+
- task: PublishTestResults@2
63+
displayName: "Publish Test Results"
64+
inputs:
65+
testResultsFormat: "JUnit"
66+
testResultsFiles: "coverage/junit.xml"
67+
mergeTestResults: true
68+
condition: succeededOrFailed()
69+
70+
- task: PublishCodeCoverageResults@1
71+
displayName: "Publish Code Coverage"
72+
inputs:
73+
codeCoverageTool: "Cobertura"
74+
summaryFileLocation: "coverage/cobertura-coverage.xml"
75+
condition: succeededOrFailed()
76+
1977
- stage: Build
78+
displayName: "Build & Push Images"
79+
dependsOn: QualityGate
80+
condition: succeeded()
2081
jobs:
2182
- job: Build_Dev
2283
displayName: "Build DEV"

‎documentation/AZURE_VARIABLES.md‎

Lines changed: 208 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,208 @@
1+
# Azure DevOps Pipeline Variables
2+
3+
Este documento describe todas las variables que deben configurarse en Azure DevOps para cada ambiente (DEV, QA, PROD).
4+
5+
## 🔧 Variables Requeridas por Ambiente
6+
7+
### Variables de Build y Docker
8+
9+
#### DEV Environment
10+
11+
- `TAG_IMAGE_DEV` - Tag para la imagen Docker de desarrollo (ej: `dev-latest`)
12+
- `NODE_ENV_DEV` - Entorno de Node.js (ej: `development`)
13+
- `PORT_DEV` - Puerto de la aplicación (ej: `3000`)
14+
15+
#### QA Environment
16+
17+
- `TAG_IMAGE_QA` - Tag para la imagen Docker de QA (ej: `qa-latest`)
18+
- `NODE_ENV_QA` - Entorno de Node.js (ej: `staging`)
19+
- `PORT_QA` - Puerto de la aplicación (ej: `3000`)
20+
21+
#### PROD Environment
22+
23+
- `TAG_IMAGE_PROD` - Tag para la imagen Docker de producción (ej: `prod-latest`)
24+
- `NODE_ENV_PROD` - Entorno de Node.js (ej: `production`)
25+
- `PORT_PROD` - Puerto de la aplicación (ej: `3000`)
26+
27+
### Variables de API Configuration
28+
29+
#### DEV Environment
30+
31+
- `VITE_API_BASE_URL_DEV` - URL base del API de desarrollo
32+
- `VITE_API_TIMEOUT_DEV` - Timeout para requests API (ej: `10000`)
33+
34+
#### QA Environment
35+
36+
- `VITE_API_BASE_URL_QA` - URL base del API de QA
37+
- `VITE_API_TIMEOUT_QA` - Timeout para requests API (ej: `10000`)
38+
39+
#### PROD Environment
40+
41+
- `VITE_API_BASE_URL_PROD` - URL base del API de producción
42+
- `VITE_API_TIMEOUT_PROD` - Timeout para requests API (ej: `15000`)
43+
44+
### Variables JWT Configuration
45+
46+
#### DEV Environment
47+
48+
- `VITE_JWT_SECRET_DEV` - Secret key para JWT (debe ser seguro)
49+
- `VITE_JWT_EXPIRES_IN_DEV` - Tiempo de expiración JWT (ej: `24h`)
50+
51+
#### QA Environment
52+
53+
- `VITE_JWT_SECRET_QA` - Secret key para JWT (debe ser seguro)
54+
- `VITE_JWT_EXPIRES_IN_QA` - Tiempo de expiración JWT (ej: `24h`)
55+
56+
#### PROD Environment
57+
58+
- `VITE_JWT_SECRET_PROD` - Secret key para JWT (debe ser muy seguro)
59+
- `VITE_JWT_EXPIRES_IN_PROD` - Tiempo de expiración JWT (ej: `12h`)
60+
61+
### Variables Feature Flags
62+
63+
#### DEV Environment
64+
65+
- `VITE_ENABLE_INACTIVITY_TIMER_DEV` - Habilitar timer de inactividad (ej: `true`)
66+
- `VITE_DEFAULT_INACTIVITY_TIME_DEV` - Tiempo de inactividad en ms (ej: `600000`)
67+
68+
#### QA Environment
69+
70+
- `VITE_ENABLE_INACTIVITY_TIMER_QA` - Habilitar timer de inactividad (ej: `true`)
71+
- `VITE_DEFAULT_INACTIVITY_TIME_QA` - Tiempo de inactividad en ms (ej: `300000`)
72+
73+
#### PROD Environment
74+
75+
- `VITE_ENABLE_INACTIVITY_TIMER_PROD` - Habilitar timer de inactividad (ej: `true`)
76+
- `VITE_DEFAULT_INACTIVITY_TIME_PROD` - Tiempo de inactividad en ms (ej: `300000`)
77+
78+
### Variables de Environment
79+
80+
#### DEV Environment
81+
82+
- `VITE_ENVIRONMENT_DEV` - Identificador del ambiente (ej: `development`)
83+
84+
#### QA Environment
85+
86+
- `VITE_ENVIRONMENT_QA` - Identificador del ambiente (ej: `staging`)
87+
88+
#### PROD Environment
89+
90+
- `VITE_ENVIRONMENT_PROD` - Identificador del ambiente (ej: `production`)
91+
92+
### Variables Legacy (Compatibilidad)
93+
94+
#### DEV Environment
95+
96+
- `REACT_APP_API_URL_DEV` - URL del API (compatibilidad)
97+
- `REACT_APP_API_KEY_DEV` - API Key (compatibilidad)
98+
99+
#### QA Environment
100+
101+
- `REACT_APP_API_URL_QA` - URL del API (compatibilidad)
102+
- `REACT_APP_API_KEY_QA` - API Key (compatibilidad)
103+
104+
#### PROD Environment
105+
106+
- `REACT_APP_API_URL_PROD` - URL del API (compatibilidad)
107+
- `REACT_APP_API_KEY_PROD` - API Key (compatibilidad)
108+
109+
## 🔐 Variables de Docker Registry
110+
111+
Estas variables son requeridas para el login y push de imágenes Docker:
112+
113+
- `DOCKER_REGISTRY_USERNAME` - Usuario del registro de contenedores
114+
- `DOCKER_REGISTRY_PASSWORD` - Contraseña del registro de contenedores
115+
116+
## 🚀 Configuración en Azure DevOps
117+
118+
### Paso 1: Acceder a Variables
119+
120+
1. Ve a tu proyecto en Azure DevOps
121+
2. Navega a **Pipelines** > **Library**
122+
3. Crea un nuevo **Variable Group** para cada ambiente
123+
124+
### Paso 2: Crear Variable Groups
125+
126+
Crea los siguientes grupos de variables:
127+
128+
- `frontend-dev-variables`
129+
- `frontend-qa-variables`
130+
- `frontend-prod-variables`
131+
132+
### Paso 3: Configurar Variables
133+
134+
Para cada grupo, agrega todas las variables correspondientes al ambiente.
135+
136+
### Paso 4: Vincular al Pipeline
137+
138+
En tu `azure-pipelines.yml`, asegúrate de importar los grupos de variables:
139+
140+
```yaml
141+
variables:
142+
- group: "frontend-dev-variables" # Para DEV
143+
- group: "frontend-qa-variables" # Para QA
144+
- group: "frontend-prod-variables" # Para PROD
145+
```
146+
147+
## 📋 Template de Variables
148+
149+
### Valores Sugeridos para DEV
150+
151+
```bash
152+
TAG_IMAGE_DEV=dev-latest
153+
NODE_ENV_DEV=development
154+
PORT_DEV=3000
155+
VITE_API_BASE_URL_DEV=https://api-dev.tudominio.com/api
156+
VITE_API_TIMEOUT_DEV=10000
157+
VITE_JWT_SECRET_DEV=tu-secret-key-desarrollo-super-seguro
158+
VITE_JWT_EXPIRES_IN_DEV=24h
159+
VITE_ENABLE_INACTIVITY_TIMER_DEV=true
160+
VITE_DEFAULT_INACTIVITY_TIME_DEV=600000
161+
VITE_ENVIRONMENT_DEV=development
162+
```
163+
164+
### Valores Sugeridos para QA
165+
166+
```bash
167+
TAG_IMAGE_QA=qa-latest
168+
NODE_ENV_QA=staging
169+
PORT_QA=3000
170+
VITE_API_BASE_URL_QA=https://api-qa.tudominio.com/api
171+
VITE_API_TIMEOUT_QA=10000
172+
VITE_JWT_SECRET_QA=tu-secret-key-qa-super-seguro
173+
VITE_JWT_EXPIRES_IN_QA=24h
174+
VITE_ENABLE_INACTIVITY_TIMER_QA=true
175+
VITE_DEFAULT_INACTIVITY_TIME_QA=300000
176+
VITE_ENVIRONMENT_QA=staging
177+
```
178+
179+
### Valores Sugeridos para PROD
180+
181+
```bash
182+
TAG_IMAGE_PROD=prod-latest
183+
NODE_ENV_PROD=production
184+
PORT_PROD=3000
185+
VITE_API_BASE_URL_PROD=https://api.tudominio.com/api
186+
VITE_API_TIMEOUT_PROD=15000
187+
VITE_JWT_SECRET_PROD=tu-secret-key-produccion-ultra-seguro
188+
VITE_JWT_EXPIRES_IN_PROD=12h
189+
VITE_ENABLE_INACTIVITY_TIMER_PROD=true
190+
VITE_DEFAULT_INACTIVITY_TIME_PROD=300000
191+
VITE_ENVIRONMENT_PROD=production
192+
```
193+
194+
## ⚠️ Notas de Seguridad
195+
196+
1. **JWT Secrets**: Usa secretos únicos y seguros para cada ambiente
197+
2. **API Keys**: Nunca compartas las API keys en código fuente
198+
3. **Variables Sensibles**: Marca como "secretas" las variables sensibles en Azure DevOps
199+
4. **Rotación**: Cambia regularmente los secretos de producción
200+
201+
## 🔄 Actualización de Variables
202+
203+
Cuando se agreguen nuevas features que requieran variables de entorno:
204+
205+
1. Actualiza este documento
206+
2. Actualiza el archivo `setup_env.sh`
207+
3. Configura las variables en Azure DevOps
208+
4. Prueba en DEV antes de implementar en QA/PROD

‎setup_env.sh‎

Lines changed: 71 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,82 @@
11
#!/bin/bash
2+
3+
# React TypeScript Template 2024 - Environment Setup Script
4+
# Usage: ./setup_env.sh [DEV|QA|PROD]
5+
26
env=$1
37

8+
if [ -z "$env" ]; then
9+
echo "Error: Environment not specified"
10+
echo "Usage: ./setup_env.sh [DEV|QA|PROD]"
11+
exit 1
12+
fi
13+
14+
echo "🚀 Setting up environment variables for: $env"
15+
16+
# Docker & Build Variables
417
TAG_IMAGE=TAG_IMAGE_$env
518
NODE_ENV=NODE_ENV_$env
619
PORT=PORT_$env
720

21+
# API Configuration Variables
22+
VITE_API_BASE_URL=VITE_API_BASE_URL_$env
23+
VITE_API_TIMEOUT=VITE_API_TIMEOUT_$env
24+
25+
# JWT Configuration Variables
26+
VITE_JWT_SECRET=VITE_JWT_SECRET_$env
27+
VITE_JWT_EXPIRES_IN=VITE_JWT_EXPIRES_IN_$env
28+
29+
# Feature Flags
30+
VITE_ENABLE_INACTIVITY_TIMER=VITE_ENABLE_INACTIVITY_TIMER_$env
31+
VITE_DEFAULT_INACTIVITY_TIME=VITE_DEFAULT_INACTIVITY_TIME_$env
32+
33+
# Environment Specific
34+
VITE_ENVIRONMENT=VITE_ENVIRONMENT_$env
35+
36+
# Legacy Variables (backward compatibility)
837
VITE_REACT_APP_API_URL=REACT_APP_API_URL_$env
938
VITE_REACT_APP_API_KEY=REACT_APP_API_KEY_$env
1039

11-
echo TAG_IMAGE=${!TAG_IMAGE} >> ../env
12-
echo NODE_ENV=${!NODE_ENV} >> ../env
13-
echo PORT=${!PORT} >> ../env
40+
echo "📝 Writing environment variables to ../env file"
41+
42+
# Create or clear the env file
43+
echo "# Generated environment file for $env environment" > ../env
44+
echo "# Generated on: $(date)" >> ../env
45+
echo "" >> ../env
46+
47+
# Docker & Build Variables
48+
echo "TAG_IMAGE=${!TAG_IMAGE}" >> ../env
49+
echo "NODE_ENV=${!NODE_ENV}" >> ../env
50+
echo "PORT=${!PORT}" >> ../env
51+
echo "" >> ../env
52+
53+
# API Configuration
54+
echo "VITE_API_BASE_URL=${!VITE_API_BASE_URL}" >> ../env
55+
echo "VITE_API_TIMEOUT=${!VITE_API_TIMEOUT}" >> ../env
56+
echo "" >> ../env
57+
58+
# JWT Configuration
59+
echo "VITE_JWT_SECRET=${!VITE_JWT_SECRET}" >> ../env
60+
echo "VITE_JWT_EXPIRES_IN=${!VITE_JWT_EXPIRES_IN}" >> ../env
61+
echo "" >> ../env
62+
63+
# Feature Flags
64+
echo "VITE_ENABLE_INACTIVITY_TIMER=${!VITE_ENABLE_INACTIVITY_TIMER}" >> ../env
65+
echo "VITE_DEFAULT_INACTIVITY_TIME=${!VITE_DEFAULT_INACTIVITY_TIME}" >> ../env
66+
echo "" >> ../env
67+
68+
# Environment
69+
echo "VITE_ENVIRONMENT=${!VITE_ENVIRONMENT}" >> ../env
70+
echo "" >> ../env
71+
72+
# Legacy Variables (backward compatibility)
73+
echo "VITE_REACT_APP_API_URL=${!VITE_REACT_APP_API_URL}" >> ../env
74+
echo "VITE_REACT_APP_API_KEY=${!VITE_REACT_APP_API_KEY}" >> ../env
1475

15-
echo VITE_REACT_APP_API_URL=${!VITE_REACT_APP_API_URL} >> ../env
16-
echo VITE_REACT_APP_API_KEY=${!VITE_REACT_APP_API_KEY} >> ../env
76+
echo "✅ Environment setup completed for: $env"
77+
echo "📄 Environment file generated at: ../env"
78+
echo ""
79+
echo "🔧 Next steps:"
80+
echo "1. Review the generated ../env file"
81+
echo "2. Ensure all required environment variables are set in your CI/CD system"
82+
echo "3. Run 'docker build' or 'npm run build' to build the application"

0 commit comments

Comments
 (0)