4Geeks logo
4Geeks logo

Courses

Explora nuestra extensa colección de cursos diseñados para ayudarte a dominar varios temas y habilidades. Ya seas un principiante o un aprendiz avanzado, aquí hay algo para todos.

Coding Bootcamp

Aprende en vivo

Únete a nosotros en nuestros talleres gratuitos, webinars y otros eventos para aprender más sobre nuestros programas y comenzar tu camino para convertirte en desarrollador.

Próximos eventos en vivo

Catálogo de contenidos

Para los geeks autodidactas, este es nuestro extenso catálogo de contenido con todos los materiales y tutoriales que hemos desarrollado hasta el día de hoy.

Tiene sentido comenzar a aprender leyendo y viendo videos sobre los fundamentos y cómo funcionan las cosas.

Full-Stack Software Developer - 16w

Data Science and Machine Learning - 16 wks

Buscar en lecciones


IngresarEmpezar
← Volver a Proyectos

Crea un TodoList con React Context

Meta

Tutoriales y ejercicios de 4Geeks Coding Projects para personas que están aprendiendo a codificar o mejorando sus habilidades de codificación

Dificultad

intermediate

Repositorio

No disponible

Video

No disponible

Video de solución

No disponible

Duración promedio

8 hrs

Tecnologías

  • Flux

  • context.api

  • ReactJS

Weekly Coding Challenge

Todas las semanas escogemos un proyecto de la vida real para que construyas tu portafolio y te prepares para conseguir un trabajo. Todos nuestros proyectos están construidos con ChatGPT como co-pilot!

Únete al reto

Podcast: Code Sets You Free

Un podcast de cultura tecnológica donde aprenderás a luchar contra los enemigos que te bloquean en tu camino para convertirte en un profesional exitoso en tecnología.

Escuchar el podcast

alt text React TODO application

Crea una aplicación de un TODO list (lista de cosas por hacer) que le permita a los usuarios agregar y eliminar tasks (tareas), pero utilizando la API de contexto con un store (almacenamiento) centralizado y funciones de acción.

🌱 Como empezar este proyecto

No clones este repositorio.

El primer paso para empezar a codificar es clonando el react.js boilerplate en tu computador local, o abrirlo utilizando Gitpod.

a) Si usas Gitpod (recomendado) puedes clonar el boilerplate dándole clic aquí.

b) Si estas trabajando localmente, escribe el siguiente comando desde tu línea de comandos: git clone https://github.com/4GeeksAcademy/react-hello-webapp.

🔎 Importante: recuerda crear un nuevo repositorio, actualiza el URL remoto (git remote set-url origin <your new url>), y sube el código a tu nuevo repositorio utilizando add (añadir), commit (realizar) y push (expulsar).

📝 Instrucciones:

  • Tu app debe verse así.

  • Las tareas son añadidas cuando el usuario presiona enter en el teclado, o también puedes tener tu propio botón.

  • El ícono de eliminar solo se muestra cuando se pasa el cursor sobre la tarea.

  • El usuario puede añadir cuantas tareas quiera.

  • Cuando no hay tareas, la lista deberia mostrar "sin tareas, agrega una tarea"

  • No hay manera de actualizar una traea, el usuario tendrá que eliminarla y crearla de nuevo.

💡 Tips para terminar este proyecto:

No vayas directo al código, piensa primero y ten una estrategia viable.

  • ¿Qué compnentes vas a crear? Dibuja el proyecto en una hoja blanca e identifica los componentes.

  • ¿Dónde se almacenarán las tareas en tu componente?

  • Lee acerca de controlled components inputs in react.js, necesitarás comprender el concepto.

Meta

Tutoriales y ejercicios de 4Geeks Coding Projects para personas que están aprendiendo a codificar o mejorando sus habilidades de codificación

Dificultad

intermediate

Repositorio

No disponible

Video

No disponible

Video de solución

No disponible

Duración promedio

8 hrs

Tecnologías

Weekly Coding Challenge

Todas las semanas escogemos un proyecto de la vida real para que construyas tu portafolio y te prepares para conseguir un trabajo. Todos nuestros proyectos están construidos con ChatGPT como co-pilot!

Únete al reto

Podcast: Code Sets You Free

Un podcast de cultura tecnológica donde aprenderás a luchar contra los enemigos que te bloquean en tu camino para convertirte en un profesional exitoso en tecnología.

Escuchar el podcast