FlowSync Landing Page
Repositorio principal de la landing page pública de FlowSync. Construida con Next.js 16 + TypeScript + CSS Modules.
🚀 Inicio rápido
# Instalar dependencias
npm install
# Iniciar servidor de desarrollo
npm run dev
Abre http://localhost:3000 en tu navegador para ver el resultado.
🛠 Stack tecnológico
- Framework: Next.js 16.2.6 (App Router)
- Lenguaje: TypeScript 5
- Estilos: CSS Modules + Vanilla CSS (Custom Properties)
- Componentes: React 19 (Server + Client Components)
📁 Arquitectura del proyecto
landing-page/
├── src/
│ ├── app/
│ │ ├── globals.css # Design system tokens & utility classes
│ │ ├── layout.tsx # Root layout con importación de Inter font
│ │ └── page.tsx # Composición de página principal
│ │
│ └── components/
│ ├── Navbar/ # Navegación con scroll spy y menú móvil
│ ├── Hero/ # Sección principal con mockup de UI animado
│ ├── Features/ # Cuadrícula de características
│ ├── Pricing/ # Tabla de precios con toggle mensual/anual
│ ├── ContactForm/ # Formulario de lead con validación local
│ └── Footer/ # Enlaces secundarios y CTA final
🎨 Design System
El diseño sigue una estética B2B SaaS moderna:
- Colores: Blanco/Negro alto contraste con acento azul (
#0066ff). - Tipografía: Inter (sans-serif) optimizada para legibilidad.
- Micro-interacciones: Animaciones CSS nativas para entrada de elementos (
IntersectionObserver), hovers táctiles en botones y cards. - Responsive: Mobile-first approach asegurando legibilidad en cualquier dispositivo.
📝 Scripts disponibles
npm run dev: Inicia el entorno de desarrollo con Turbopack.npm run build: Construye la aplicación para producción.npm run start: Inicia el servidor de producción con la build generada.npm run lint: Ejecuta ESLint para analizar el código.
Desarrollado internamente por el equipo de ingeniería de FlowSync.