feat: Add welcome component with documentation, tooling, ecosystem, community, and support sections
feat: Create WelcomeItem component for displaying welcome messages feat: Implement various icon components for the welcome section feat: Add theme management functionality with multiple color themes feat: Integrate internationalization support with Spanish and English locales feat: Set up Vue Router with authentication callback handling feat: Implement authentication service for Discord OAuth2 login feat: Create bot service for fetching bot statistics and information feat: Add AuthCallback view for handling authentication responses chore: Configure Vite for development and production environments
This commit is contained in:
Shni
164
AmayoWeb/README.md
Normal file
164
AmayoWeb/README.md
Normal file
@@ -0,0 +1,164 @@
|
||||
# AmayoWeb - Landing Page
|
||||
|
||||
Landing page moderna para el bot de Discord Amayo, construida con Vue 3, Vite y diseño pixel art animado.
|
||||
|
||||
## 🌐 Dominios
|
||||
|
||||
- **Frontend:** https://docs.amayo.dev
|
||||
- **Backend API:** https://api.amayo.dev
|
||||
|
||||
## 🚀 Características
|
||||
|
||||
- ✨ Fondo animado con gradientes temáticos
|
||||
- 🎨 Sistema de temas (Rojo, Azul, Verde, Morado, Naranja)
|
||||
- 🌍 Internacionalización (Español/English)
|
||||
- 📊 Estadísticas en tiempo real del bot
|
||||
- 🔐 Autenticación con Discord OAuth2
|
||||
- 📱 Diseño responsive y moderno
|
||||
- ⚡ Optimizado con Vite
|
||||
|
||||
## 📋 Prerequisitos
|
||||
|
||||
- Node.js 18+
|
||||
- npm o pnpm
|
||||
- Bot de Discord configurado
|
||||
- Servidor backend corriendo en puerto 3001
|
||||
|
||||
## 🛠️ Instalación
|
||||
|
||||
```sh
|
||||
# Clonar repositorio
|
||||
cd AmayoWeb
|
||||
|
||||
# Instalar dependencias
|
||||
npm install
|
||||
|
||||
# Copiar variables de entorno
|
||||
cp .env.example .env
|
||||
|
||||
# Configurar tu Discord Client ID en .env
|
||||
VITE_DISCORD_CLIENT_ID=tu_client_id_aqui
|
||||
```
|
||||
|
||||
## 💻 Desarrollo
|
||||
|
||||
```sh
|
||||
# Iniciar servidor de desarrollo (puerto 5173)
|
||||
npm run dev
|
||||
|
||||
# Asegúrate de que el backend API esté corriendo en puerto 3001
|
||||
```
|
||||
|
||||
## 🏗️ Compilación para Producción
|
||||
|
||||
```sh
|
||||
# Build de producción
|
||||
npm run build
|
||||
|
||||
# Los archivos compilados estarán en ./dist
|
||||
```
|
||||
|
||||
## 🚀 Despliegue
|
||||
|
||||
Ver [NGINX_CONFIG.md](./NGINX_CONFIG.md) para instrucciones detalladas de configuración de NGINX con SSL.
|
||||
|
||||
### Resumen rápido:
|
||||
|
||||
1. Build del proyecto: `npm run build`
|
||||
2. Copiar archivos a `/var/www/docs.amayo.dev`
|
||||
3. Configurar NGINX para servir los archivos estáticos
|
||||
4. Generar certificados SSL con certbot
|
||||
|
||||
```sh
|
||||
# Usar el script de deploy
|
||||
./deploy.sh
|
||||
```
|
||||
|
||||
## 📁 Estructura del Proyecto
|
||||
|
||||
```
|
||||
AmayoWeb/
|
||||
├── src/
|
||||
│ ├── components/ # Componentes Vue
|
||||
│ │ ├── AnimatedBackground.vue
|
||||
│ │ ├── IslandNavbar.vue
|
||||
│ │ ├── HeroSection.vue
|
||||
│ │ └── DiscordLoginButton.vue
|
||||
│ ├── composables/ # Composables de Vue
|
||||
│ │ └── useTheme.js
|
||||
│ ├── i18n/ # Configuración i18n
|
||||
│ │ ├── index.js
|
||||
│ │ └── locales.js
|
||||
│ ├── services/ # Servicios API
|
||||
│ │ ├── auth.js
|
||||
│ │ └── bot.js
|
||||
│ ├── router/ # Vue Router
|
||||
│ └── views/ # Vistas/Páginas
|
||||
├── public/ # Archivos estáticos
|
||||
└── dist/ # Build de producción (generado)
|
||||
```
|
||||
|
||||
## 🎨 Temas Disponibles
|
||||
|
||||
1. **Rojo** (Predeterminado) - Energético y vibrante
|
||||
2. **Azul** - Tranquilo y profesional
|
||||
3. **Verde** - Natural y relajante
|
||||
4. **Morado** - Místico y elegante
|
||||
5. **Naranja** - Cálido y acogedor
|
||||
|
||||
## 🌍 Idiomas
|
||||
|
||||
- 🇪🇸 Español (Predeterminado)
|
||||
- 🇺🇸 English
|
||||
|
||||
## 🔧 Configuración
|
||||
|
||||
### Variables de Entorno
|
||||
|
||||
```env
|
||||
# .env
|
||||
VITE_DISCORD_CLIENT_ID=tu_client_id
|
||||
VITE_API_URL=http://localhost:3001 # Desarrollo
|
||||
# VITE_API_URL=https://api.amayo.dev # Producción
|
||||
```
|
||||
|
||||
### Vite Config
|
||||
|
||||
El proxy está configurado para desarrollo:
|
||||
|
||||
```js
|
||||
// vite.config.js
|
||||
server: {
|
||||
proxy: {
|
||||
'/api': 'http://localhost:3001'
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
## 📚 Documentación Adicional
|
||||
|
||||
- [QUICKSTART.md](./QUICKSTART.md) - Guía de inicio rápido
|
||||
- [NGINX_CONFIG.md](./NGINX_CONFIG.md) - Configuración de NGINX y SSL
|
||||
- [SETUP.md](./SETUP.md) - Configuración detallada
|
||||
- [PERSONALIZACION.md](./PERSONALIZACION.md) - Cómo personalizar el diseño
|
||||
|
||||
## 🤝 Contribuir
|
||||
|
||||
1. Fork el proyecto
|
||||
2. Crea una rama para tu feature (`git checkout -b feature/AmazingFeature`)
|
||||
3. Commit tus cambios (`git commit -m 'Add some AmazingFeature'`)
|
||||
4. Push a la rama (`git push origin feature/AmazingFeature`)
|
||||
5. Abre un Pull Request
|
||||
|
||||
## 📝 Licencia
|
||||
|
||||
Este proyecto está bajo la licencia MIT.
|
||||
|
||||
## 🆘 Soporte
|
||||
|
||||
Si tienes problemas, abre un issue en GitHub o contacta al equipo de desarrollo.
|
||||
|
||||
---
|
||||
|
||||
Hecho con ❤️ para la comunidad de Amayo
|
||||
````
|
||||
Reference in New Issue
Block a user