React Native

Programa de estudio

Co-creado con
Información Básica
En este curso aprenderás React Native y usarás Expo para crear aplicaciones nativas
Android y iOS de primer nivel, optimizando tiempo al compartir código entre ambas
plataformas. Además podrás configurar las conexiones con servicios externos como
Facebook Login y Firebase. Al graduarte serás capaz de desarrollar aplicaciones de
principio a fin para ambos sistemas operativos.

Acerca del curso Días y horarios

Duración total: Turno Sábados

11 Semanas 09:30 - 16:30

Modalidad:
Presencial

+ REQUISITOS:
Es reponsabilidad y obligación del estudiante traer su propia computa-
dora. Requisitos mínimos: 4 gb de RAM. Recomendados: 8 gb de RAM.
Este curso requiere conocimientos básicos de JS, React y Git. Además
te recomendamos descargar el editor de texto Visual Studio Code
(https://code.visualstudio.com/)

Programa de estudio
Temario de clases
REACT NATIVE
1. ¿Por qué React Native?
De web a mobile. Comparativa entre aplicaciones Nativas, Híbridas y Brid-
geadas. Definición de UX y DX. Presentación React Native. Ventajas y des-
ventajas. ¿Cómo funciona? Casos de éxito. Introducción a Expo. Probando
React Native con Snack.

2. ¿Por qué Expo?

Introducción a Expo. Primera app con Expo. Estructura del proyecto. Flujo
de desarrollo (Live-reloading, Hot-reloading). Prueba de la aplicación en
emuladores y dispositivos.

3. Repaso React Native/Expo/Snack + Nueva sintaxis de JS

Repaso de qué es y por qué usar React Native. Repaso de qué es Expo y en
qué se diferencia de React Native. Repaso de Snack. Nueva sintaxis de JS:
imports, clases, arrow functions, destructuring, spread, defaults, template
strings.

4. Aprendiendo React
Definición de React. Filosofía y Arquitectura. Concepto de Componente.
Props vs State. Componentes Statefull vs Stateless.

5. Repaso React y nueva sintaxis JS + Layout y estilos con React Native.

Repaso de nueva sintaxis de JS. Repaso de los conceptos base de React.
¿Cómo manejar layout y estilos en React Native? Presentación de compo-
nentes básicos de UI: View, Text, Image. Estilos inline usando StyleSheet.
Layout con Flexbox.

Programa de estudio
6. Componentes de UI incluidos en React Native
Listado de componentes incluidos. Building blocks: repaso de View, Text e
Image
Scrollables: ¿cuál uso: ScrollView, FlatList o SectionList? Inputs: Switch,
Slider, Picker, TextInput, Touchable. Otros: Modal, MapView, WebView.

7. Repaso Flexbox, StyleSheet y componentes base + APIs de React

Native
Componentes con comportamiento espécifico para cada plataforma. Lista-
do de APIs incluidas. AppState, Dimensions, Geolocation, CameraRoll,
Linking.

8. Aplicación de componentes y APIs + Módulos Nativos propios

Módulos Nativos: ¿qué son? Módulos Nativos: ¿cómo hacer uno propio?
Aplicación de componentes y APIs. Aplicación de un módulo nativo propio.

9. Consumiendo datos de una API externa.

Definición de API y ejemplos. HTTP requests usando "fetch". Formateo de
los datos.

10. Integrando los datos en la vista

Definición de API y ejemplos. HTTP requests usando "fetch". Formateo de
los datos. Integración de datos en las vistas. Mostrar múltiples items en una
lista.

11. Repaso de consumo de datos de API + Introducción a Navegación

Patrones (Drawer, Tabs, NavBar). Diferencias entre Android y iOS. Proble-
mas comunes.

12. Agregando Navegación a nuestra app

Ejemplo práctico con Tabs. Ejemplo práctico con Drawer. SplashScreen.
Métodos de navegación: push, pop, showModal, etc.

Programa de estudio
13. Repaso Navegación + Introducción a Redux
Introducción al problema del manejo de estado. Análisis de distintos módu-
los externos que resuelvan el problema. Redux: principios y arquitectura.

14. Manejo del estado con Redux

Integración de Redux en nuestra app

15. Repaso Redux + Introducción a Firebase

Introducción a Firebase y sus servicios. Creación de una cuenta. Configura-
ción del servicio de autenticación.

16. Integración con Firebase y su servicio de autenticación

Integración del SDK de Firebase. Creación de una app en Facebook Develo-
pers. Configuración entre Facebook y Firebase. Vista de login con Facebook.

17. Repaso Firebase + Base de datos real-time con Firebase

Configuración del servicio de base de datos real-time. Integración del servi-
cio en la app. Conexión con componentes de UI para modificar/visualizar
datos.

18. Push Notifications usando Firebase

Configuración del servicio de notificaciones. Integración del servicio en la
app. Notificaciones manuales y automáticas.

19. Repaso de Base de datos real-time y Notificaciones de Firebase

Publicación de nuestra app en Expo. Canales de publicación dentro de
Expo.

20. Publicación en los Stores

Diferencias entre ambos stores. Procesos de revisión/publicación y alterna-
tivas para "evitarlos". ¿Cómo publicar en los stores? Concepto de "eject" de
Expo.

Programa de estudio
21. Repaso general
Repaso general de todos los conceptos aprendidos. Revisión de temas más
difíciles. Tips generales.

22. Pulido de nuestra app

Recursos de estilo. Animaciones. Tips de performance.

Programa de estudio
 Contacto www.facebook.com/CoderHouse
hola@coderhouse.com www.twitter.com/coderhouse
www.coderhouse.com www.instagram.com/coderhouse