El primer Proyecto casi completo de React, y fue toda una experiencia. gracias a todo el equipo
https://github.com/roxsyVel910/duckling-shoes
Introducción
Construye una tienda online con React
Enrutamiento y estructura base
Instalación de React con Vite y TailwindCSS
Análisis de rutas y componentes en React
Enrutamiento con React Router DOM
Componente Navbar
Componente de Layout
Componente de Card
Consumiendo la FakeStore API para pintar cards
Manejo de estado global con Context
Contexto global de la aplicación
Contador de productos en el carrito
Abriendo el detalle de cada producto
Reto: heroicons con TailwindCSS
Maquetando el ProductDetail
Mostrando productos en ProductDetail
Carrito de Compras
Agregando productos al carrito
SideMenu del carrito de compras
Componente OrderCard
Evitando productos duplicados en el carrito
Eliminar productos del carrito
Suma total de productos en el carrito
Checkout y Órdenes de Compra
Flujo para crear una nueva orden
Checkout de productos en el carrito
Página de MyOrders: lista de órdenes
Página de MyOrder: órden individual
Reto: órdenes de compra con TailwindCSS
Filtrando productos desde el frontend
Buscador de productos
Filtrando títulos con JavaScript
Filtrando categorías con JavaScript
Corrigiendo bugs de la aplicación
Próximos pasos
Deploy de React en Netlify
¿Preparada o preparado para un Laboratorio de React?
No tienes acceso a esta clase
¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera
Si ya tienes una cuenta,
¿Preparada o preparado para un Laboratorio de React?
31/31Recursos
Nombre del curso: Taller de React.js con Vite.js y TailwindCSS
Director de escuela: Oscar Barajas
Profesor: Estefany Aguilar
Dirección: Juan David Castro Gallego
Producción OPS: Lizeth Cáceres y Rocío Martínez
Creación audiovisual: Felipe Solem
Edición de video: Andrés Giraldo Díaz
Postproducción de audio: Karen White
Diseño gráfico: Carol Baquero
Coordinación General: Andrés Arizmendy, Daniel Gutiérrez, Carol Baquero, Carlos Céspedes y Sura Cedeño
Revisión: Brandon Argel Verdeja y Belman Marin
Aportes 50
Preguntas 1
Ordenar por:
Excelente curso, me encantó, muy bien desarrollado por la Profesora, felicitaciones, pude realizar el proyecto completo, gracias.
Sí, sería beneficioso contar con un laboratorio, ya que, a pesar de haber adquirido habilidades y herramientas en cursos previos que nos permiten mejorar e implementar lo que nos falta, siempre encuentro valioso explorar diferentes enfoques para alcanzar un resultado.
Muy buen curso, muy buena Profesora Estefany pero si me hubiera gustado un par de cosas, como el que se hubiera hecho un poco mas del proyecto que al principio nos presentaron las paginas MyAccount, NotFound y no las vimos para nada y me hubiera gustado tan siquiera que estuvieramos una clase para poder hacerlas aunque sea algo sencillo.
Y el otro punto es que hace una clase se nombro que hariamos el seguimiento de la pagina para que cuando se cierre la ventana y se vuelva a abrir los datos sigan como los dejamos y eso si me hubiera gustado mucho verlo, pero igualmente muy buen curso!
Comparto mis resultados, se acepta cualquier sugerencia :3
Mi proyecto
repo
si estaría genial un laboratorio para seguir practicando lo que se puede llegar hacer un proyecto cómo este
empece el proyecto con la inspiracion de el proyecto que se hizo aca, y aunque ya termino el curso y el proyecto aqui hecho, el mio apenas empieza. lml \**nerd face\**
*aqui el sitio por si quieren ir a experimentar un poco y dejar su feedback si encuentran algo roto por ahi.*
de momento el repo esta privado quizas cuando lo termine lo haga publico.
a quien lo lea, gracias.
[*https://e-commerce-reactjs-vite-tailwindcss.vercel.app/shop*](https://e-commerce-reactjs-vite-tailwindcss.vercel.app/shop)
Me encanto este curso, una profesora excelente, las explicaciones fueron muy concisas, claras y la verdad quede muy feliz. aprendí muchísimo.
## ✨🦄 Siempre me gusta tomar los cursos de Tef porque hace las clases muy amenas y no se siente nada pesado :D
El curso estuvo muy entretenido, pero, honestamente no me gusta que en la ruta, este tan temprano, sin haber definido mejor otros conceptos de react. Tal vez sea la falta de actualizacion, pero, el mismo uso de "useEffect" es recomendado por react, no utilizarlo.
Nada, gracias como siempre teff
Excelente curso, mucho aprendizaje.
<https://app.netlify.com/sites/harmonious-brigadeiros-635bc8/overview>
Excelente curso, se entiende muy bien, faltan cositas como pruebas unitarias pero del resto super!
Buenas Profe,
gracias por el curso, me encanto hacer la tienda pero bueno le faltarían agregar cosas a mi versión, pero para un mvp (jajaja) estaría bien:
<https://shopy-primerversion.netlify.app/>
amo esta profesora. he aprendido mucho con ella desde css y ahora por acá en react. 5*super agradecido.
¡Me gusta mucho React, espero seguir aprendiendo muchos más! ¡Gracias por el curso!
Encantado con el curso. Bastante grande el proyecto que nos enseñaron a hacer. Un gusto.
Les comparto mi proyecto: <https://yotis56-shopi.netlify.app/>.
En mi caso hice algunas cosas ligeramente distintas, empezando porque usé Typescript; implementé un carrito desplegable, una mejor tarjeta de producto, que se pudieran agregar varias unidades de algún producto. Además puse una página de checkout, y un diseño distinto para las páginas de MyOrder y MyOrders.
En general quedo satisfecho con el curso, aunque a veces veía patinando a la profe un poco con las soluciones y se enredaba un poco. Buen contenido, y se genera un buen proyecto para un portafolio.
Mi parte favorita fue cuando hicimos en el router de la app una variable para poder renderizar cada uno de nuestras ordenes
Les comparto mi proyecto
<https://superb-pegasus-d604ac.netlify.app/>
Live project: <https://simple-store-vite-react-tailwind.edgardoponce.com/>
GitHub project: <https://github.com/guduchango/platzi-vite-react-tailwind>
Pro:
\* Excelente la profe como explica muy didactica
\* Los temas que se tocaron me re ayudaron con react
\* Los temas de tailwind me gustaron porque sabes que se usa por lo general padding, margin, items-centers, bg..
\* El tema de contexto mucha gente los desconoce por lo que me encanto como se trato aca
Contra:
\* Faltaron algunas cosas por hacer, pero vi que en la practica despues se hacen.
Fecha Comentario: 23/01/24
Mi twitter es @edgardo\_\_ponce, por si me quieren seguir y los sigo.
Gracias.
Me encanto mucho este curso y la forma que la profe Teff abarca el temario les comparto mi web
<https://shopioa.netlify.app/>
Me pareció interesante, pero un poquito extenso, me habría gustado que se enfoque un poco más en el consumo de la API y en funciones como: creación de usuarios, panel de administración, etc.
De todas formas construí todo el proyecto en Typescript por si acaso a alguien le interese:
https://github.com/JorgeRivadeneira/ecommerce-react
<https://tienda-de-accesorios.netlify.app>
👦༼ つ ◕\_◕ ༽つ
TS : aqui <https://github.com/xavicci/CommerceTypeScript/tree/main>
mi proyecto de react con vite
https://andres-aft.github.io/vite-react/
Hola 👋 Buenas Noches, en qué parte puedo subir mi proyecto, para certificar el curso, sólo me da la opción de presentar el exámen al undir el botón 'Certificar curso'
Hola a todos, les dejo mi proyecto, me he enfocado en avanzar la funcionalidad, el diseño es el mismo.
https://ecommerce-misterdan.netlify.app/
Este curso lo disfrute mucho, la mejor opcion para aprender es con estos cursos practicos, y cuando tienen retos mejor.
Es muy gratificante al final hacer el deploy y tener el proyecto online. Que felicidad.
Le seguire haciendo mejoras a medida que vaya aprendiendo mas cosas.
https://ecommerce-misterdan.netlify.app/
pase mucho rato, pero gracias a Dios, la profesora y mis compañeros lo pude hacer, este es el link en Github: <https://github.com/Minatox99/eCommerce-react>
aqui mi proyecto en netlify
<https://chipper-torte-424558.netlify.app/>
Este curso se aprende varias cosas pero se nota que falta una mejor guía teórica
Lo que esta bueno es que con las fallas del curso uno aprende a resolverlos y afianzar conocimientos base de react (sumado a los comentarios)
Fue mi lindo tu curso, explicas chévere, aprendí mucho. Gracias.
Agregue mas cosas al proyecto, estuvo genial aprendí bastantes cosas
<https://shop-react-tatan.netlify.app>
Este el link de mi proyecto. Ecommerce link
Muchas Gracias Platzi!
Muchas Gracias Estefany Aguilar!
Excelente curso, deberian sacar el Taller donde se finaliza el E-Comerce.
Cada que te encuentras con teff te das cuenta que no sabes CSS, gracias por el curso y la herramienta del flex-1, está muy útil
Me puse el Reto de hacer este proyecto con Next.js y TypeScript, y realmente se me presentaron varios problemas de tipado que no sabia como solucionar, porque tenia muy poca casi nada de experiencia en typeScript, hice lo mejor de mi para no copiar código y poder encontrar la solución revisando código de los demas, en las Docs y videos y entender el porque de mi problema, y eso es lo mejor saber el porque de un problema te ayuda un montón, a saber mas y de que hay muchas maneras de solucionar un problema, y es realmente satisfactorio terminar este curso y saber que puse en practica mis habilidades en React y TypeScript y que estoy avanzando a pasos escalonados.
My APP: https://e-commerce-app-mnwn.vercel.app/
GitHub: https://github.com/Lexand-dev/E-commerce-App
PD: Nunca pensé decir esto pero después de esto prefiero tener mas bugs en mis desarrollos, para mas placer. 😎
Aqui algunos Recursos que me ayudaron a terminar este proyecto:
https://react-typescript-cheatsheet.netlify.app/
https://www.typescriptlang.org/
https://nextjs.org/docs/app/building-your-application/routing/linking-and-navigating
https://www.youtube.com/watch?v=4lAYfsq-2TE&t=617s
https://www.youtube.com/watch?v=fUgxxhI_bvc
https://www.youtube.com/watch?v=L1ZSk-vPVKI
https://www.youtube.com/watch?v=_SPoSMmN3ZU&t=10196s
Muy bueno el curso , la claridad de las explicaciones excelente
Hola todos, este es mi proyecto:
https://github.com/HaroldGSH/my_E-commerce.git
El deploy con netlify me salió asi:
https://main--sparkling-tanuki-dbfc18.netlify.app
que manera de aprender cosas nuevas
Les comparto mi repo
https://github.com/RobertBass/store
Muy buen curso!!! Muchas gracias!
Acá les dejo mi pequeño repo, aun estoy arreglandoló pero va muy bien:
link:
https://ingdonovan.github.io/shopping-page/
repo:
https://github.com/IngDonovan/shopping-page
Aun me falta aprender mucho… por ende #nuncaparesdeaprender
Les comparto mi proyecto:
https://shoppi-bh.netlify.app/
Quise ir mas alla, hice logica para usarios y toda la informacion la guardo en localStorage para que el usuario pueda guardar sus direcciones, ordenes y cambiar su informacion.
Este es el repositorio:
https://github.com/JUAN-BH/simpleEcommerce
Estuvo muy genial el curso , la profe como siempre impecable… y obviamente , el laboratorio por favor !
Aquí dejo mi proyecto ya desplegado:
https://e-commerce-react-fjsb.netlify.app/
Aquí pueden acceder al código:
https://github.com/FranciscoJSB12/e-commerce-react
No es muy diferente al original pero asi me quedo.
https://new-shop-naiper.netlify.app/
Comparto el deploy de mi sitio, hecho en Typescript
Aquí está el repo
Fue un gran curso como introducción a React con Tailwindcss y Vite. Como estoy intentando ahora integrar Auth0 a mi proyecto, me gustaría que se hiciese un curso de introducción de Auth0 para React. Hay uno en Platzi, pero está enfocado en Nextjs.
Web App Store
🌐: page
¿Quieres ver más aportes, preguntas y respuestas de la comunidad?