Bootcamp de Desarrollo frontend para diseñadores

14
Bootcamp de Desarrollo frontend para diseñadores Sede en La Industrial C/ San Andrés 8, 28004 Madrid [email protected] 160h lectivas OCTUBRE 2021

Transcript of Bootcamp de Desarrollo frontend para diseñadores

Bootcamp de Desarrollofrontend para diseñadores

Sede en La IndustrialC/ San Andrés 8, 28004 [email protected]

160h lectivas

OCTUBRE2021

Mr.Marcel SchoolEs una escuela de diseño, creativa, abierta y contemporánea dirigida a profesionales de las industrias crea-tivas con paladar fino y afición por el detalle. Nuestra forma de hacer está basada en tres ejes: la calidad de contenidos y profesorado, el cui-dado de la experiencia y el firme convencimiento de que para una escuela “el futuro es hoy”.

Todo con flow y mucho de “Always with cariño”

02

03

Skills & ToolsBootcamp de Desarrollofrontend para diseñadores

¿Qué es un desarrollador frontend?

Un desarrollador frontend es el que se dedica al desarrollo de la funcionalidad de webs y apps en su parte visual. Es el responsable de trasladar un prototipo (generalmente en Sketch o Figma) a un producto funcional y real que puede ser publicado para que accedan los usuarios finales.

Cuando un diseñador tiene conocimientos de desarrollo frontend es capaz de sacar el máximo partido a su creatividad y crear productos digitales con una estructura más sólida, mejorando la relación con los desarrolladores y consiguiendo así que el producto final se ajuste al máximo al diseño original. Si además es desarrollador frontend, tiene una ventaja extra al poder entender y aplicar mejor los diseños.

Skills & ToolsBootcamp de Desarrollofrontend para diseñadores

¿Qué vas a aprender?

En este programa formativo:- Comprenderás cómo es el proceso de desarrollo de producto digital que sigue al prototipo visual.- Trabajarás los conceptos de metodología de la programación que hay detrás de cualquier lenguaje de programación.- Entenderás cómo funciona internet más allá del navegador.- Conocerás las herramientas más habituales de edición, gestión de repositorios y agile.- Adquirirás los conocimientos necesarios para maquetar una página web usando HTML y CSS y publicarla.- Conocerás JavaScript y sus frameworks más populares para web y apps: React y React Native.

¿Qué habilidades obtendrás?

Al finalizar el curso, te sorprenderás al ver que vas a ser capaz de crear un producto digital completo. Serás capaz de:

- Crear páginas web utilizando HTML y CSS avanzado.- Dotar de interactividad a una página web usando JavaScript.- Utilizar React, uno de los frameworks de JavaScript más populares y demandados, para crear webs basadas en tus propios sistemas de diseño.

- Publicar tu web utilizando AWS, como hacen las grandes empresas.- Crear tu propia app para móviles usando React Native.

¿Es para ti?

Este bootcamp está especialmente creado para diseñadores que cumplen al menos dos de estos requisitos:

- Tienen curiosidad por el mundo de la programación.- Quieren ser capaces de controlar el ciclo de desarrollo completo a la hora de crear su propio producto digital.- Quieren tener un perfil más transversal a la hora de trabajar en equipos agile enfocados en producto.

Si tienes dudas acerca de si este curso es para ti o te vas a sentir cómodo en el mundo de la programación, te animamos a escribirnos para ayudarte a resolverlas. Además, te plantearemos unos sencillos ejercicios para que tú mismo evalúes cómo te sientes.

04

Todo esto lo haremos con múltiples sesiones de seguimiento y refuerzo, paso a paso, mediante «learning by doing» que se refleja en la realización de cuatro proyectos distintos a lo largo del curso.

Requisitos

No hay ningún requisito previo para realizar el curso. Sin embargo, se parte de la premisa de que tu perfil está relacionado con el diseño y tienes interés por el mundo de la programación y dotar de funcionalidad real a tus propios diseños. Al tratarse de una formación progresiva, poco a poco irás adquiriendo todas las bases necesarias.

Fechas y horarios

El bootcamp está pensado para poder compatibilizarlo con trabajo o estudios full time y se desarrolla en horario de viernes de 16 a 21h Ty sábados de 9 a 14h (10 horas por semana) a lo largo de 16 semanas (160 horas).

¿Cómo es el curso y qué queremos conseguir?

En este curso vamos a aprender a desarrollar productos digitales completos en su parte frontend. Lo haremos teniendo en cuenta tus características especiales como diseñador, poco a poco, de manera progresiva y con sesiones altamente prácticas.

Empezaremos aprendiendo los fundamentos de lo que pasa cada vez que entramos en una página web y familiarizándonos con las herramientas que vamos a utilizar.

Crearemos nuestra propia página personal utilizando HTML y CSS. Iremos iterando sobre ella añadiendo responsive, animaciones y finalmente JavaScript, y llegaremos a publicarla en internet.

Más adelante empezaremos a usar los frameworks más populares y acabaremos creando una web en React que se integra con una API para estar siempre actualizada sin que tengamos que modificarla cada vez que haya cambios. Lo haremos, además, aprendiendo a aplicar sistemas de diseño.

Finalmente, acabaremos haciendo nuestra propia app para móviles (para iOS y Android) usando React Native.

¿Qué vas a aprender?

En este programa formativo:- Comprenderás cómo es el proceso de desarrollo de producto digital que sigue al prototipo visual.- Trabajarás los conceptos de metodología de la programación que hay detrás de cualquier lenguaje de programación.- Entenderás cómo funciona internet más allá del navegador.- Conocerás las herramientas más habituales de edición, gestión de repositorios y agile.- Adquirirás los conocimientos necesarios para maquetar una página web usando HTML y CSS y publicarla.- Conocerás JavaScript y sus frameworks más populares para web y apps: React y React Native.

¿Qué habilidades obtendrás?

Al finalizar el curso, te sorprenderás al ver que vas a ser capaz de crear un producto digital completo. Serás capaz de:

- Crear páginas web utilizando HTML y CSS avanzado.- Dotar de interactividad a una página web usando JavaScript.- Utilizar React, uno de los frameworks de JavaScript más populares y demandados, para crear webs basadas en tus propios sistemas de diseño.

- Publicar tu web utilizando AWS, como hacen las grandes empresas.- Crear tu propia app para móviles usando React Native.

¿Es para ti?

Este bootcamp está especialmente creado para diseñadores que cumplen al menos dos de estos requisitos:

- Tienen curiosidad por el mundo de la programación.- Quieren ser capaces de controlar el ciclo de desarrollo completo a la hora de crear su propio producto digital.- Quieren tener un perfil más transversal a la hora de trabajar en equipos agile enfocados en producto.

Si tienes dudas acerca de si este curso es para ti o te vas a sentir cómodo en el mundo de la programación, te animamos a escribirnos para ayudarte a resolverlas. Además, te plantearemos unos sencillos ejercicios para que tú mismo evalúes cómo te sientes.

05

Skills & ToolsBootcamp de Desarrollofrontend para diseñadores

Todo esto lo haremos con múltiples sesiones de seguimiento y refuerzo, paso a paso, mediante «learning by doing» que se refleja en la realización de cuatro proyectos distintos a lo largo del curso.

Requisitos

No hay ningún requisito previo para realizar el curso. Sin embargo, se parte de la premisa de que tu perfil está relacionado con el diseño y tienes interés por el mundo de la programación y dotar de funcionalidad real a tus propios diseños. Al tratarse de una formación progresiva, poco a poco irás adquiriendo todas las bases necesarias.

Fechas y horarios

El bootcamp está pensado para poder compatibilizarlo con trabajo o estudios full time y se desarrolla en horario de viernes de 16 a 21h Ty sábados de 9 a 14h (10 horas por semana) a lo largo de 16 semanas (160 horas).

¿Cómo es el curso y qué queremos conseguir?

En este curso vamos a aprender a desarrollar productos digitales completos en su parte frontend. Lo haremos teniendo en cuenta tus características especiales como diseñador, poco a poco, de manera progresiva y con sesiones altamente prácticas.

Empezaremos aprendiendo los fundamentos de lo que pasa cada vez que entramos en una página web y familiarizándonos con las herramientas que vamos a utilizar.

Crearemos nuestra propia página personal utilizando HTML y CSS. Iremos iterando sobre ella añadiendo responsive, animaciones y finalmente JavaScript, y llegaremos a publicarla en internet.

Más adelante empezaremos a usar los frameworks más populares y acabaremos creando una web en React que se integra con una API para estar siempre actualizada sin que tengamos que modificarla cada vez que haya cambios. Lo haremos, además, aprendiendo a aplicar sistemas de diseño.

Finalmente, acabaremos haciendo nuestra propia app para móviles (para iOS y Android) usando React Native.

Skills & ToolsBootcamp de Desarrollofrontend para diseñadores

06

¿Qué diferencia hay entre esta formación y otras?

A diferencia de otros cursos que «prometen» convertir a cualquier persona de cualquier edad y sector en un profesional que será contratado por una multinacional incluso antes de terminar la formación, en este programa queremos aplicar tres premisas fundamentales:

Orientación. El curso está hecho para diseñadores, teniendo en cuenta los aspectos más relevantes para un diseñador que trabaja con determinadas herramientas como por ejemplo Figma o Sketch.

Especialización. Dado que nos orientamos a diseñadores, y porque ninguna metodología te va a enseñar todo en tan poco tiempo, no pretendemos convertirte en un programador full stack. Entre otras cosas porque, como diseñador, posiblemente no te interese. Queremos enseñarte exclusivamente el aspecto de la programación que entronca más con tu perfil de diseñador.

Bases sólidas. Digan lo que digan, ningún bootcamp te lo va a enseñar todo. Por eso, nos vamos a enfocar en enseñarte lo que necesitas saber para empezar a trabajar y crear tus primeros proyectos... pero vamos a hacerlo bien. Si conseguimos transmitirte unas bases sólidas, que te proporcionen confianza y sobre todo que permitan que realmente sepas lo que estás haciendo, y además te enseñamos a seguir aprendiendo por tu cuenta, los límites los vas a poner tú.

Sobre la metodología y los proyectos

El curso tiene un enfoque fuertemente práctico, siguiendo el método «learning by doing», siguiendo una progresividad pero basada en el esfuerzo.

Es progresivo porque empezarás desde lo más básico y semana a semana irás iterando sobre lo que has aprendido. Casi sin darte cuenta, adquirirás skills de programación cada vez más potente y cuando mires atrás te sorprenderás con el resultado.

Está basado en el esfuerzo porque no te limitarás a seguir unas clases: cada semana tendrás que practicar y dedicar entre cinco y diez horas extra para trabajar en casa. Requiere esfuerzo y dedicación por tu parte, pero será un boost considerable en tu perfil profesional. No te asustes: estarás acompañado en todo momento y el curso está pensado para compatibilizarse con un trabajo o estudios full time.

A lo largo del curso realizarás cuatro proyectos que te servirán como portfolio. Para ayudarte en esto, en el programa hay varias sesiones Walking together en los que se busca compartir el trabajo realizado en cada uno de los proyectos, obtener feedback y asegurarse de que todo el equipo está listo para dar el paso al siguiente nivel.

Skills & ToolsBootcamp de Desarrollofrontend para diseñadores

07

Online directo

Este curso se impartirá en modalidad "online directo" con un máximo de 12 alumnos.

Aunque puede que estemos a miles de kilómetros de distancia, hemos trabajado duro para que tengas una intensa experiencia formativa. Será un curso presencial a través de la cámara. Solo necesitarás seguir nuestras indicaciones, ganas de crecer, espíritu de trabajo, un poco de disciplina y, por supuesto, una buena conexión.

Contarás con un contacto directo con los docentes y podrás solventar cualquier duda que te surja a través de nuestro grupo de Telegram. Crearás conexiones y trabajarás en equipo a través de Whereby y Zoom. Y tendrás el contenido de las clases y muchos extras en Notion. Además, la escuela estará contigo en todo momento para apoyarte con cualquier cosa que necesites.

Skills & ToolsBootcamp de Desarrollofrontend para diseñadores

08

Dirección del curso

Diego Manuel BéjarDesarrollador desde los años 80, desarrollador online desde mediados de los 90 y uno de esos que hicieron exit con su startup en el boom de las puntocom del 2000. Después de dos décadas emprendiendo tanto en el mundo digital como el terrenal, actualmente trabaja de Tech Lead en el estudio Secuoyas y mantiene la app Hoy Madrid como side project.@diegomanuelbejar

Los docentes

Miguel Eduardo GonzálezDiseñador UX/UI con varios años de experiencia en diseño industrial y visual. Colabora con distintos proyectos y equipos en la definición, conceptualización y desarrollo de productos digitales.@migueleduardogonzalez

María SimóDesarrolladora frontend en Secuoyas con background en diseño gráfico y branding. Estudió Bellas Artes, tuvo su propio estudio de diseño durante cinco años y, empujada por la curiosidad y el deseo de ir un poco más lejos, acabo por estudiar programación. Interesada en reducir las distancias entre tecnología, creatividad y lenguaje.@mariasimo

Iván Ruiz RosellóCo-Founder y CTO en Streamion.io, startup tecnológica ganadora el premio a la mejor startup de Valencia 2020. Ha trabajado en la

creación de videojuegos con Unity, como desarrollador/consultor para aplicaciones web full stack y formador en diversos bootcamps en GeeksHubs. Cuenta con formación especializada en Blockchain y AWS.@ivanruizrosesello

Pere JuárezProfesor de Gestión Ágil de Proyectos y de Creatividad e Innovación en la Universidad de Barcelona. Profesor de Innovación y Transformación Digital en IESE Business School y de Design Thinking en MIT y Asesor en Innovación acreditado por la Unión Europea, desarrollando su actividad en Europa, Middle East y Latinoamérica. Durante 25 años trabajó como Project Manager y Facilitador de Equipos de Alto Rendimiento para la Innovación en Philips Electronics, experiencias que traslada a mi actividad docente.@perejuarez

Daniel HervásIngeniero de software de profesión y vocación, comenzó a trabajar en una startup estadounidense a los 18 años. Tras haber desarrollado tanto aplicaciones para móviles como el stack completo de varios servicios en la nube, ahora trabaja en el equipo internacional de RepTrak como Senior Software Engineer@danielhervas

Anggella FortunatoDesarrolladora de software en Codeko especializada en el desarrollo de aplicaciones móviles. Lleva 3 años utilizando Expo y React Native de forma profesional.@anggellafortunato

Sábado 22/01 de 9 a 14hClase 24. Working Together: ReactPor Diego Manuel BéjarTutoría para repasar todos los conceptos y la manera en la que los alumnos han aplicado todo lo aprendido hasta ahora. En esta sesión cada alumno presentará su web en React y obtendrá feedback tanto del profesor como de sus compañeros. Es importante saber que, si bien se pueden presentar dudas en cualquier momento del curso, las sesiones Working Together están especialmente diseñadas para dar respuestas.Clase 100% práctica

SEMANA 13Viernes 28/01 de 16 a 21hClase 25. Next.js IPor Daniel Hervás Utilizando lo que hemos aprendido de React, seremos capaces de crear una página estática utilizando Next.js y React como framework. De esta manera seremos capaces de crear una página web estática que podemos publicar en cualquier sitio pero con todas las ventajas que nos da React.Clase 30% teoría, 70% práctica

Sábado 29/01 de 9 a 14hClase 26. Next.js IIPor Daniel Hervás Clase 30% teoría, 70% práctica

SEMANA 14Viernes 04/02 de 16 a 21hClase 27. Workshop: Sistemas de diseño en ReactPor María SimóVamos a profundizar en los sistemas de diseño y cómo los podemos aplicar a nuestros proyectos en React, poniendo en práctica todo lo que hemos aprendido hasta ahora.Clase 100% práctica

Sábado 05/02 de 9 a 14hClase 28. Working Together: Next.jsPor Diego Manuel Béjar. Tutoría para repasar todos los conceptos y la manera en la que los alumnos han aplicado todo lo aprendido hasta ahora. En esta sesión cada alumno presentará su web en Next.js, mostrando su código, y obtendrá feedback tanto del profesor como de sus compañeros. Es importante saber que, si bien se pueden presentar dudas en cualquier momento del curso, las sesiones Working

Together están especialmente diseñadas para dar respuestas.Clase 100% práctica

Bloque 4. React Native

SEMANA 15Viernes 11/02 de 16 a 21hClase 29. Expo IPor Anggella FortunatoVamos a crear una app para móviles, para iOS y Android, completamente real y lista para su publicación en Stores, utilizando todo lo aprendido de React, usando React Native con Expo. ¡Y vas a ser capaz de aprender a hacerlo en un solo fin de semana!Clase 20% teoría. 80% práctica

Sábado 12/02 de 9 a 14hClase 30. Expo IIPor Anggella FortunatoClase 20% teoría. 80% práctica

SEMANA 16Viernes 18/02 de 16 a 21hClase 31. Working Together: ExpoPor Diego Manuel BéjarTutoría para repasar todos los conceptos y la manera en la que los alumnos han aplicado todo lo

SEMANA 9Viernes 17/12 de 16 a 21hClase 17. Working Together: JavaScriptPor Diego Manuel Béjar Tutoría para repasar todos los conceptos y la manera en la que los alumnos han aplicado todo lo aprendido hasta ahora. En esta sesión cada alumno presentará su web desarrollada durante las sesiones anteriores, mostrando su código, y obtendrá feedback tanto del profesor como de sus compañeros. Es importante saber que, si bien se pueden presentar dudas en cualquier momento del curso, las sesiones Working Together están especialmente diseñadas para dar respuestas.Clase 100% práctica

Sábado 18/12 de 9 a 14hClase 18. Workshop: Agile con SCRUMPor Pere JuárezEn este workshop sobre SCRUM, trabajaremos con un caso real aplicando la metodología PBL Project Based Learning junto con Agile Sprint Method (enfoque IBM) para profundizar y aplicar sus conceptos básicos, en un espacio simulado de aprendizaje. Para ello

trabajaremos en equipos virtuales haciendo uso de Miro y Landscape Monitor.Clase 20% teoría, 80% práctica

Vacaciones de Navidad

Bloque 3. React

SEMANA 10Viernes 07/01 de 16 a 21hClase 19. React Por Daniel HervásInstalaremos el framework de React. Seremos capaces de crear una pequeña SPA utilizando React. Vamos a enfocarnos en entender claramente el tema de los componentes, la reutilización de estos, el JSX (que te sonará muy parecido a HTML).Clase 30% teoría, 70% práctica

Sábado 08/01 de 9 a 14hClase 20. React IPor Daniel HervásClase 30% teoría, 70% práctica

SEMANA 11Viernes 14/01 de 16 a 21hClase 21. React IIPor Daniel HervásA la web hecha la semana anterior le vamos a añadir funcionalidad gracias a los hooks. ¿Te acuerdas de lo que habíamos aprendido de las API? Aquí también las aplicaremos. También conoceremos cómo funciona NPM.Clase 20% teoría, 80% práctica

Sábado 15/01 de 9 a 14hClase 22. React II.Por Daniel HervásClase 20% teoría, 80% práctica

SEMANA 12Viernes 21/01 de 16 a 21hClase 23. Workshop: SassPor María SimóVamos a incluir Sass a nuestro proyecto. Es una extensión de CSS que nos permite hacer el trabajo más intuitivo y rápido. Trabajaremos también con las variables y los includes de Sass para crear un sistema de diseño básico.Clase 10% teoría, 90% práctica

Sábado 13/11 de 9 a 14hClase 8. Working Together: HTML y CSSPor Diego Manuel BéjarTutoría para repasar todos los conceptos y la manera en la que los alumnos han aplicado todo lo aprendido hasta ahora. En esta sesión cada alumno presentará su web, mostrando su código, y obtendrá feedback tanto del profesor como de sus compañeros. Es importante saber que, si bien se pueden presentar dudas en cualquier momento del curso, las sesiones Working Together están especialmente diseñadas para dar respuestas.Clase 100% práctica

Bloque 2. JavaScript

SEMANA 5 Viernes 19/11 de 16 a 21hClase 9. Metodología de la programación IPor Diego Manuel BéjarVamos a entender los conceptos de variable, condicional, bucle, función y eventos. Crearemos nuestro primer juego con Scratch, muy básico, usando un entorno visual para familiarizarnos con todos estos conceptos.Clase 30% teoría, 70% práctica

Sábado 20/11 de 9 a 14hClase 10. Metodología de la programación IIPor Diego Manuel BéjarClase 30% teoría, 70% práctica

SEMANA 6 Viernes 26/11 de 16 a 21hClase 11. Vanilla JavaScript: Fundamentos IPor Iván Ruiz RosellóCrearemos nuestras primeras funciones. Dibujaremos cosas básicas en pantalla, calcularemos si un número es primo, utilizaremos objetos…Clase 30% teoría, 70% práctica

Sábado 27/11 de 9 a 14hClase 12. Vanilla JavaScript: Fundamentos IIPor Iván Ruiz RosellóClase 30% teoría, 70% práctica

SEMANA 7Viernes 03/12 de 16 a 21hClase 13. Vanilla JavaScript: DOM IIPor Iván Ruiz RosellóAprenderemos a manipular el DOM, es decir, a manipular lo que se presenta en una página web. Seremos capaces de nterceptar,

por ejemplo, un click en un área para cambiar las clases y estilos de otros elementos de la página.Clase 10% teoría, 90% práctica

Sábado 04/12 de 9 a 14hClase 14. Vanilla JavaScript: DOM IIPor Iván Ruiz RosellóClase 10% teoría, 90% práctica

SEMANA 8Viernes 10/12 de 9 a 14hClase 15. Vanilla JavaScript: Conexión con datos externos IPor Iván Ruiz RosellóAprenderemos a manipular el DOM, es decir, a manipular lo que se presenta en una página web. Seremos capaces de interceptar por ejemplo un click en un área para cambiar las clases y estilos de otros elementos de la página.Clases 10% teoría, 90% práctica

Sábado 11/12 de 9 a 14hClase 16. Vanilla JavaScript: Conexión con datos externos IIPor Iván Ruiz RosellóClases 10% teoría, 90% práctica

Skills & Tools

09

Bloque 1. HTML y CSS

SEMANA 1 Viernes 22/10 de 16 a 21hClase 1. Abriendo la mentePor Diego Manuel BéjarConoceremos los objetivos del bootcamp y la ruta que vamos a seguir. Conoceremos conceptos básicos de internet detrás de las pantallas: qué es un dominio, cómo se resuelve, qué es un servidor, qué es la nube, qué es un hosting, la diferencia entre página estática y dinámica, y por qué una página estática puede ser interactiva...Clase 100% teórica

Sábado 23/10 de 9 a 14hClase 2. Herramientas: VSCode + GitPor Diego Manuel BéjarConoceremos las herramientas básicas (el editor VSCode y el control de versiones de Git) que son imprescindibles para trabajar en frontend. Tendremos un primer contacto con los emmet, así como los fundamentos de Git (incluyendo .gitignore y un gitflow básico para entender la diferencia entre entorno de desarrollo, producción y master). Esto es muy importante porque son las herramientas con

las que vamos a trabajar durante todo el curso.Clase 50% teórica, 50% práctica

SEMANA 2 Viernes 29/10 de 16 a 21hClase 3. HTML + CSS IPor Miguel Eduardo GonzálezVamos a crear nuestra propia página personal utilizando HTML y CSS. Conoceremos todo lo que hay que saber sobre HTML y los aspectos básicos de CSS.Clase 30% teoría, 70% práctica

Sábado 30/10 de 9 a 14hClase 4. HTML + CSS IIPor Miguel Eduardo GonzálezClase 30% teoría, 70% práctica

SEMANA 3 Viernes 05/11 de 16 a 21hClase 5. CSS Avanzado IPor María SimóVamos a hacer una iteración sobre nuestra página personal. La mejoraremos con técnicas de CSS avanzado como animaciones, filtros, flex, grid y selectores. Haremos una versión básica de sistema de diseño usando

variables, y jugaremos con responsive a través de Media queries. Y aplicaremos todo esto a nuestra web personal.Clase 30% teoría, 70% práctica

Sábado 06/11 de 9 a 14hClase 6. CSS Avanzado IIPor María SimóClase 30% teoría, 70% práctica

SEMANA 4 Viernes 12/11 de 16 a 21hClase 7. Workshop: Publicar una webPor Diego Manuel BéjarEn este workshop vamos a publicar nuestra web personal en Amazon Web Services (mediante S3). Crearemos una cuenta en AWS, obtendremos una key, instalaremos el CLI, crearemos un script para publicar cada cambio facilmente, actualizaremos el git y finalmente la veremos publicada. Se guiará además a quien quiera tener su propio dominio.Clase 10% teoría, 90% práctica

Bootcamp de Desarrollofrontend para diseñadoresOctubre / febrero 2022

Bootcam de Desarrollofrontend para diseñadores

Dirección del curso:Diego Manuel Béjar

Docentes:Diego Manuel BéjarMiguel Eduardo GonzálezMaría SimóIván Ruiz RosellóPere JuárezDaniel HervásAnggella Fortunato

Horarios clases:Viernes de 16 a 21hSábados de 9 a 14h

aprendido hasta ahora. En esta sesión cada alumno presentará su app para móviles, mostrando su código, y obtendrá feedback tanto del profesor como de sus compañeros. Es importante saber que, si bien se pueden presentar dudas en cualquier momento del curso, las sesiones Working Together están especialmente diseñadas para dar respuestas.Clase 100% práctica

Sábado 19/02 de 9 a 14hClase 32. Despedida y cierrePor Diego Manuel BéjarHaremos una sesión de repaso de todo lo aprendido. También recibiremos una breve visita de cada uno de los profesores, que nos recordará lo que ahora somos capaces de hacer, qué nos queda por aprender y por dónde podemos profundizar.Clase 100% teoría

Fin del curso. ¡Cañas virtuales!

Sábado 22/01 de 9 a 14hClase 24. Working Together: ReactPor Diego Manuel BéjarTutoría para repasar todos los conceptos y la manera en la que los alumnos han aplicado todo lo aprendido hasta ahora. En esta sesión cada alumno presentará su web en React y obtendrá feedback tanto del profesor como de sus compañeros. Es importante saber que, si bien se pueden presentar dudas en cualquier momento del curso, las sesiones Working Together están especialmente diseñadas para dar respuestas.Clase 100% práctica

SEMANA 13Viernes 28/01 de 16 a 21hClase 25. Next.js IPor Daniel Hervás Utilizando lo que hemos aprendido de React, seremos capaces de crear una página estática utilizando Next.js y React como framework. De esta manera seremos capaces de crear una página web estática que podemos publicar en cualquier sitio pero con todas las ventajas que nos da React.Clase 30% teoría, 70% práctica

Sábado 29/01 de 9 a 14hClase 26. Next.js IIPor Daniel Hervás Clase 30% teoría, 70% práctica

SEMANA 14Viernes 04/02 de 16 a 21hClase 27. Workshop: Sistemas de diseño en ReactPor María SimóVamos a profundizar en los sistemas de diseño y cómo los podemos aplicar a nuestros proyectos en React, poniendo en práctica todo lo que hemos aprendido hasta ahora.Clase 100% práctica

Sábado 05/02 de 9 a 14hClase 28. Working Together: Next.jsPor Diego Manuel Béjar. Tutoría para repasar todos los conceptos y la manera en la que los alumnos han aplicado todo lo aprendido hasta ahora. En esta sesión cada alumno presentará su web en Next.js, mostrando su código, y obtendrá feedback tanto del profesor como de sus compañeros. Es importante saber que, si bien se pueden presentar dudas en cualquier momento del curso, las sesiones Working

Together están especialmente diseñadas para dar respuestas.Clase 100% práctica

Bloque 4. React Native

SEMANA 15Viernes 11/02 de 16 a 21hClase 29. Expo IPor Anggella FortunatoVamos a crear una app para móviles, para iOS y Android, completamente real y lista para su publicación en Stores, utilizando todo lo aprendido de React, usando React Native con Expo. ¡Y vas a ser capaz de aprender a hacerlo en un solo fin de semana!Clase 20% teoría. 80% práctica

Sábado 12/02 de 9 a 14hClase 30. Expo IIPor Anggella FortunatoClase 20% teoría. 80% práctica

SEMANA 16Viernes 18/02 de 16 a 21hClase 31. Working Together: ExpoPor Diego Manuel BéjarTutoría para repasar todos los conceptos y la manera en la que los alumnos han aplicado todo lo

SEMANA 9Viernes 17/12 de 16 a 21hClase 17. Working Together: JavaScriptPor Diego Manuel Béjar Tutoría para repasar todos los conceptos y la manera en la que los alumnos han aplicado todo lo aprendido hasta ahora. En esta sesión cada alumno presentará su web desarrollada durante las sesiones anteriores, mostrando su código, y obtendrá feedback tanto del profesor como de sus compañeros. Es importante saber que, si bien se pueden presentar dudas en cualquier momento del curso, las sesiones Working Together están especialmente diseñadas para dar respuestas.Clase 100% práctica

Sábado 18/12 de 9 a 14hClase 18. Workshop: Agile con SCRUMPor Pere JuárezEn este workshop sobre SCRUM, trabajaremos con un caso real aplicando la metodología PBL Project Based Learning junto con Agile Sprint Method (enfoque IBM) para profundizar y aplicar sus conceptos básicos, en un espacio simulado de aprendizaje. Para ello

trabajaremos en equipos virtuales haciendo uso de Miro y Landscape Monitor.Clase 20% teoría, 80% práctica

Vacaciones de Navidad

Bloque 3. React

SEMANA 10Viernes 07/01 de 16 a 21hClase 19. React Por Daniel HervásInstalaremos el framework de React. Seremos capaces de crear una pequeña SPA utilizando React. Vamos a enfocarnos en entender claramente el tema de los componentes, la reutilización de estos, el JSX (que te sonará muy parecido a HTML).Clase 30% teoría, 70% práctica

Sábado 08/01 de 9 a 14hClase 20. React IPor Daniel HervásClase 30% teoría, 70% práctica

SEMANA 11Viernes 14/01 de 16 a 21hClase 21. React IIPor Daniel HervásA la web hecha la semana anterior le vamos a añadir funcionalidad gracias a los hooks. ¿Te acuerdas de lo que habíamos aprendido de las API? Aquí también las aplicaremos. También conoceremos cómo funciona NPM.Clase 20% teoría, 80% práctica

Sábado 15/01 de 9 a 14hClase 22. React II.Por Daniel HervásClase 20% teoría, 80% práctica

SEMANA 12Viernes 21/01 de 16 a 21hClase 23. Workshop: SassPor María SimóVamos a incluir Sass a nuestro proyecto. Es una extensión de CSS que nos permite hacer el trabajo más intuitivo y rápido. Trabajaremos también con las variables y los includes de Sass para crear un sistema de diseño básico.Clase 10% teoría, 90% práctica

Skills & Tools

10

Sábado 13/11 de 9 a 14hClase 8. Working Together: HTML y CSSPor Diego Manuel BéjarTutoría para repasar todos los conceptos y la manera en la que los alumnos han aplicado todo lo aprendido hasta ahora. En esta sesión cada alumno presentará su web, mostrando su código, y obtendrá feedback tanto del profesor como de sus compañeros. Es importante saber que, si bien se pueden presentar dudas en cualquier momento del curso, las sesiones Working Together están especialmente diseñadas para dar respuestas.Clase 100% práctica

Bloque 2. JavaScript

SEMANA 5 Viernes 19/11 de 16 a 21hClase 9. Metodología de la programación IPor Diego Manuel BéjarVamos a entender los conceptos de variable, condicional, bucle, función y eventos. Crearemos nuestro primer juego con Scratch, muy básico, usando un entorno visual para familiarizarnos con todos estos conceptos.Clase 30% teoría, 70% práctica

Sábado 20/11 de 9 a 14hClase 10. Metodología de la programación IIPor Diego Manuel BéjarClase 30% teoría, 70% práctica

SEMANA 6 Viernes 26/11 de 16 a 21hClase 11. Vanilla JavaScript: Fundamentos IPor Iván Ruiz RosellóCrearemos nuestras primeras funciones. Dibujaremos cosas básicas en pantalla, calcularemos si un número es primo, utilizaremos objetos…Clase 30% teoría, 70% práctica

Sábado 27/11 de 9 a 14hClase 12. Vanilla JavaScript: Fundamentos IIPor Iván Ruiz RosellóClase 30% teoría, 70% práctica

SEMANA 7Viernes 03/12 de 16 a 21hClase 13. Vanilla JavaScript: DOM IIPor Iván Ruiz RosellóAprenderemos a manipular el DOM, es decir, a manipular lo que se presenta en una página web. Seremos capaces de nterceptar,

por ejemplo, un click en un área para cambiar las clases y estilos de otros elementos de la página.Clase 10% teoría, 90% práctica

Sábado 04/12 de 9 a 14hClase 14. Vanilla JavaScript: DOM IIPor Iván Ruiz RosellóClase 10% teoría, 90% práctica

SEMANA 8Viernes 10/12 de 9 a 14hClase 15. Vanilla JavaScript: Conexión con datos externos IPor Iván Ruiz RosellóAprenderemos a manipular el DOM, es decir, a manipular lo que se presenta en una página web. Seremos capaces de interceptar por ejemplo un click en un área para cambiar las clases y estilos de otros elementos de la página.Clases 10% teoría, 90% práctica

Sábado 11/12 de 9 a 14hClase 16. Vanilla JavaScript: Conexión con datos externos IIPor Iván Ruiz RosellóClases 10% teoría, 90% práctica

Bootcamp de Desarrollofrontend para diseñadoresOctubre / febrero 2022

Bootcam de Desarrollofrontend para diseñadores

Dirección del curso:Diego Manuel Béjar

Docentes:Diego Manuel BéjarMiguel Eduardo GonzálezMaría SimóIván Ruiz RosellóPere JuárezDaniel HervásAnggella Fortunato

Horarios clases:Viernes de 16 a 21hSábados de 9 a 14h

Bloque 1. HTML y CSS

SEMANA 1 Viernes 22/10 de 16 a 21hClase 1. Abriendo la mentePor Diego Manuel BéjarConoceremos los objetivos del bootcamp y la ruta que vamos a seguir. Conoceremos conceptos básicos de internet detrás de las pantallas: qué es un dominio, cómo se resuelve, qué es un servidor, qué es la nube, qué es un hosting, la diferencia entre página estática y dinámica, y por qué una página estática puede ser interactiva...Clase 100% teórica

Sábado 23/10 de 9 a 14hClase 2. Herramientas: VSCode + GitPor Diego Manuel BéjarConoceremos las herramientas básicas (el editor VSCode y el control de versiones de Git) que son imprescindibles para trabajar en frontend. Tendremos un primer contacto con los emmet, así como los fundamentos de Git (incluyendo .gitignore y un gitflow básico para entender la diferencia entre entorno de desarrollo, producción y master). Esto es muy importante porque son las herramientas con

las que vamos a trabajar durante todo el curso.Clase 50% teórica, 50% práctica

SEMANA 2 Viernes 29/10 de 16 a 21hClase 3. HTML + CSS IPor Miguel Eduardo GonzálezVamos a crear nuestra propia página personal utilizando HTML y CSS. Conoceremos todo lo que hay que saber sobre HTML y los aspectos básicos de CSS.Clase 30% teoría, 70% práctica

Sábado 30/10 de 9 a 14hClase 4. HTML + CSS IIPor Miguel Eduardo GonzálezClase 30% teoría, 70% práctica

SEMANA 3 Viernes 05/11 de 16 a 21hClase 5. CSS Avanzado IPor María SimóVamos a hacer una iteración sobre nuestra página personal. La mejoraremos con técnicas de CSS avanzado como animaciones, filtros, flex, grid y selectores. Haremos una versión básica de sistema de diseño usando

variables, y jugaremos con responsive a través de Media queries. Y aplicaremos todo esto a nuestra web personal.Clase 30% teoría, 70% práctica

Sábado 06/11 de 9 a 14hClase 6. CSS Avanzado IIPor María SimóClase 30% teoría, 70% práctica

SEMANA 4 Viernes 12/11 de 16 a 21hClase 7. Workshop: Publicar una webPor Diego Manuel BéjarEn este workshop vamos a publicar nuestra web personal en Amazon Web Services (mediante S3). Crearemos una cuenta en AWS, obtendremos una key, instalaremos el CLI, crearemos un script para publicar cada cambio facilmente, actualizaremos el git y finalmente la veremos publicada. Se guiará además a quien quiera tener su propio dominio.Clase 10% teoría, 90% práctica

aprendido hasta ahora. En esta sesión cada alumno presentará su app para móviles, mostrando su código, y obtendrá feedback tanto del profesor como de sus compañeros. Es importante saber que, si bien se pueden presentar dudas en cualquier momento del curso, las sesiones Working Together están especialmente diseñadas para dar respuestas.Clase 100% práctica

Sábado 19/02 de 9 a 14hClase 32. Despedida y cierrePor Diego Manuel BéjarHaremos una sesión de repaso de todo lo aprendido. También recibiremos una breve visita de cada uno de los profesores, que nos recordará lo que ahora somos capaces de hacer, qué nos queda por aprender y por dónde podemos profundizar.Clase 100% teoría

Fin del curso. ¡Cañas virtuales!

Sábado 22/01 de 9 a 14hClase 24. Working Together: ReactPor Diego Manuel BéjarTutoría para repasar todos los conceptos y la manera en la que los alumnos han aplicado todo lo aprendido hasta ahora. En esta sesión cada alumno presentará su web en React y obtendrá feedback tanto del profesor como de sus compañeros. Es importante saber que, si bien se pueden presentar dudas en cualquier momento del curso, las sesiones Working Together están especialmente diseñadas para dar respuestas.Clase 100% práctica

SEMANA 13Viernes 28/01 de 16 a 21hClase 25. Next.js IPor Daniel Hervás Utilizando lo que hemos aprendido de React, seremos capaces de crear una página estática utilizando Next.js y React como framework. De esta manera seremos capaces de crear una página web estática que podemos publicar en cualquier sitio pero con todas las ventajas que nos da React.Clase 30% teoría, 70% práctica

Sábado 29/01 de 9 a 14hClase 26. Next.js IIPor Daniel Hervás Clase 30% teoría, 70% práctica

SEMANA 14Viernes 04/02 de 16 a 21hClase 27. Workshop: Sistemas de diseño en ReactPor María SimóVamos a profundizar en los sistemas de diseño y cómo los podemos aplicar a nuestros proyectos en React, poniendo en práctica todo lo que hemos aprendido hasta ahora.Clase 100% práctica

Sábado 05/02 de 9 a 14hClase 28. Working Together: Next.jsPor Diego Manuel Béjar. Tutoría para repasar todos los conceptos y la manera en la que los alumnos han aplicado todo lo aprendido hasta ahora. En esta sesión cada alumno presentará su web en Next.js, mostrando su código, y obtendrá feedback tanto del profesor como de sus compañeros. Es importante saber que, si bien se pueden presentar dudas en cualquier momento del curso, las sesiones Working

Together están especialmente diseñadas para dar respuestas.Clase 100% práctica

Bloque 4. React Native

SEMANA 15Viernes 11/02 de 16 a 21hClase 29. Expo IPor Anggella FortunatoVamos a crear una app para móviles, para iOS y Android, completamente real y lista para su publicación en Stores, utilizando todo lo aprendido de React, usando React Native con Expo. ¡Y vas a ser capaz de aprender a hacerlo en un solo fin de semana!Clase 20% teoría. 80% práctica

Sábado 12/02 de 9 a 14hClase 30. Expo IIPor Anggella FortunatoClase 20% teoría. 80% práctica

SEMANA 16Viernes 18/02 de 16 a 21hClase 31. Working Together: ExpoPor Diego Manuel BéjarTutoría para repasar todos los conceptos y la manera en la que los alumnos han aplicado todo lo

Skills & Tools

11

SEMANA 9Viernes 17/12 de 16 a 21hClase 17. Working Together: JavaScriptPor Diego Manuel Béjar Tutoría para repasar todos los conceptos y la manera en la que los alumnos han aplicado todo lo aprendido hasta ahora. En esta sesión cada alumno presentará su web desarrollada durante las sesiones anteriores, mostrando su código, y obtendrá feedback tanto del profesor como de sus compañeros. Es importante saber que, si bien se pueden presentar dudas en cualquier momento del curso, las sesiones Working Together están especialmente diseñadas para dar respuestas.Clase 100% práctica

Sábado 18/12 de 9 a 14hClase 18. Workshop: Agile con SCRUMPor Pere JuárezEn este workshop sobre SCRUM, trabajaremos con un caso real aplicando la metodología PBL Project Based Learning junto con Agile Sprint Method (enfoque IBM) para profundizar y aplicar sus conceptos básicos, en un espacio simulado de aprendizaje. Para ello

trabajaremos en equipos virtuales haciendo uso de Miro y Landscape Monitor.Clase 20% teoría, 80% práctica

Vacaciones de Navidad

Bloque 3. React

SEMANA 10Viernes 07/01 de 16 a 21hClase 19. React Por Daniel HervásInstalaremos el framework de React. Seremos capaces de crear una pequeña SPA utilizando React. Vamos a enfocarnos en entender claramente el tema de los componentes, la reutilización de estos, el JSX (que te sonará muy parecido a HTML).Clase 30% teoría, 70% práctica

Sábado 08/01 de 9 a 14hClase 20. React IPor Daniel HervásClase 30% teoría, 70% práctica

SEMANA 11Viernes 14/01 de 16 a 21hClase 21. React IIPor Daniel HervásA la web hecha la semana anterior le vamos a añadir funcionalidad gracias a los hooks. ¿Te acuerdas de lo que habíamos aprendido de las API? Aquí también las aplicaremos. También conoceremos cómo funciona NPM.Clase 20% teoría, 80% práctica

Sábado 15/01 de 9 a 14hClase 22. React II.Por Daniel HervásClase 20% teoría, 80% práctica

SEMANA 12Viernes 21/01 de 16 a 21hClase 23. Workshop: SassPor María SimóVamos a incluir Sass a nuestro proyecto. Es una extensión de CSS que nos permite hacer el trabajo más intuitivo y rápido. Trabajaremos también con las variables y los includes de Sass para crear un sistema de diseño básico.Clase 10% teoría, 90% práctica

Bootcamp de Desarrollofrontend para diseñadoresOctubre / febrero 2022

Bootcam de Desarrollofrontend para diseñadores

Dirección del curso:Diego Manuel Béjar

Docentes:Diego Manuel BéjarMiguel Eduardo GonzálezMaría SimóIván Ruiz RosellóPere JuárezDaniel HervásAnggella Fortunato

Horarios clases:Viernes de 16 a 21hSábados de 9 a 14h

Sábado 13/11 de 9 a 14hClase 8. Working Together: HTML y CSSPor Diego Manuel BéjarTutoría para repasar todos los conceptos y la manera en la que los alumnos han aplicado todo lo aprendido hasta ahora. En esta sesión cada alumno presentará su web, mostrando su código, y obtendrá feedback tanto del profesor como de sus compañeros. Es importante saber que, si bien se pueden presentar dudas en cualquier momento del curso, las sesiones Working Together están especialmente diseñadas para dar respuestas.Clase 100% práctica

Bloque 2. JavaScript

SEMANA 5 Viernes 19/11 de 16 a 21hClase 9. Metodología de la programación IPor Diego Manuel BéjarVamos a entender los conceptos de variable, condicional, bucle, función y eventos. Crearemos nuestro primer juego con Scratch, muy básico, usando un entorno visual para familiarizarnos con todos estos conceptos.Clase 30% teoría, 70% práctica

Sábado 20/11 de 9 a 14hClase 10. Metodología de la programación IIPor Diego Manuel BéjarClase 30% teoría, 70% práctica

SEMANA 6 Viernes 26/11 de 16 a 21hClase 11. Vanilla JavaScript: Fundamentos IPor Iván Ruiz RosellóCrearemos nuestras primeras funciones. Dibujaremos cosas básicas en pantalla, calcularemos si un número es primo, utilizaremos objetos…Clase 30% teoría, 70% práctica

Sábado 27/11 de 9 a 14hClase 12. Vanilla JavaScript: Fundamentos IIPor Iván Ruiz RosellóClase 30% teoría, 70% práctica

SEMANA 7Viernes 03/12 de 16 a 21hClase 13. Vanilla JavaScript: DOM IIPor Iván Ruiz RosellóAprenderemos a manipular el DOM, es decir, a manipular lo que se presenta en una página web. Seremos capaces de nterceptar,

por ejemplo, un click en un área para cambiar las clases y estilos de otros elementos de la página.Clase 10% teoría, 90% práctica

Sábado 04/12 de 9 a 14hClase 14. Vanilla JavaScript: DOM IIPor Iván Ruiz RosellóClase 10% teoría, 90% práctica

SEMANA 8Viernes 10/12 de 9 a 14hClase 15. Vanilla JavaScript: Conexión con datos externos IPor Iván Ruiz RosellóAprenderemos a manipular el DOM, es decir, a manipular lo que se presenta en una página web. Seremos capaces de interceptar por ejemplo un click en un área para cambiar las clases y estilos de otros elementos de la página.Clases 10% teoría, 90% práctica

Sábado 11/12 de 9 a 14hClase 16. Vanilla JavaScript: Conexión con datos externos IIPor Iván Ruiz RosellóClases 10% teoría, 90% práctica

Bloque 1. HTML y CSS

SEMANA 1 Viernes 22/10 de 16 a 21hClase 1. Abriendo la mentePor Diego Manuel BéjarConoceremos los objetivos del bootcamp y la ruta que vamos a seguir. Conoceremos conceptos básicos de internet detrás de las pantallas: qué es un dominio, cómo se resuelve, qué es un servidor, qué es la nube, qué es un hosting, la diferencia entre página estática y dinámica, y por qué una página estática puede ser interactiva...Clase 100% teórica

Sábado 23/10 de 9 a 14hClase 2. Herramientas: VSCode + GitPor Diego Manuel BéjarConoceremos las herramientas básicas (el editor VSCode y el control de versiones de Git) que son imprescindibles para trabajar en frontend. Tendremos un primer contacto con los emmet, así como los fundamentos de Git (incluyendo .gitignore y un gitflow básico para entender la diferencia entre entorno de desarrollo, producción y master). Esto es muy importante porque son las herramientas con

las que vamos a trabajar durante todo el curso.Clase 50% teórica, 50% práctica

SEMANA 2 Viernes 29/10 de 16 a 21hClase 3. HTML + CSS IPor Miguel Eduardo GonzálezVamos a crear nuestra propia página personal utilizando HTML y CSS. Conoceremos todo lo que hay que saber sobre HTML y los aspectos básicos de CSS.Clase 30% teoría, 70% práctica

Sábado 30/10 de 9 a 14hClase 4. HTML + CSS IIPor Miguel Eduardo GonzálezClase 30% teoría, 70% práctica

SEMANA 3 Viernes 05/11 de 16 a 21hClase 5. CSS Avanzado IPor María SimóVamos a hacer una iteración sobre nuestra página personal. La mejoraremos con técnicas de CSS avanzado como animaciones, filtros, flex, grid y selectores. Haremos una versión básica de sistema de diseño usando

variables, y jugaremos con responsive a través de Media queries. Y aplicaremos todo esto a nuestra web personal.Clase 30% teoría, 70% práctica

Sábado 06/11 de 9 a 14hClase 6. CSS Avanzado IIPor María SimóClase 30% teoría, 70% práctica

SEMANA 4 Viernes 12/11 de 16 a 21hClase 7. Workshop: Publicar una webPor Diego Manuel BéjarEn este workshop vamos a publicar nuestra web personal en Amazon Web Services (mediante S3). Crearemos una cuenta en AWS, obtendremos una key, instalaremos el CLI, crearemos un script para publicar cada cambio facilmente, actualizaremos el git y finalmente la veremos publicada. Se guiará además a quien quiera tener su propio dominio.Clase 10% teoría, 90% práctica

aprendido hasta ahora. En esta sesión cada alumno presentará su app para móviles, mostrando su código, y obtendrá feedback tanto del profesor como de sus compañeros. Es importante saber que, si bien se pueden presentar dudas en cualquier momento del curso, las sesiones Working Together están especialmente diseñadas para dar respuestas.Clase 100% práctica

Sábado 19/02 de 9 a 14hClase 32. Despedida y cierrePor Diego Manuel BéjarHaremos una sesión de repaso de todo lo aprendido. También recibiremos una breve visita de cada uno de los profesores, que nos recordará lo que ahora somos capaces de hacer, qué nos queda por aprender y por dónde podemos profundizar.Clase 100% teoría

Fin del curso. ¡Cañas virtuales!

Skills & Tools

12

Sábado 22/01 de 9 a 14hClase 24. Working Together: ReactPor Diego Manuel BéjarTutoría para repasar todos los conceptos y la manera en la que los alumnos han aplicado todo lo aprendido hasta ahora. En esta sesión cada alumno presentará su web en React y obtendrá feedback tanto del profesor como de sus compañeros. Es importante saber que, si bien se pueden presentar dudas en cualquier momento del curso, las sesiones Working Together están especialmente diseñadas para dar respuestas.Clase 100% práctica

SEMANA 13Viernes 28/01 de 16 a 21hClase 25. Next.js IPor Daniel Hervás Utilizando lo que hemos aprendido de React, seremos capaces de crear una página estática utilizando Next.js y React como framework. De esta manera seremos capaces de crear una página web estática que podemos publicar en cualquier sitio pero con todas las ventajas que nos da React.Clase 30% teoría, 70% práctica

Sábado 29/01 de 9 a 14hClase 26. Next.js IIPor Daniel Hervás Clase 30% teoría, 70% práctica

SEMANA 14Viernes 04/02 de 16 a 21hClase 27. Workshop: Sistemas de diseño en ReactPor María SimóVamos a profundizar en los sistemas de diseño y cómo los podemos aplicar a nuestros proyectos en React, poniendo en práctica todo lo que hemos aprendido hasta ahora.Clase 100% práctica

Sábado 05/02 de 9 a 14hClase 28. Working Together: Next.jsPor Diego Manuel Béjar. Tutoría para repasar todos los conceptos y la manera en la que los alumnos han aplicado todo lo aprendido hasta ahora. En esta sesión cada alumno presentará su web en Next.js, mostrando su código, y obtendrá feedback tanto del profesor como de sus compañeros. Es importante saber que, si bien se pueden presentar dudas en cualquier momento del curso, las sesiones Working

Together están especialmente diseñadas para dar respuestas.Clase 100% práctica

Bloque 4. React Native

SEMANA 15Viernes 11/02 de 16 a 21hClase 29. Expo IPor Anggella FortunatoVamos a crear una app para móviles, para iOS y Android, completamente real y lista para su publicación en Stores, utilizando todo lo aprendido de React, usando React Native con Expo. ¡Y vas a ser capaz de aprender a hacerlo en un solo fin de semana!Clase 20% teoría. 80% práctica

Sábado 12/02 de 9 a 14hClase 30. Expo IIPor Anggella FortunatoClase 20% teoría. 80% práctica

SEMANA 16Viernes 18/02 de 16 a 21hClase 31. Working Together: ExpoPor Diego Manuel BéjarTutoría para repasar todos los conceptos y la manera en la que los alumnos han aplicado todo lo

Bootcamp de Desarrollofrontend para diseñadoresOctubre / febrero 2022

Bootcam de Desarrollofrontend para diseñadores

Dirección del curso:Diego Manuel Béjar

Docentes:Diego Manuel BéjarMiguel Eduardo GonzálezMaría SimóIván Ruiz RosellóPere JuárezDaniel HervásAnggella Fortunato

Horarios clases:Viernes de 16 a 21hSábados de 9 a 14h

SEMANA 9Viernes 17/12 de 16 a 21hClase 17. Working Together: JavaScriptPor Diego Manuel Béjar Tutoría para repasar todos los conceptos y la manera en la que los alumnos han aplicado todo lo aprendido hasta ahora. En esta sesión cada alumno presentará su web desarrollada durante las sesiones anteriores, mostrando su código, y obtendrá feedback tanto del profesor como de sus compañeros. Es importante saber que, si bien se pueden presentar dudas en cualquier momento del curso, las sesiones Working Together están especialmente diseñadas para dar respuestas.Clase 100% práctica

Sábado 18/12 de 9 a 14hClase 18. Workshop: Agile con SCRUMPor Pere JuárezEn este workshop sobre SCRUM, trabajaremos con un caso real aplicando la metodología PBL Project Based Learning junto con Agile Sprint Method (enfoque IBM) para profundizar y aplicar sus conceptos básicos, en un espacio simulado de aprendizaje. Para ello

trabajaremos en equipos virtuales haciendo uso de Miro y Landscape Monitor.Clase 20% teoría, 80% práctica

Vacaciones de Navidad

Bloque 3. React

SEMANA 10Viernes 07/01 de 16 a 21hClase 19. React Por Daniel HervásInstalaremos el framework de React. Seremos capaces de crear una pequeña SPA utilizando React. Vamos a enfocarnos en entender claramente el tema de los componentes, la reutilización de estos, el JSX (que te sonará muy parecido a HTML).Clase 30% teoría, 70% práctica

Sábado 08/01 de 9 a 14hClase 20. React IPor Daniel HervásClase 30% teoría, 70% práctica

SEMANA 11Viernes 14/01 de 16 a 21hClase 21. React IIPor Daniel HervásA la web hecha la semana anterior le vamos a añadir funcionalidad gracias a los hooks. ¿Te acuerdas de lo que habíamos aprendido de las API? Aquí también las aplicaremos. También conoceremos cómo funciona NPM.Clase 20% teoría, 80% práctica

Sábado 15/01 de 9 a 14hClase 22. React II.Por Daniel HervásClase 20% teoría, 80% práctica

SEMANA 12Viernes 21/01 de 16 a 21hClase 23. Workshop: SassPor María SimóVamos a incluir Sass a nuestro proyecto. Es una extensión de CSS que nos permite hacer el trabajo más intuitivo y rápido. Trabajaremos también con las variables y los includes de Sass para crear un sistema de diseño básico.Clase 10% teoría, 90% práctica

Sábado 13/11 de 9 a 14hClase 8. Working Together: HTML y CSSPor Diego Manuel BéjarTutoría para repasar todos los conceptos y la manera en la que los alumnos han aplicado todo lo aprendido hasta ahora. En esta sesión cada alumno presentará su web, mostrando su código, y obtendrá feedback tanto del profesor como de sus compañeros. Es importante saber que, si bien se pueden presentar dudas en cualquier momento del curso, las sesiones Working Together están especialmente diseñadas para dar respuestas.Clase 100% práctica

Bloque 2. JavaScript

SEMANA 5 Viernes 19/11 de 16 a 21hClase 9. Metodología de la programación IPor Diego Manuel BéjarVamos a entender los conceptos de variable, condicional, bucle, función y eventos. Crearemos nuestro primer juego con Scratch, muy básico, usando un entorno visual para familiarizarnos con todos estos conceptos.Clase 30% teoría, 70% práctica

Sábado 20/11 de 9 a 14hClase 10. Metodología de la programación IIPor Diego Manuel BéjarClase 30% teoría, 70% práctica

SEMANA 6 Viernes 26/11 de 16 a 21hClase 11. Vanilla JavaScript: Fundamentos IPor Iván Ruiz RosellóCrearemos nuestras primeras funciones. Dibujaremos cosas básicas en pantalla, calcularemos si un número es primo, utilizaremos objetos…Clase 30% teoría, 70% práctica

Sábado 27/11 de 9 a 14hClase 12. Vanilla JavaScript: Fundamentos IIPor Iván Ruiz RosellóClase 30% teoría, 70% práctica

SEMANA 7Viernes 03/12 de 16 a 21hClase 13. Vanilla JavaScript: DOM IIPor Iván Ruiz RosellóAprenderemos a manipular el DOM, es decir, a manipular lo que se presenta en una página web. Seremos capaces de nterceptar,

por ejemplo, un click en un área para cambiar las clases y estilos de otros elementos de la página.Clase 10% teoría, 90% práctica

Sábado 04/12 de 9 a 14hClase 14. Vanilla JavaScript: DOM IIPor Iván Ruiz RosellóClase 10% teoría, 90% práctica

SEMANA 8Viernes 10/12 de 9 a 14hClase 15. Vanilla JavaScript: Conexión con datos externos IPor Iván Ruiz RosellóAprenderemos a manipular el DOM, es decir, a manipular lo que se presenta en una página web. Seremos capaces de interceptar por ejemplo un click en un área para cambiar las clases y estilos de otros elementos de la página.Clases 10% teoría, 90% práctica

Sábado 11/12 de 9 a 14hClase 16. Vanilla JavaScript: Conexión con datos externos IIPor Iván Ruiz RosellóClases 10% teoría, 90% práctica

Bloque 1. HTML y CSS

SEMANA 1 Viernes 22/10 de 16 a 21hClase 1. Abriendo la mentePor Diego Manuel BéjarConoceremos los objetivos del bootcamp y la ruta que vamos a seguir. Conoceremos conceptos básicos de internet detrás de las pantallas: qué es un dominio, cómo se resuelve, qué es un servidor, qué es la nube, qué es un hosting, la diferencia entre página estática y dinámica, y por qué una página estática puede ser interactiva...Clase 100% teórica

Sábado 23/10 de 9 a 14hClase 2. Herramientas: VSCode + GitPor Diego Manuel BéjarConoceremos las herramientas básicas (el editor VSCode y el control de versiones de Git) que son imprescindibles para trabajar en frontend. Tendremos un primer contacto con los emmet, así como los fundamentos de Git (incluyendo .gitignore y un gitflow básico para entender la diferencia entre entorno de desarrollo, producción y master). Esto es muy importante porque son las herramientas con

las que vamos a trabajar durante todo el curso.Clase 50% teórica, 50% práctica

SEMANA 2 Viernes 29/10 de 16 a 21hClase 3. HTML + CSS IPor Miguel Eduardo GonzálezVamos a crear nuestra propia página personal utilizando HTML y CSS. Conoceremos todo lo que hay que saber sobre HTML y los aspectos básicos de CSS.Clase 30% teoría, 70% práctica

Sábado 30/10 de 9 a 14hClase 4. HTML + CSS IIPor Miguel Eduardo GonzálezClase 30% teoría, 70% práctica

SEMANA 3 Viernes 05/11 de 16 a 21hClase 5. CSS Avanzado IPor María SimóVamos a hacer una iteración sobre nuestra página personal. La mejoraremos con técnicas de CSS avanzado como animaciones, filtros, flex, grid y selectores. Haremos una versión básica de sistema de diseño usando

variables, y jugaremos con responsive a través de Media queries. Y aplicaremos todo esto a nuestra web personal.Clase 30% teoría, 70% práctica

Sábado 06/11 de 9 a 14hClase 6. CSS Avanzado IIPor María SimóClase 30% teoría, 70% práctica

SEMANA 4 Viernes 12/11 de 16 a 21hClase 7. Workshop: Publicar una webPor Diego Manuel BéjarEn este workshop vamos a publicar nuestra web personal en Amazon Web Services (mediante S3). Crearemos una cuenta en AWS, obtendremos una key, instalaremos el CLI, crearemos un script para publicar cada cambio facilmente, actualizaremos el git y finalmente la veremos publicada. Se guiará además a quien quiera tener su propio dominio.Clase 10% teoría, 90% práctica

aprendido hasta ahora. En esta sesión cada alumno presentará su app para móviles, mostrando su código, y obtendrá feedback tanto del profesor como de sus compañeros. Es importante saber que, si bien se pueden presentar dudas en cualquier momento del curso, las sesiones Working Together están especialmente diseñadas para dar respuestas.Clase 100% práctica

Sábado 19/02 de 9 a 14hClase 32. Despedida y cierrePor Diego Manuel BéjarHaremos una sesión de repaso de todo lo aprendido. También recibiremos una breve visita de cada uno de los profesores, que nos recordará lo que ahora somos capaces de hacer, qué nos queda por aprender y por dónde podemos profundizar.Clase 100% teoría

Fin del curso. ¡Cañas virtuales!

Sábado 22/01 de 9 a 14hClase 24. Working Together: ReactPor Diego Manuel BéjarTutoría para repasar todos los conceptos y la manera en la que los alumnos han aplicado todo lo aprendido hasta ahora. En esta sesión cada alumno presentará su web en React y obtendrá feedback tanto del profesor como de sus compañeros. Es importante saber que, si bien se pueden presentar dudas en cualquier momento del curso, las sesiones Working Together están especialmente diseñadas para dar respuestas.Clase 100% práctica

SEMANA 13Viernes 28/01 de 16 a 21hClase 25. Next.js IPor Daniel Hervás Utilizando lo que hemos aprendido de React, seremos capaces de crear una página estática utilizando Next.js y React como framework. De esta manera seremos capaces de crear una página web estática que podemos publicar en cualquier sitio pero con todas las ventajas que nos da React.Clase 30% teoría, 70% práctica

Sábado 29/01 de 9 a 14hClase 26. Next.js IIPor Daniel Hervás Clase 30% teoría, 70% práctica

SEMANA 14Viernes 04/02 de 16 a 21hClase 27. Workshop: Sistemas de diseño en ReactPor María SimóVamos a profundizar en los sistemas de diseño y cómo los podemos aplicar a nuestros proyectos en React, poniendo en práctica todo lo que hemos aprendido hasta ahora.Clase 100% práctica

Sábado 05/02 de 9 a 14hClase 28. Working Together: Next.jsPor Diego Manuel Béjar. Tutoría para repasar todos los conceptos y la manera en la que los alumnos han aplicado todo lo aprendido hasta ahora. En esta sesión cada alumno presentará su web en Next.js, mostrando su código, y obtendrá feedback tanto del profesor como de sus compañeros. Es importante saber que, si bien se pueden presentar dudas en cualquier momento del curso, las sesiones Working

Together están especialmente diseñadas para dar respuestas.Clase 100% práctica

Bloque 4. React Native

SEMANA 15Viernes 11/02 de 16 a 21hClase 29. Expo IPor Anggella FortunatoVamos a crear una app para móviles, para iOS y Android, completamente real y lista para su publicación en Stores, utilizando todo lo aprendido de React, usando React Native con Expo. ¡Y vas a ser capaz de aprender a hacerlo en un solo fin de semana!Clase 20% teoría. 80% práctica

Sábado 12/02 de 9 a 14hClase 30. Expo IIPor Anggella FortunatoClase 20% teoría. 80% práctica

SEMANA 16Viernes 18/02 de 16 a 21hClase 31. Working Together: ExpoPor Diego Manuel BéjarTutoría para repasar todos los conceptos y la manera en la que los alumnos han aplicado todo lo

SEMANA 9Viernes 17/12 de 16 a 21hClase 17. Working Together: JavaScriptPor Diego Manuel Béjar Tutoría para repasar todos los conceptos y la manera en la que los alumnos han aplicado todo lo aprendido hasta ahora. En esta sesión cada alumno presentará su web desarrollada durante las sesiones anteriores, mostrando su código, y obtendrá feedback tanto del profesor como de sus compañeros. Es importante saber que, si bien se pueden presentar dudas en cualquier momento del curso, las sesiones Working Together están especialmente diseñadas para dar respuestas.Clase 100% práctica

Sábado 18/12 de 9 a 14hClase 18. Workshop: Agile con SCRUMPor Pere JuárezEn este workshop sobre SCRUM, trabajaremos con un caso real aplicando la metodología PBL Project Based Learning junto con Agile Sprint Method (enfoque IBM) para profundizar y aplicar sus conceptos básicos, en un espacio simulado de aprendizaje. Para ello

trabajaremos en equipos virtuales haciendo uso de Miro y Landscape Monitor.Clase 20% teoría, 80% práctica

Vacaciones de Navidad

Bloque 3. React

SEMANA 10Viernes 07/01 de 16 a 21hClase 19. React Por Daniel HervásInstalaremos el framework de React. Seremos capaces de crear una pequeña SPA utilizando React. Vamos a enfocarnos en entender claramente el tema de los componentes, la reutilización de estos, el JSX (que te sonará muy parecido a HTML).Clase 30% teoría, 70% práctica

Sábado 08/01 de 9 a 14hClase 20. React IPor Daniel HervásClase 30% teoría, 70% práctica

SEMANA 11Viernes 14/01 de 16 a 21hClase 21. React IIPor Daniel HervásA la web hecha la semana anterior le vamos a añadir funcionalidad gracias a los hooks. ¿Te acuerdas de lo que habíamos aprendido de las API? Aquí también las aplicaremos. También conoceremos cómo funciona NPM.Clase 20% teoría, 80% práctica

Sábado 15/01 de 9 a 14hClase 22. React II.Por Daniel HervásClase 20% teoría, 80% práctica

SEMANA 12Viernes 21/01 de 16 a 21hClase 23. Workshop: SassPor María SimóVamos a incluir Sass a nuestro proyecto. Es una extensión de CSS que nos permite hacer el trabajo más intuitivo y rápido. Trabajaremos también con las variables y los includes de Sass para crear un sistema de diseño básico.Clase 10% teoría, 90% práctica

Sábado 13/11 de 9 a 14hClase 8. Working Together: HTML y CSSPor Diego Manuel BéjarTutoría para repasar todos los conceptos y la manera en la que los alumnos han aplicado todo lo aprendido hasta ahora. En esta sesión cada alumno presentará su web, mostrando su código, y obtendrá feedback tanto del profesor como de sus compañeros. Es importante saber que, si bien se pueden presentar dudas en cualquier momento del curso, las sesiones Working Together están especialmente diseñadas para dar respuestas.Clase 100% práctica

Bloque 2. JavaScript

SEMANA 5 Viernes 19/11 de 16 a 21hClase 9. Metodología de la programación IPor Diego Manuel BéjarVamos a entender los conceptos de variable, condicional, bucle, función y eventos. Crearemos nuestro primer juego con Scratch, muy básico, usando un entorno visual para familiarizarnos con todos estos conceptos.Clase 30% teoría, 70% práctica

Sábado 20/11 de 9 a 14hClase 10. Metodología de la programación IIPor Diego Manuel BéjarClase 30% teoría, 70% práctica

SEMANA 6 Viernes 26/11 de 16 a 21hClase 11. Vanilla JavaScript: Fundamentos IPor Iván Ruiz RosellóCrearemos nuestras primeras funciones. Dibujaremos cosas básicas en pantalla, calcularemos si un número es primo, utilizaremos objetos…Clase 30% teoría, 70% práctica

Sábado 27/11 de 9 a 14hClase 12. Vanilla JavaScript: Fundamentos IIPor Iván Ruiz RosellóClase 30% teoría, 70% práctica

SEMANA 7Viernes 03/12 de 16 a 21hClase 13. Vanilla JavaScript: DOM IIPor Iván Ruiz RosellóAprenderemos a manipular el DOM, es decir, a manipular lo que se presenta en una página web. Seremos capaces de nterceptar,

por ejemplo, un click en un área para cambiar las clases y estilos de otros elementos de la página.Clase 10% teoría, 90% práctica

Sábado 04/12 de 9 a 14hClase 14. Vanilla JavaScript: DOM IIPor Iván Ruiz RosellóClase 10% teoría, 90% práctica

SEMANA 8Viernes 10/12 de 9 a 14hClase 15. Vanilla JavaScript: Conexión con datos externos IPor Iván Ruiz RosellóAprenderemos a manipular el DOM, es decir, a manipular lo que se presenta en una página web. Seremos capaces de interceptar por ejemplo un click en un área para cambiar las clases y estilos de otros elementos de la página.Clases 10% teoría, 90% práctica

Sábado 11/12 de 9 a 14hClase 16. Vanilla JavaScript: Conexión con datos externos IIPor Iván Ruiz RosellóClases 10% teoría, 90% práctica

Bloque 1. HTML y CSS

SEMANA 1 Viernes 22/10 de 16 a 21hClase 1. Abriendo la mentePor Diego Manuel BéjarConoceremos los objetivos del bootcamp y la ruta que vamos a seguir. Conoceremos conceptos básicos de internet detrás de las pantallas: qué es un dominio, cómo se resuelve, qué es un servidor, qué es la nube, qué es un hosting, la diferencia entre página estática y dinámica, y por qué una página estática puede ser interactiva...Clase 100% teórica

Sábado 23/10 de 9 a 14hClase 2. Herramientas: VSCode + GitPor Diego Manuel BéjarConoceremos las herramientas básicas (el editor VSCode y el control de versiones de Git) que son imprescindibles para trabajar en frontend. Tendremos un primer contacto con los emmet, así como los fundamentos de Git (incluyendo .gitignore y un gitflow básico para entender la diferencia entre entorno de desarrollo, producción y master). Esto es muy importante porque son las herramientas con

las que vamos a trabajar durante todo el curso.Clase 50% teórica, 50% práctica

SEMANA 2 Viernes 29/10 de 16 a 21hClase 3. HTML + CSS IPor Miguel Eduardo GonzálezVamos a crear nuestra propia página personal utilizando HTML y CSS. Conoceremos todo lo que hay que saber sobre HTML y los aspectos básicos de CSS.Clase 30% teoría, 70% práctica

Sábado 30/10 de 9 a 14hClase 4. HTML + CSS IIPor Miguel Eduardo GonzálezClase 30% teoría, 70% práctica

SEMANA 3 Viernes 05/11 de 16 a 21hClase 5. CSS Avanzado IPor María SimóVamos a hacer una iteración sobre nuestra página personal. La mejoraremos con técnicas de CSS avanzado como animaciones, filtros, flex, grid y selectores. Haremos una versión básica de sistema de diseño usando

variables, y jugaremos con responsive a través de Media queries. Y aplicaremos todo esto a nuestra web personal.Clase 30% teoría, 70% práctica

Sábado 06/11 de 9 a 14hClase 6. CSS Avanzado IIPor María SimóClase 30% teoría, 70% práctica

SEMANA 4 Viernes 12/11 de 16 a 21hClase 7. Workshop: Publicar una webPor Diego Manuel BéjarEn este workshop vamos a publicar nuestra web personal en Amazon Web Services (mediante S3). Crearemos una cuenta en AWS, obtendremos una key, instalaremos el CLI, crearemos un script para publicar cada cambio facilmente, actualizaremos el git y finalmente la veremos publicada. Se guiará además a quien quiera tener su propio dominio.Clase 10% teoría, 90% práctica

Skills & Tools

13

aprendido hasta ahora. En esta sesión cada alumno presentará su app para móviles, mostrando su código, y obtendrá feedback tanto del profesor como de sus compañeros. Es importante saber que, si bien se pueden presentar dudas en cualquier momento del curso, las sesiones Working Together están especialmente diseñadas para dar respuestas.Clase 100% práctica

Sábado 19/02 de 9 a 14hClase 32. Despedida y cierrePor Diego Manuel BéjarHaremos una sesión de repaso de todo lo aprendido. También recibiremos una breve visita de cada uno de los profesores, que nos recordará lo que ahora somos capaces de hacer, qué nos queda por aprender y por dónde podemos profundizar.Clase 100% teoría

Fin del curso. ¡Cañas virtuales!

Bootcamp de Desarrollofrontend para diseñadoresOctubre / febrero 2022

Bootcam de Desarrollofrontend para diseñadores

Dirección del curso:Diego Manuel Béjar

Docentes:Diego Manuel BéjarMiguel Eduardo GonzálezMaría SimóIván Ruiz RosellóPere JuárezDaniel HervásAnggella Fortunato

Horarios clases:Viernes de 16 a 21hSábados de 9 a 14h

ALWAYSWITH

CARIÑO

www.mrmarcelschool.com

Skills & Tools