Una aplicación web moderna para convertir texto español a su representación en el sistema Braille de 6 puntos, desarrollada con las mejores tecnologías y prácticas del mercado.
- Frontend Framework: Next.js 14
- Lenguaje: TypeScript
- Estilos: TailwindCSS
- Componentes: shadcn/ui
- Iconos: Lucide React
- Build Tool: Next.js
- Node.js 18+
- npm o yarn
- Clonar el repositorio:
git clone <repository-url>
cd Proyecto-Primer-Bimestre- Instalar dependencias:
npm install- Ejecutar el servidor de desarrollo:
npm run dev- Abrir http://localhost:3000 en el navegador.
Proyecto-Primer-Bimestre/
├── src/
│ ├── app/ # App Router de Next.js
│ │ ├── layout.tsx # Layout principal
│ │ ├── page.tsx # Página principal
│ │ └── globals.css # Estilos globales
│ ├── components/ # Componentes React
│ │ ├── Header.tsx # Header con navegación
│ │ ├── Hero.tsx # Sección hero
│ │ ├── Features.tsx # Características
│ │ ├── Footer.tsx # Footer
│ │ └── ui/ # Componentes UI base
│ │ └── Button.tsx # Componente Button
│ ├── utils/ # Utilidades
│ │ └── cn.ts # Utilidad de clases
│ ├── hooks/ # Hooks personalizados
│ ├── types/ # Definiciones TypeScript
│ └── styles/ # Estilos adicionales
├── public/ # Assets estáticos
├── docs/ # Documentación
├── tests/ # Pruebas
└──配置文件/ # Archivos de configuración
- ✅ Diseño Responsive: Adaptable a todos los dispositivos
- ✅ Dark Mode: Soporte para modo oscuro
- ✅ Performance Optimized: Optimizado para máxima velocidad
- ✅ SEO Friendly: Estructura semántica y optimización SEO
- ✅ Accessibility: Cumplimiento WCAG 2.1 AA
- ✅ TypeScript: Tipado estático para mejor calidad
- ✅ Component-Based: Arquitectura de componentes reutilizables
- Navegación responsive
- Toggle de dark mode
- Menú móvil
- Sección de impacto inicial
- Call-to-action buttons
- Estadísticas destacadas
- Grid de características
- Iconos descriptivos
- Sección de contacto
- Información de contacto
- Enlaces rápidos
- Redes sociales
npm run dev- Servidor de desarrollonpm run build- Build para producciónnpm run start- Servidor de producciónnpm run lint- Linting del códigonpm run test- Ejecutar pruebas
El proyecto está diseñado con un enfoque mobile-first, asegurando una experiencia óptima en:
- 📱 Móviles (320px+)
- 📱 Tablets (768px+)
- 💻 Desktops (1024px+)
- 🖥️ Large screens (1440px+)
La aplicación incluye soporte para dark mode con:
- Toggle en el header
- Persistencia de preferencia
- Transiciones suaves
Configurado con:
- Tema personalizado
- Variables CSS
- Animaciones custom
Configurado con:
- Path aliases
- Estricto tipado
- Next.js integration
Optimizaciones implementadas:
- Code splitting
- Lazy loading
- Image optimization
- Bundle analysis
- Fork del proyecto
- Crear feature branch (
git checkout -b feature/AmazingFeature) - Commit cambios (
git commit -m 'Add some AmazingFeature') - Push al branch (
git push origin feature/AmazingFeature) - Abrir Pull Request
Este proyecto está bajo la Licencia MIT - ver el archivo LICENSE para detalles.
- Autor: Kevin Palacios
- Email: contacto@proyecto.com
- Proyecto: Construcción de Software - EPN
Desarrollado con ❤️ para el primer bimestre de Construcción de Software