CARRERA:

FRONT END REACT JS

Plan de estudios
CODERHOUSE es la nueva forma de
entender el trabajo. Estudiamos y nos
formamos porque estar en las últimas
tendencias digitales es la manera de estar
a la vanguardia en la sociedad. A través
de la formación digital podemos ser
independientes, conseguir el trabajo que
tanto nos interesa o llevar a la cima
nuestro propio emprendimiento.
Atravesamos una era donde los nuevos
rockstars son quienes saben vivir la vida y
disfrutarla. Por eso todos quieren ser Steve
Jobs o Mark Zuckerberg. Esto quiere decir
que ser un CODER es como ser un estrella.

#NERDS4EVER
 FRONT END
REACT JS
En esta carrera de Front End aprenderás a crear un sitio web, y
te sumergirás en las mejores prácticas del diseño web,
trabajando con HTML y CSS. Además, sabrás cómo programar
con Javascript y React Js, lo cual te permitirá realizar sitios más
complejos, dinámicos y escalables. Al finalizar, la carrera podrás
desarrollarte como Front End Developer.

MODALIDAD DURACIÓN
Clases online en vivo 24 semanas

Plan de estudios
Cursos de la carrera
1. Desarrollo Web
En este curso aprenderás a crear tu sitio web
partiendo del prototipo en papel. Te sumergirás en las
mejores prácticas del desarrollo web, trabajando con
HTML y CSS. Conocerás herramientas para optimizar
al máximo tu sitio web, implementando prácticas de
versionado de código con GIT, y preprocesadores
como SASS. Al finalizar, sabrás cómo aplicar Bootstrap
a tus proyectos, y comprenderás lo importante del
SEO en tus desarrollos. Subirás tu sitio a un servidor, y
aprenderás a interactuar con este servicio. También
sabrás cómo presentar un presupuesto y atender a tu
cliente final.

2. Javascript
En este curso aprenderás los fundamentos del lenguaje de
programación más usado en la actualidad, con el cual es
posible crear aplicaciones de todo tipo. Explorarás
inicialmente herramientas propias del mismo, indagando
casos prácticos de aplicación. Reconocerás la utilidad de las
librerías estudiando jQuery, y cómo aplicar técnicas de
desarrollo para apps modernas con AJAX. Al graduarte,
estarás en condiciones de crear soluciones web interactivas, y
trasladar los conocimientos del curso a cualquier framework
JavaScript.

Plan dede
Plan estudios
estudios
Cursos de la carrera
3. React Js
En este curso, que es el tercer nivel de la carrera de
programación, aprenderás a programar por componentes,
mediante Javascript, JS, ES6, y también conocerás las
ventajas de la utilización del flujos de datos.
Asimismo, aplicarás el manejo de rutas utilizando Firebase, y
comprenderás la utilización del virtual DOM mediante los
desarrollos de React JS.
Al finalizar, podrás crear tus propias aplicaciones SPA, y
estarás en condiciones de hacer cualquier desarrollo con uno
de los frameworks más populares y avanzados del momento.

Plan dede
Plan estudios
estudios
 TEMARIO

Nivel 1: Desarrollo Web

0. Nivelación (optativa) 4. CSS - Medidas, colores y fuentes
- Conceptos básicos del Desarrollo - Estilos para textos y listas.
Web. - Tipografías web y fondos.
- Herramientas a utilizar.
- Instalación del software. 5. Box Modeling
- Propiedades de la caja.
1. Prototipado y conceptos básicos - Posicionamiento y visualización.
de HTML
- Proyecto web: ¿qué es? 6. Flexbox
- Prototipado desde el papel. - ¿Qué es?
- HTML y etiquetas. - Propiedades de padres e hijos.
- Propiedades para el contenedor
2. Primeros pasos con HTML Flex, y los Flex items.
- Listas, tablas, formularios y enlaces.
7. Grids
3. Inlcuyendo CSS a nuestro proyecto - Implementación de Grids y Grids
- Multimedia con HTML: imágenes, Mobile First.
videos, audio, iframe.
- Bases del CSS y atributo Class.

Plan de estudios
 TEMARIO

8. Animaciones, transformaciones y 12. SASS II

transiciones - Operadores.
- Animaciones con CSS. - Condicionales.
- Incorporación de transformaciones - Bucles.
y transiciones a elementos. - Maps.

9. Frameworks CSS + Bootstrap 13. Servidores, seguridad y SEO para

- ¿Qué es un framework? tu sitio
- Funcionalidades de Bootstrap. - Servidores, seguridad y SEO:
conceptos básicos.
10. Bootstrap + Themes
- Bootstrap con JS. 14. Git
- Bootstrap Themes. - Comandos básicos de la terminal.
- Diseño responsive. - Creación de repositorios y ramas.

11. SASS I 15. GitHub

- Preprocesadores CSS. - Implementación de Grids y Grids
- Nesting. Mobile First.
- Import y Vars.
- BEM.

Plan de estudios
 TEMARIO

16. Subida al servidor

- Configuración del hosting y acceso
al servidor.

17. Conociendo a nuestro cliente

- Identificación del cliente y el usuario
final.
- Confección del presupuesto.

18. Proyecto final

- Repaso de los temas principales
- Revisión de los objetivos
alcanzados en el curso.
- Recomendaciones finales.
- Presentación de los avances del
proyecto.

Plan de estudios
 TEMARIO

Nivel 2: Javascript
1. Conceptos generales: sintaxis y 4. Programación avanzada con
variables funciones
- Presentación Javascript: ¿para qué - Función: ¿qué es? ¿Qué son los
se usa? parámetros de entrada y de salida?
- Variable: ¿qué es y cómo - Scope global y local.
declararla? Asignación y cambio del - Función anónima vs. flecha
valor.
5. Objetos
2. Control de flujos - Objetos: ¿qué son y cómo se usan?
- Condicional: ¿qué es? ¿Cuáles son sus propiedades y
- Operadores de comparación y métodos?
lógicos: ¿qué son y cuál es su uso en - Función constructora.
los condicionales?
6. Arrays
3. Ciclos/iteraciones - Funciones nativas de JS para operar
- Ciclos: ¿qué son? Tipos y diferencias arrays.
entre sí. - Trabajar con array de objetos.
- Operadores lógicos, ciclos y - Algoritmos.
funciones: ¿cómo combinarlos?

Plan de estudios
 TEMARIO

7. Storage y JSON 12. jQuery: selectores y eventos

- localStorage y sessionStorage. - Uso de selectores.
- JSON: alcance del formato y - Manejo de eventos en jQuery.
situaciones de uso.
13. Efectos y animaciones con jQuery
8. DOM - Animaciones de jQuery, y
- Definición, alcance y su importancia combinaciones posibles.
para operar sobre elementos HTML. - Modificación del CSS desde jQuery.

9. Eventos 14. AJAX con jQuery

- ¿Qué son, para qué sirven y cuáles - AJAX: ¿qué es y cómo se usa?
son los más comunes? - Llamadas simples mediante AJAX.
- Escuchar un evento sobre el DOM. - API: concepto.

10. Workshop I 15. Introducción a SPA con jQuery

- Repaso de temas vistos. - SPA: ¿qué es y cuáles beneficios
- Recomendaciones para el proyecto tiene sobre las páginas?
final. - MVC: concepto.
- Avance individual sobre el proyecto.
16. Workshop II
11. jQuery y selectores - Revisión de consultas acerca del
- Librería: ¿qué es? curso.
- jQuery: ¿para qué sirve? - Presentación de proyectos.
- Uso de selectores.
- Agregar elementos al DOM.

Plan de estudios
 TEMARIO

TEMARIO

Nivel 3: React JS
1. Nivelación 4. Componentes I
- Repaso: HTML, CSS y fundamentos - ¿Qué son?
JavaScript. - ¿Cuáles problemas resuelven?
- Sintaxis de JavaScript y ECMAscript 6. - ¿Cómo implementarlos?
- Variable 'this'.
- Introducción a React JS. 5. Componentes II
- Estados y ciclos de vida.
2. Instalación y configuración del - Propiedades y eventos.
entorno
- Funcionamiento del virtual DOM en 6. Promises, asincronía y MAP
React JS. - API Promise.
- Instalación y configuración de - Aplicación del método MAP para el
Node.js. rendering de listas.
- Creación de una app utilizando el
CLI. 7. Consumiendo APIs
- Paradigma de intercambio de datos.
3. JSX y transpiling - Consumo de recursos vía llamados a
- JSX. APIs.
- Expansión de la sintaxis avanzada de
JS. 8. Routing y navegación
- Rol de webpack y babel en el - Organización de la app.
bundling/retrocompatibilidad. - Configuración de la navegabilidad
entre componentes.
Plan de estudios
 TEMARIO

TEMARIO

9. Eventos 12. Firebase I

- Sistema de eventos de React JS. - Modelo de serverless-computing vs.
- Diseño de componentes orientados a tradicional.
eventos. - Conexión de la app a servicios cloud-
first de alta disponibilidad.
10. Context - Configuración de un storage, sus
- Organización de los eventos colecciones y acceso a la información.
aplicativos en cada proyecto.
- Creación de interacciones 13. Firebase II
persistentes entre componentes. - Inserción y actualización de
- Desarrollo de implementaciones información usando Firestore.
custom de context. - Flujos de control.

11. Técnicas de rendering 14. Workshop

- Profundización acerca de - Parte 1: optimización de código.
renderizado condicional y sus - Parte 2: checkout final, limpieza de
implicancias. código y configuración de readme.md.
- Diagnóstico y solución de problemas
de rendering.

Plan de estudios
CARRERA: FRONT END
REACT JS

[email protected]
www.coderhouse.com
instagram.com/coderhouse