Repaso, recomendaciones y tips para seguir aprendiendo

Haciendo el proyecto de pokemonApi, aunque apenas lo estoy empezando.

![](

Yo lo hice con mi API de LOL y así quedó (si tarda un rato en cargar es porque se está levantando la API en Heroku) https://luislirac.github.io/spa-lol/

Si estás siguiendo esta ruta de aprendizaje te recomiendo no tomar los cursos de algún framework sin tener las bases de Javascript.
El curso de Fundamentos de Javascript puede ayudarte a familiarizarte más con lo aprendido en este curso.

Es increible al nivel que se puede llegar teniendo claro todos los conociminetos aplicados de los distintos cursos, excelente profesor, muchas gracias por este excelente curso

Para no utilizar Travis, solo compilen y suban ese compilado. No se hagan problema con Travis.

Hey gente, yo realice un proyecto donde utilizo una API de los países del mundo. Ademas de navegar sin un Full Reload también podrás navegar entre cada país para ver sus detalles.

solución en vivo: https://anfer-code.github.io/countries-api/#
repositorio: https://github.com/anfer-code/countries-api/

Dentro de la sección de los detalles podrás navegar a los países vecinos del que seleccionaste.
.
También hay un input el cual te llevará al país que quieras ver. Y por ultimo podrás desde el home podrás hacer un filtrado de los países por su región.
.
Cualquier Feedback es bien recibido 😄

Buenas a toda la comunidad, les comparto mi proyecto:
POKEapi-SPA
Quise consumir una nueva api para retarme a mi mismo, y bueno como me gusta la saga de Pokémon decidí baserme en una de las APIs que hay, en este caso use pokeapi. Para el deploy use github actions el cual es una buena alternativa a Travis, y al ser de GitHub su incorporación es más sencilla. El archivo que use para configurar y otras cosas más las pueden encontrar en mi repo: POKEapi-SPA repositorio

Excelente curso, rumbo a aprender travis.

estaría bueno que mejoren el curso

Con este curso entendí mucho mejor el uso de Webpack y el consumo de una API. Excelente 💪🏽

Un curso increbíble, aorendí muuuuchas cosas nuevas, en especial a usar Travis! Tuve complicaciones el al final ya que no me mostraban los estilos en el github pages y era que el href del archivo css en el index estaba mal y bueno cuando modifiqué el dominino en github pages mi sitio despareció no se por qué pero bueno a pesar de esto todo increíble!
Me sale esto:

estuvo genial este curso

excelente curso.

Me gusto mucho el curso! gracias

Estaría bien un curso especializado de travis

Muy buen día, si quieren publicar su proyecto utilizando Vite, solamente asegúrense de seguir estos pasos
.
Si estás publicando tu proyecto Vite en GitHub Pages y estás experimentando problemas con las URL estáticas de tus archivos CSS y JS, es posible que necesites ajustar la configuración de ruta base en tu proyecto Vite.
.
Aquí hay algunos pasos que puedes seguir para solucionar el problema:
.

1. Abre el archivo vite.config.js en la raíz de tu proyecto Vite.
   .
2. Dentro del archivo vite.config.js, busca la opción base y asegúrate de que esté configurada correctamente. Por ejemplo, si tu repositorio de GitHub Pages se encuentra en https://tathatahy.github.io/, la opción base debería ser /.
   .
3. Actualiza la opción base para que coincida con la ruta base de tu proyecto de GitHub Pages. Si tu repositorio de GitHub Pages se encuentra en un subdirectorio, asegúrate de incluir el nombre del subdirectorio en la opción base. Por ejemplo, si tu repositorio de GitHub Pages se encuentra en https://tathatahy.github.io/mi-proyecto/, la opción base debería ser /mi-proyecto/.
   .
4. Guarda los cambios en el archivo vite.config.js.
   .
5. Vuelve a compilar y vuelva a publicar tu proyecto Vite en GitHub Pages utilizando el comando adecuado. Por lo general, el comando será npm run build para compilar y generar los archivos estáticos en la carpeta dist, y luego puedes utilizar una herramienta como gh-pages para publicar la carpeta dist en GitHub Pages.
   .

Al ajustar la opción base en la configuración de Vite, aseguras que las URL generadas para los archivos estáticos (CSS y JS) sean correctas y coincidan con la ruta base de tu proyecto de GitHub Pages. Esto debería resolver los errores 404 que estás experimentando al cargar los archivos CSS y JS en tu página.

.
Ejemplo de cómo crear el archivo vite.config.js para tu proyecto Vite con la carpeta base “cientifico-vite”:
.

1. En la raíz de tu proyecto, crea un archivo llamado vite.config.js (asegúrate de que el nombre y la extensión sean correctos).
   .
2. Abre el archivo vite.config.js en tu editor de texto preferido.
   .
3. Agrega el siguiente contenido al archivo:

import { defineConfig } from 'vite';

export default defineConfig({
  base: '/cientifico-vite/',
});

1. Guarda los cambios en el archivo vite.config.js.
   .
   Ahora, cuando construyas tu proyecto Vite usando el comando npm run build, los archivos estáticos generados tendrán las rutas adecuadas que coincidirán con la carpeta base “cientifico-vite”. Asegúrate de ajustar el comando npm run build y cualquier otro proceso de implementación según tus necesidades específicas.
   .
   Recuerda que también debes asegurarte de configurar correctamente la opción homepage en tu archivo package.json para que coincida con la carpeta base de tu proyecto de GitHub Pages. Por ejemplo:

{
  "name": "cientifico-vite",
  "homepage": "https://tathatahy.github.io/cientifico-vite/",
  // Resto del contenido del archivo package.json...
}

.
Guarda los cambios en el archivo package.json y, a continuación, compila y publica tu proyecto en GitHub Pages. Los archivos CSS y JS deberían cargarse correctamente sin errores 404.
.
Espero que esto te ayude a solucionar el problema con las URL estáticas en tu proyecto Vite al publicarlo en GitHub Pages.

Este es mi sitio para que le echen un vistazo
https://singlepagedannygalvan.netlify.app/

Saludos,

Estuve haciendo una app para un cliente, y quise aprovechar este curso con lo que debia hacer. Ya tenia mi API creada en Laravel(aprovechando el curso de Api en Laravel). E hice integración de tecnologías. Fue un camino largo y difícil pero logré hacer mi primer deployment en un servidor. Gracias Platzi :3

Es la primera vez que tomo el curso, y me pareció muy práctico.
Recomiendo dos cosas: Uno, ir tomando el curso junto al nuevo de Webpack ( Actualizarse sobre Wbpack); Dos, no abandonar el curso porque, esté desactualizado. Creo que, lo mejor es ir buscando cómo solucionar lo que le falta o no tiene el curso. Les prometo que, les ayudará mucho (recomendación para los que estásn aprendiendo javascript).
Gracias Platzi.
Gracias óscar Barajas.

Aquí mi proyecto con la API de Pokemon.

Live Site

😄 Este curso estuvo genial 😃

niiice https://levelstudiomx.github.io/cientifico/
siguiente reto: intentare con otra APIy diferentes estilos

Al fin haciendo deploy a mi proyecto: 😀
https://samueldazadaza.github.io/cientifico/ con Tailwind
Se siente genial poder cumplir el reto: 😄

api: https://www.thecocktaildb.com/

Hice mi proyecto con la API de Pokémon, pero se me complico un poco y tuve que guiarme de otros proyecto. Este lo hice desde cero haciendo uso de las notas que hice en notion y directamente en los archivos
Link

También modifiqué un poco el proyecto del curso
Link

#NuncaParesDeAprender

Espero su feedback gente ☺

Les comparto como quedo el mio, lo hice sobre peliculas con el API de richard en el curso profesional de JS, tambien implemente el responsive para que sea visible en otros dispositivos.
https://kevjim.github.io/PelisTendencia/

https://salaxer.github.io/100tifi.co/

Mi proyecto terminado, solo le hace falta configurar bien el DARKMODE

Aqui les dejo mi pagina, no se como colocar imagenes desde mi pc a los comentarios de platzi :c

Alguien puede indicarme en que parte del curso se dice que async y await es implementado en ECMAScript 8?

Buenas les dejo 15 proyectos que hice con vanilla js que son basico.
les dejo mi repo : https://github.com/FedeHerrera10/projectsVanillaJS

Este fue el resultado final de mi proyecto.
https://santiagoquinteroguarin.github.io/Scientific-SPA/

Me resulto tan complicado este curso, lleno de errores, bugs, versiones erróneas, no compilaba, etc, al final de repetir 3 veces todo me funciono, les dejo mi live: https://andresfgz.github.io/RicknMortySPA/

Gran curso práctico desde la configuración del proyecto hasta el deploy, el profesor explicó cada caso de uso detallando el como y el porque. Ahora toca profundizar los conceptos vistos aqui.

Qué genial este curso, Óscar. Aprendí mucho, seguramente hay que practicar más para lograr crear más SPA. Gracias por compartir.

Increíble curso, me encanto como fue desarrollado.
Lo valioso es como aplicamos tanto en un proyecto pequeño para poderlo replicar en proyectos mas grandes.

Excelente curso, muy corto y preciso!!!

excelente estoy siguiendo la carrera con mas cursos en platzi

Gran curso muy interesante aprendí mucho.
Ahora vamos por React !!!

Ufff genial el curso. Gracias.

Excelente curso con un gran profesor 👏👏. Ahora me queda continuar con la culminación de la carrera de React 👨‍💻🏃‍♀️🏃‍♀️.

Muy buen curso, aclaré varias dudas que tenía sobre vanilla JS, enhorabuena para el profesor.

Sé que este es un curso básico pero estaría bueno poder manejar peticiones que traen muchos más elementos en este caso personajes para saber de qué manera manejarlos para que el performance de la aplicación no baje.

Estimados compañeros, me pueden recomendar el lenguaje y la forma de hacer una API…? Actualmente uso solo APIREST con java + spring boot. Pero gustaria aprender una mejor tecnologia que me permita hacer lo mismo y mas profesional. Alguna sugerencia compañeros y profesor (@gndx)

Un buen curso, adjunto el link del proyecto que hice: https://leoramosa.github.io/project-spa/

El curso me pareció muy interesante. Me enseñó:

• el uso de string literals
• cómo funcionan el hash navigation
• Travis CI

Muy práctico, a seguir con el siguiente nivel.

Eres el mejor @gndx

super, me estrese un poco a lo ultimo ajajaj, pero todo salio perfecto 😄

Excelente curso, muchas gracias!!!

Este es el link de mi proyecto: https://csswoman.github.io/100tifico/
Aún me falta hacer modificaciones de los estilos, pero todo muy bien 😁

Curso terminado en un día! A por el badge puntoycoma!

¡Excelente! ¡Este curso estuvo muy interesante y con mucho conocimiento adquirido!

Estuvo genial el curso, muchas gracias 💚

El término vanilla hace referencia solo a JS para código puro? o se puede utilizar vanilla en cualquier lenguaje de programación?

100tifico

Alguien sabe porque la ruta sale así https://mauroquinteros.github.io/spa-vanillajs/#/2/
a mí me gustaría configurar la ruta para que salga de este manera https://mauroquinteros.github.io/spa-vanillajs/2 que se me hace más sencillo para el usuario.
Espero que alguien me ayude soy nuevo en esto

Gracias Oscar por el Curso!! 😃

Buen curso!
https://cristhianc9.github.io/cientifico/

Excelente, a seguir practicando, gracias

acá el mio:

https://luhesaga.github.io/cientifico/

Este curso esta muy chido
Ahora ya se como funciona esto de las SPA 🥴🥴

Genial el curso! Terminé y me encantó. Aprendí muchas cosas gracias al profesor.
https://salme92.github.io/Example-API-Rick-And-Morty-SPA/

Que genial curso! Les dejo mi repo quiero mejorarlo y usar esta clase para otro genial proyecto.
https://daniellazarte.github.io/spa-100tifico/

Excelente!

https://100tifi.co/

Muchas gracias por las enseñanzas y consejos compartidos sobre SPA en JavaScript instructor Oscar y demás miembros de Platzi.

Este es mi proyecto
https://mauroquinteros.github.io/spa-ricky-and-morty/

2da vez por aquí y me siento mucho más cómodo!
https://github.com/gonzalopimentel
https://gonzalopimentel.github.io/Single-Page-Application-VanillaJS/

El resultado de este gran curso

Preview

Cards

Qué curso tan bueno! De los mejores y más intuitivos que he tomado. Aplicaré estos conceptos para jugar con más APIs.

https://aaron-fabricio-sc.github.io/RickandMortySpa/

mi proyecto.

Aqui el mio, me vuela la cabeza la integracion continua con travis, muy completo el curso

Curso muy teso, se cubren todos los aspectos de un SPA desde babel hasta Travis, en algunos puntos se necesita conectar con otros cursos pero te deja listo para cualquiera de las 3 fw que menciona Oscar. Hay muchas cosas que logre sacar adelante a partir de los comentarios, no esta demas darles una revisada siempre.

Excelente curso 👌!! Siempre es un gusto tomar cursos con el profesor Oscar Barajas 😃

Para tener en cuenta en el archivo de rutas VSCode indicaba que el keywork await estaba demas, y si lo sacas te da error por que es una funcion async. Luego entendi que no era un error sino que indicaba que await no tenia utilidad por que la funcion que esperaba no era una promesa.
En resumen await trabaja con promesas.

Asi quedo mi proyecto, le agregue estilos y la funcionalidad de filtrar por especie,genero y status.
Modifique colores, fuentes y un poco de responsive.

Les dejo mi repo por si se quieren pasar:
https://github.com/FedeHerrera10/Curso-SPA-VanillaJS

Done!
https://paolojoaquin.github.io/curso-spa/

Hace varios meses inicié este curso y en la clase 5 me di cuenta que no tenía el conocimiento necesario para tomarlo, entonces regresé a seguir la ruta de JavaScript, tomé el básico de React y Vue para entender como funciona una SPA. Ahora lo estoy terminando y me siento muy bien porque entiendo lo que acabo de aprender. Gracias Oscar.

Quise hacer esta SPA con la API de pokemon,y en cada Character le agregué un efecto 3D, de repo (https://github.com/amaurysg/SPA-PokeApi) e imagenes

El curso ha sido una buena experiencia de aprendizaje. Agradezco al profesor Oscar su esfuerzo.

Muy Buen curso, Muy practico, facil y sencillo para los que apenas estamos empezando

!!

f

Excelente curso, cortitos y al pie con excelente explicación!, ME ENCANTO!, me gustaría que haya una opción de verlo todo seguido, ósea que este por partes o una opción que dure la hora entera!, seria un golazo!

Estuvo muy bueno hay que profundizar aún más para poder captar todo