- Level Professional
- Duration 25 hours
- Course by Meta
-
Offered by
About
El proyecto final le permite demostrar múltiples habilidades del Certificado a través de la resolución de un problema auténtico del mundo real. Cada módulo incluye un breve resumen y enlaces al contenido que ha cubierto en cursos anteriores de este programa. nEste curso pondrá a prueba sus conocimientos y su comprensión y le proporcionará una plataforma para mostrar las nuevas habilidades que adquirió en el desarrollo web Front-end utilizando React. Durante este curso, se le guiará a través del proceso de creación de una aplicación, para lo cual combinará todas las habilidades y tecnologías que ha aprendido a lo largo de este programa con objeto de resolver el problema en cuestión. Al completar el proyecto final, tendrá una cartera lista para comenzar a trabajar, que puede mostrar a los reclutadores, presentar durante las entrevistas y usar para impresionar a los posibles empleadores. Para completar este curso, necesitará experiencia como desarrollador de Front-end. Además, ¡siempre es bueno tener una actitud positiva!Modules
Información del proyecto
1
Discussions
- Encuentro y saludo
1
Videos
- Introducción al curso
4
Readings
- Programa del curso
- Cómo tener éxito en este curso
- Comprobación del entorno de desarrollo
- Recursos adicionales
Configuración del proyecto
4
Assignment
- Comprobación de preparación: ¿Configuró el repositorio Git?
- Comprobación de preparación: ¿Configuró el proyecto React?
- Comprobación de preparación: ¿Hizo sus entregas?
- Verificación de conocimientos: Configuración del proyecto
1
Videos
- Configuración del proyecto
6
Readings
- Resumen: Control de versiones
- Ejercicio: Configurar el repositorio
- Resumen: Configuración de React
- Ejercicio: Configurar el proyecto de React
- Ejercicio: Entregar el proyecto
- Recursos adicionales
Planificación de la UX (user experience, experiencia de usuario) y de la UI (user interface, interfaz de usuario)Planificación de la UX y de la UI
5
Assignment
- Comprobación de preparación: ¿Realizó el wireframe?
- Comprobación de preparación: ¿Estableció los diseños de sus componentes clave?
- Comprobación de preparación: ¿Estableció una jerarquía tipográfica, las fuentes y los colores usando la guía de estilo?
- Verificación de conocimientos: Planificación de la UX y de la UIhe UX and UI
- Prueba del módulo: Inicio del proyecto
2
Videos
- Planificación de la UX y de la UI
- Resumen del módulo: Inicio del proyecto
5
Readings
- Resumen: Principios de UX y UI
- Ejercicio: Wireframing del proyecto
- Ejercicio: Diseñar componentes
- Ejercicio: Aplicar los fundamentos del diseño en Figma
- Recursos adicionales
Estructura semántica
4
Assignment
- Comprobación de preparación: ¿Configuró un documento HTML semántico?
- Comprobación de preparación: ¿Estableció metaetiquetas y datos del protocolo Open Graph?
- Comprobación de preparación: ¿Confirmó su avance en Git?
- Verificación de conocimientos: Estructura semántica
1
Videos
- Configuración de un documento HTML semántico
5
Readings
- Resumen: HTML semántico
- Ejercicio: Configurar el documento HTML
- Resumen: Metaetiquetas y protocolo Open Graph
- Ejercicio: Agregar metaetiquetas y configurar el OGP
- Recursos adicionales
Estilo y capacidad de respuesta
4
Assignment
- Comprobación de preparación: ¿Configuró un diseño CSS receptivo?
- Comprobación de preparación: ¿Comprobó que los elementos visuales del sitio web coincidan con el diseño de Figma?e website match the Figma design?
- Comprobación de preparación: ¿Confirmó su avance en Git?
- Verificación de conocimientos: Estilo y capacidad de respuesta
1
Videos
- Elementos de estilo
5
Readings
- Resumen: Cuadrículas CSS
- Ejercicio: Configurar el diseño CSS
- Resumen: Elementos de estilo
- Ejercicio: Elementos de estilo
- Recursos adicionales
Agregar componentes
5
Assignment
- Comprobación de preparación: ¿Configuró los componentes de la aplicación?
- Comprobación de preparación: ¿Sus componentes son semánticamente correctos?
- Comprobación de preparación: ¿Confirmó su avance en Git?
- Verificación de conocimientos: Agregar componentes
- Cuestionario del módulo: Fundamentos del proyecto
2
Videos
- Componentes del proyecto
- Resumen del módulo: Fundamentos del proyecto
3
Readings
- Resumen: Conceptos básicos de React
- Ejercicio: Configurar los componentes de la aplicación
- Recursos adicionales
Sistema de reserva de mesas
5
Assignment
- Comprobación de preparación: ¿Ha configurado un componente para ver las reservas disponibles?
- Comprobación de preparación: ¿Compartió el estado de reserva de mesas entre los componentes?
- Comprobación de preparación: ¿Sus componentes son semánticamente correctos?
- Comprobación de preparación: ¿Ha configurado pruebas unitarias de componentes?
- Verificación de conocimientos: Sistema de reserva de mesas
1
Videos
- Reservas de mesas por parte de los clientes
7
Readings
- Resumen: Estado en React
- Resumen: Formularios
- Ejercicio: Definir la página Reservas
- Ejercicio: Agregar estado de reserva de mesa
- Resumen: Pruebas unitarias
- Ejercicio: Agregar pruebas unitarias
- Recursos adicionales
Interacción con la API
5
Assignment
- Comprobación de preparación: ¿Su página de reservas utiliza datos "en vivo"?
- Comprobación de preparación: ¿El sistema de reserva de mesas funciona de extremo a extremo?to-end?
- Comprobación de preparación: ¿Configuró las pruebas unitarias de API?
- Comprobación de preparación: ¿Confirmó su avance en Git?
- Verificación de conocimientos: Interacción con la API
1
Videos
- Consulta de una API de reserva de mesas
5
Readings
- Resumen: Consulta de API en React
- Ejercicio: Conectar la página de reservas a la API
- Ejercicio: Enviar la nueva página de reserva a la API
- Ejercicio: Actualizar las pruebas unitarias para las consultas de API
- Recursos adicionales
Mejorar la experiencia
7
Assignment
- Comprobación de preparación: ¿Su formulario de reserva valida los datos del usuario?
- Comprobación de preparación: ¿Configuró las pruebas unitarias de validación y envío de formularios?
- Comprobación de preparación: ¿Su aplicación es accesible?
- Comprobación de preparación: ¿Completó la evaluación heurística de la usabilidad?
- Comprobación de preparación: ¿Confirmó su avance en Git?
- Verificación de conocimientos: Mejorar la experiencia
- Prueba del módulo: Funcionalidad del proyecto
2
Videos
- La importancia de la UX
- Resumen del módulo: Funcionalidad del proyecto
8
Readings
- Resumen: Validación de formularios
- Ejercicio: Agregar validación de formularios
- Ejercicio: Agregar pruebas unitarias para la validación y el envío de formularios
- Resumen: Accesibilidad
- Ejercicio: Garantizar que los usuarios puedan acceder a la aplicación
- Resumen: Evaluación de la usabilidad de la UX y la UI
- Ejercicio: Evaluación y revisión de la UX
- Recursos adicionales
Evaluación final del proyecto
2
Assignment
- Comprobación de preparación: Prepararse para entregar el proyecto
- Cuestionario final calificado
1
Peer Review
- Reservar una mesa en el sitio web de Little Lemon
1
Videos
- Resumen del curso: Proyecto final
2
Readings
- Acerca de la evaluación del proyecto final
- Solución: Reservar una mesa en el sitio web de Little Lemon
Resumen del curso
1
Discussions
- Reflexionar sobre el aprendizaje
1
Videos
- ¡Felicidades, ha completado el Proyecto final!
1
Readings
- Próximos pasos
Auto Summary
This comprehensive final project course is designed for Front-End developers aiming to showcase their skills in a real-world scenario using React. Offered by Coursera in the IT & Computer Science domain, the course guides you through building an application, integrating all learned technologies. Ideal for professionals, it requires prior Front-End experience and a positive attitude. The course spans 1500 hours and offers Starter and Professional subscription options. Upon completion, you'll have a portfolio-ready project to impress recruiters and potential employers.

Taught by Meta Staff