About y Error

27/27

Lectura

Si has llegado hasta aquí… ¡Enhorabuena! Ya tienes una super aplicación Vue creada desde 0 que utiliza conceptos avanzados. Además has podido subirlo a la plataforma de Netlify y administrar las variables de entorno.

...

Regístrate o inicia sesión para leer el resto del contenido.

Aportes 19

Preguntas 0

Ordenar por:

¿Quieres ver más aportes, preguntas y respuestas de la comunidad?

Solo he leído el curso, para ahorrar tiempo en el #PlatziDay. Pero está fabuloso el curso he visto bastantes cosas que desconocía.

¿Quieres colaborar con el proyecto? Todas las aportaciones son bienvenidas. Es una buena forma de iniciarse en el mundo open source y colaborar. Para participar empieza creando una issue o un pull request en el repositorio oficial del proyecto: https://github.com/baumannzone/diablo3-vue-platzi

Añadir documentación o corregir una simple coma en un readme.md o mejorar la suite de tests… ¡cualquier aportación es válida!

Listo!, quedo el proyecto. En este momento solo me estoy enfocando en aprender React y por lo tanto, he hecho este curso en react jajaja. Un curso muy completo, me ha hecho leer mucha documentación y aprender mucho.
Aquí dejo el link a la app
Aquí el repositorio de github

Cualquier sugerencia o comentario es bienvenido!

Jorge muchas gracias por este gran curso, me a aportado mucho, me ayudara mucho mi en crecimiento profesional !!!

jejeje finished el curso, gracias viejo

https://diablo3-sfsuser.netlify.app/

Me hubiera gustado ver algo rapido de testing 😦 .

Excelente curso! les dejo el mio DiabloIII y espero poder colaborar al proyectos en estos dias.

Que genial, todo salió perfecto y aprendimos un monton en el camino.

Muy buen curso, me gustó la manera de abordar los temas en escrito pues es más fácil regresar a resolver dudas 👌

Como añadido le agregue un poco de TypeScript y un plugin para Vue 2 donde usamos la nueva Composition API, aquí les dejo el repositorio: https://github.com/manuelojeda/d3pf

Hice un pull request al repositorio original. Es algo sencillo pero espero sea de ayuda 😊

Hoy he aceptado otro Pull Request de otro estudiante. Ya somos 3 😄

https://github.com/baumannzone/diablo3-vue-platzi

Excelente curso, realmente me encanto, muchas gracias por todo el conocimiento. Me gustaría que hubiera uno sobre las PWA con Vue.js, seria genial

Estaba esperando la parte de Testing 😢

Listooo!!! Tarde mucho realmente en terminarlo porque estudio despues de trabajar por las noches pero esas dos horas diarias que le pude dedicar realmente pude aprender mucho y practicar lo que ya sabia, 10/10 este es el resultado <https://diablo3.netlify.app/> y aqui mi repo. <https://github.com/JohanDev115/Diablo3> THanks a mil

He terminado el curso, y he pasado el proyecto de Vue 2 a Vue 3.

De Webpack a Vite, de Options Api a Compostion Api, y de Vuex a Pinia.

Comparto mis resultados:

Vue 2: https://github.com/carlosmperilla/Diablo3-API-Vue-v2

Vue 3: https://github.com/carlosmperilla/Diablo3-API-Vue-v3-

Si quieren hacer el curso en Vue 2 y pasarlo a Vue 3, sepan que se puede, si quieren hacerlo en Vue 3 con Composition, tambien los invito a probar.

Hay que aprovechar el formato de texto.

¡Mucha suerte!

Excelente curso la lectura fue fácil de seguir y entender.

https://vue-diablo3-app.netlify.app/

https://github.com/gustperx/vue-diablo3-app

En mi caso use construí la aplicación Usando Vue 3 + Composition API + TypeScript + TailwindCss

Fue muy entretenido y educativo seguir el curso aplicando este stack

Logre corregir el problema de mostrar las imágenes de los items del hero en netlify, para esto cree un “composable” de vue 3 (parecido a los hooks de react) y agrupe todas las llamadas a las imágenes (para hacer más fácil modificaciones si cambia algo del API de blizzard).

La solucion fue aplicando esto:

https://markus.oberlehner.net/blog/using-netlify-redirects-to-proxy-images-hosted-on-a-third-party-image-provider-or-a-headless-cms/

Que gran curso profe muchas gracias definitivamente fue un curso avanzado y se sintio asi todo el tiempo espero hayan mas cursos asi
https://vuediablo3.netlify.app/

Increíble! Seguí el curso paso a paso, curioseando, toqueteando aquí y allá, me encantó mucho, sobre todo porque te da la idea de cómo estructurar y hacer un proyecto verdaderamente profesional con Vue, como dividimos todo en componentes y carpetas, es genial.

Otro plus (para mi) es que nunca, NUNCA usaré Stylus para ningún proyecto xD Pero al menos puedo decir que he hecho un proyecto usando Stylus:D! Aunque lo use aquí no me terminó de convencer Stylus, me gusta más usar llaves y comas y puntos y comas.

Aunque en la vista de heroes no se muestran las imágenes (En la aplicación en producción), en general el proyecto me pareció genial, me tomó mucho tiempo completar este curso (En realidad solo fueron 2 días pero Vueno) me tomé mi tiempo para leer y entender bien todas las clases, y la modalidad escrita me parecio genial!😄

👉 Recuerda, estoy esperando ver tu diploma en twitter (https://twitter.com/baumannzone) o en instagram (https://www.instagram.com/baumannzone/). Consíguelo y dame un aviso por las redes. 👈

Abre la página de About en el navegador, deberías verlo así:La página de error es bastante sencilla también. Como recordarás, cada vez que teníamos un error, guardabamos toda la información del error en el Store de nuestra aplicación (Lo puedes ver en: /store/modeules/error.js)Pues bien developer, lo único que hay que hacer es recuperar los datos del Store y mostrarlos en la vista de Error, /src/views/Error/Index.vue:Con los comentarios hemos explicado bastante bien lo que hace cada parte, pero hay una que no hemos visto durante el curso. Es el guardian de ruta beforeRouteLeave.> 📗 Puedes leer más acerca de los guardianes de ruta aquí: https://router.vuejs.org/guide/advanced/navigation-guards.html#in-component-guardsLos route guards pueden ser utilizados a nivel local de componente, como en este caso, y a nivel global, en el archivo donde tienes las rutas, router.js.El guardián de ruta (route guard) beforeRouteLeave se ejecuta justo antes de que la ruta que renderiza el componente vaya a cambiar. En ese momento seguimos teniendo acceso al this, por lo tanto es el momento perfecto para limpiar o liberar recursos.En este caso, lo que nos interesa el limpiar el mensaje de error de Vuex (haciendo la llamada al mixin con el valor null), ya que si no lo limpiamos al salir, va a estar ocupando sitio en nuestro Store inútilmente.Para forzar el error y poder ver la página de error puedes borrar o renombrar las variables de entorno y volver a lanzar el proyecto. Cuando intentes obtener el perfil de un jugador te saldrá este error:Error 401, no autorizado (ya que no hemos conseguido el token de acceso), junto con los parámetros de búsqueda:BattleTag: SuperRambo-2613Región: EUPrueba a obtener otros errores y comparte tu resultado en el sistema de mensajes. Un error puede ser pedir los datos de un usuario (BattleTag) existente con una región incorrecta. ¿Que error te da? ¿Qué te aparece en pantalla? ¿Crees que ese mensaje de error es correcto? Explica tu respuesta en el sistema de comentarios.DespedidaAhora sí, el curso ha llegado a su fin. Espero que lo hayas disfrutado tanto como yo y que hayas aprendido mucho. Si has ido haciendo paso a paso todo lo que se ha explicado durante el curso, me gustaría ver tu versión de la aplicación. Comparte tu enlace de Netlify para que podamos verlo todos 🤩.Para cualquier consulta o sugerencia (¡Todo el feedback es bienvenido!) ya sabes que puedes usar el sistema de comentarios de la aplicación o buscarme en las redes. Te recomiendo que utilices el sistema de preguntas y respuestas, para así (además de conseguir puntos) ayudar los demás compañeros que puedan tener las mismas dudas que has tenido tú. Anímate, y pregunta siempre que lo consideres oportuno.Por último, me gustaría decirte que el repositorio oficial de la aplicación siempre estará abierto a mejoras o nuevas ideas de hacer las cosas, por lo que si te ves con ganas, siempre puedes hacer un Pull Request, y con ello, ganarte el aparecer en la lista de contributors de la aplicación 😍. Suena bien, ¿verdad? ¡Espero tu participación!👋 ¡Hasta la próxima!", "url" : "https://platzi.com/clases/1856-avanzado-vue/27772-about-y-error/", "wordCount" : "52", "publisher" : { "type" : "Organization", "name" : "Platzi INC" } }