Esta serie es mi intento de acercarte conceptos clave de diseño y arquitectura de software aplicados al frontend, especialmente en contextos móviles con React Native. Está pensada desde la práctica, con ejemplos concretos y una app didáctica para seguir paso a paso.
📦 Tecnologías utilizadas
La serie está basada en el siguiente stack:
- React Native CLI (no Expo)
- TypeScript
- React Navigation
- React Native Testing Library
- Redux para manejo de estado
- Librerías auxiliares según se necesiten
Aclaración
Si bien los ejemplos estarán orientados al frontend móvil, los conceptos pueden ser trasladados a otros tipos de aplicación, ya sea web o backend.
⚛️ ¿Por qué con React Native CLI y TypeScript?
Elegí React Native CLI porque es la herramienta con la que más experiencia tengo y me siento más cómodo. Además, usaré TypeScript para aprovechar sus ventajas en tipado estático, lo que ayuda a escribir código más seguro y mantenible.
Noto que hay poco material en español sobre temas profundos de React Native combinados con TypeScript, y este es mi pequeño aporte.
🧢 La app que vamos a construir
Para mantener la serie divertida y cercana, vamos a desarrollar una app inspirada en el mundo Pokémon, pensada desde el enfoque de un entrenador.
App de Entrenador Pokémon
La app incluye:
- Lógica de captura de Pokémon
- Gestión del equipo (máximo de 6 Pokémon activos)
- Guardería para Pokémon extra
- Mochila con ítems (por ejemplo, Pokébolas)
- Tipos de Pokébolas y su uso en capturas
Esta app no es una Pokédex, sino una representación simplificada de la experiencia de un entrenador, lo que nos permite modelar entidades, casos de uso, dependencias y flujos reales sin caer en ejemplos artificiales.
🧪 Cómo seguir los ejemplos
Voy a mantener un repositorio abierto con el código de la app:
🔗 Repositorio en GitHub (próximamente)
Cada capítulo de la serie incluirá ejemplos comentados y enlaces al código correspondiente. No necesitás conocimientos previos avanzados, pero se recomienda experiencia básica con React Native y TypeScript.
🎯 Enfoque de la serie
La serie está enfocada en cómo implementar principios de diseño en el frontend y divulgar estas ideas para tenerlas como guía y referencia. No se trata de aplicarlas como un dogma ni como la única verdad, sino de comprender que estos conceptos existen y pueden aplicarse según el contexto.
Habrá veces en que la implementación se sentirá forzada o exagerada para el tamaño de la app, pero eso también es parte del ejercicio: nos sirve para ejemplificar y analizar los pros y contras de dichas implementaciones.
En particular, vamos a ver:
- Cómo aplicar principios SOLID en React Native
- Cómo estructurar una app usando Clean Architecture
- Qué significa Domain-Driven Design (DDD) en el frontend
- Patrones comunes y errores frecuentes en diseño
- Cómo testear apps desde el dominio hacia la UI
📚 Índice general de la serie
📌 Serie: Diseño de Software en el Frontend — Índice
Gracias por sumarte a esta serie 🙌
Te invito a seguirla, compartirla, y usarla como una guia o referencia para mejorar tu código y tus decisiones como desarrollador o desarrolladora.
Top comments (0)