Crea un Clon de Instagram con React.js | Appdelante
🔥 Nuevo Curso: Programa Snake desde cero con JavaScript 🔥

Curso de React.js

Aprende React.js creando un Clon de Instagram

¿Para quién es el curso?

El curso está diseñado para:

Desarrolladores con experiencia en JavaScript pero que no han tocado React. El curso poco a poco te enseñará lo conceptos que necesitas para ser productivo con React y crear tus propias aplicaciones.

Y segundo, desarrolladores que tienen un nivel básico/intermedio de React.js, pero que quieren entender profundamente las mejores prácticas del framework. Adicionalmente, el curso enseña lo más nuevo de React: Los Hooks.

¿Qué voy a aprender?

  • La filosofía de React.js
  • Cómo partir una aplicación en componentes
  • Diseño de componentes pequeños y reusables
  • Interacciones con un API de tipo REST
  • Autenticación de usuarios con JWT
  • Subir fotos desde el navegador
  • Cómo utilizar los Hooks
  • Cómo paginar datos
  • Y lo más fucking cool: crear un Instagram

Módulos del curso

El curso está dividido en módulos. Primeros nos vamos a enfocar en la arquitectura de nuestra aplicación: la estructura de nuestros directorios, autenticación de usuarios, manejo de errores y el sistema de rutas.

Luego nos vamos a enfocar en cada una de las vistas. Estos son los módulos:

Introducción y Setup

Vamos a asegurarnos que tengas todas las dependencias, descargar el repositorio, llenar tu base de datos y prender nuestro ambiente de desarrollo.

Autenticación

En esta sección vamos a cubrir cómo utilizar formularios en React.js, enviar data al API, y manejar el estado global de la aplicación.

También vamos a cubrir cómo utilizar los JWT para autenticar a los usuarios y reanudar sus sesiones.

Routing

Te voy a introducir a la librería react-router y te voy a enseñar la clave para manejar rutas privadas y rutas públicas

Vista Upload

Las imágenes son el corazón de Instagram. La Vista Upload nos va a permitir explorar cómo subir imágenes al servidor. Vamos a explorar las mejores prácticas y cómo hacer que la experiencia se sienta rápida.

Vista Feed

El Feed es una de las vistas más complejas de nuestra aplicación. Vamos a crear un componente genérico para cada uno de los posts, al igual que componentes para el botón like y el formulario de comentarios. Los combinaremos todos para tener un post.

También vamos a explorar cómo paginar respuestas del API.

Vista Post

La Vista Post se encarga de mostrar un post individual. Va a ser el ejemplo perfecto para ver cómo podemos reutilizar componentes que creamos para el Feed. También te voy a enseñar cómo pasar parámetros por el URL.

Vista Explore

Sin Explore, los usuarios de Clontagram no pueden encontrar a otros usuarios a quien seguir o ver fotos que no se encuentran en su feed. En esta vista vamos a ver cómo sincronizar multiples llamadas al servidor, y vamos a construir un grid genial para mostrar multiples fotos.

Vista Perfil

El Perfil es la casa de nuestros usuarios. Hay muchos detalles y estados que manejar. En está vista vamos a implementar la habilidad de seguir a otros usuarios, también vamos a implementar la lógica para subir una foto para el avatar y vamos a reutilizar componentes de explore.

¿Quién es el profesor?

Ingeniero de software

Ricardo Macario

Tengo más de seis años trabajando como Ingeniero de Frontend. Después de graduarme trabajé para Canvs.tv ubicada en NYC. Ayudé a desarrollar una plataforma que le permite a HBO, Showtime, Fox y más, entender cómo su audiencia reacciona en las redes sociales cuando un episodio o programa sale al aire.

Luego, trabajé para una startup de San Francisco llamada Appdirect. Contribuí al desarrollo de AppInsights, una aplicación de visualización de datos que le permite a cualquier compañía integrar sus métricas en un mismo sitio.

Actualmente trabajo para Shopify. Desarrollando productos que le permiten a los usuarios crear el branding de sus tiendas virtuales.

¿Listo para empezar?

Acceso a este curso
  • Un solo pago. Acceso al curso de por vida
  • Todo lo que necesitas para ir de cero a avanzado con React.js
  • Aprende lo más nuevo de React.js: Hooks
  • 7 horas de videos cortos y concisos
  • Acceso inmediato a los videos y código de la aplicación
  • Utiliza el proyecto final para tu portafolio
  • Curso al día. Actualizamos los videos cuando las dependencias cambian
  • Soporte por email con el profesor en caso de que tengas cualquier pregunta
  • Certificado de completación para tu CV

Preguntas Frecuentes

¿El curso enseña el desarrollo del backend (API)?

No, en el curso no voy a cubrir el desarrollo del API. Nos vamos a enfocar exclusivamente en el frontend. Sin embargo, vas a tener acceso al código del servidor ya que lo vas a estar corriendo localmente.

Si quieres aprender sobre el servidor, puedes tomar nuestro curso que está dedicado al desarrollo de APIs: Diseño de APIs con Node.js

¿Necesito saber JavaScript avanzado para tomar este curso?

¡No! Sin embargo, esperamos que domines los fundamentos de la programación y JavaScript (variables, condicionales, loops, funciones, objetos, etc). El curso es muy detallado y poco a poco vamos a ir introduciendo los conceptos.

¿Vas a enseñar el CSS?

En el curso no voy a enseñar CSS. Te voy a dar acceso a un repositorio que contiene un archivo de CSS con todos las clases y estilos para la aplicación.

Para aprender más sobre el CSS de la aplicación puedes jugar con el archivo que contiene los estilos, e inspeccionar los elementos en el navegador.

¿Qué es los más valioso que voy a aprender?

Este curso comprime todo lo que he aprendido sobre React.js en los últimos 5 años.

En el curso vas a absorber mi filosofía a la hora de desarrollar aplicaciones con React. Mi objetivo final es darte las herramientas para que puedas atacar problemas utilizando React.js. Una vez que hayas terminado el curso vas a estar en capacidad de lanzar tus propios productos y aplicar a trabajos como desarrollador de React.

¡No puedo esperar a ver que construyes con todo el conocimiento!

¿Los pagos en Appdelante son seguros? ¿Cómo sé que no me van a clonar la tarjeta/Paypal?

Los pagos de Appdelante son procesados por Shopify. Nosotros no tenemos acceso al número de tu tarjeta de crédito o cuenta de PayPal.

¿Qué pasa si no me gusta el curso?

La pólitica de Appdelante es que si no te gusta el curso, te devolvemos tu dinero.

Chat con nosotros