Cristian Leonardo Acero Mancipe
Diego Mauricio Parrado Cardozo
Alvaro Eduardo Garzón Pira
Maria Gabriela Rodriguez Cuevas
Alejandro Sebastian Dubon Estrada
Jheyner David Ibagon Cuenca
Alvaro Eduardo Garzón Pira
Carlos Machado
Arian Daniel Benjamin Goicochea
Ramiro Godoy
César Augusto Cortés Labrada
Christian Eduardo Figueroa Sandoval
Fabian Bejarano González
Francisco Ponce
Fabian Bejarano González
Nicolás Goux
Raycris Maldonado
Alvaro Eduardo Garzón Pira
Juan Luis Medina Coelho
Carlos López
Tahiris Goliat
Oscar Barajas Tavares
Carlos Quesada Díaz
N40 M10
JOSE DAVID OROZCO CASTAÑEDA
Jair Daniel Lozada Mariño
Miguel Ángel González Jimenéz
Víctor Esteban Cómbita Daza
Diego Fernando Mera Largo
Bryan Josue Vivanco Silva
Jhon Freddy Paz Guzman
Christopher William Flores Rimac
Shuriko Alzate
Shuriko Alzate
Sergio Javier Lopez Olivera
Andrés Felipe Cubillos Ospina
"Nunca paremos de aprender"
aqui tamos!!!
@Ikal...
Fuera de memes o bromas, el mensaje de "Nunca pares de aprender" es algo más significativo que solo acabar todos los cursos o si te mueres, si te mueres pues nada, al menos hasta el día de tu muerte aprendiste algo nuevo cada día, en este mundo no hay nadie, absolutamente nadie que lo sepa, por lo que si acabas todos los cursos pues super, felicidades campeón, pero tienes más cosas por aprender de otros temas que quizás no sean de tanta atención como cocina, mecánica, carpintería, entre otros; Solo toma esa frase con más calma, no hay que ser el aguafiestas de los comentarios. :)
🖨️ 𝗖𝗹𝗮𝘀𝗲 #𝟭𝟵: 𝗗𝗲𝘀𝗽𝗹𝗲𝗴𝗮𝗻𝗱𝗼 𝗲𝗹 𝗽𝗿𝗼𝘆𝗲𝗰𝘁𝗼 🖨️ . Debemos hacer la inserción de content para tenerlo visualmente, justo antes de catch:
content.innerHTML = view; //innerHTML es igual a la vista que se ha creado e itera con el metodo map y devuelve un nuevo arreglo con los elementos que queremos obtener como el título, la descripción, la imagen miniatura de la API
Para el catch, se debe agregar la estructura (podemos editar la salida como queramos):
catch (error){ console.log(error); //en caso que de que haya un error el catch lo captura e imprime qué tipo de error devolvió }
Para conectar el index con el main, se agrega un script con la raíz del proyecto:
<script defer src="./assets/main.js"></script> <!--cuando ésto se ejecute en el navegador, va a leer el archivo main y asignar en memoria c/u de los elementos API, options (la lógica del código).-->
Es importante colocar la palabra defer:
++Defer++ es un atributo ++booleano++.
Solo debe usarse si hay un script externo que lo contenga src
El script se descarga en paralelo al análisis de la página y se ejecuta tan pronto como esté disponible (antes de que se complete el análisis). Fuente: aquí .
Se ejecuta el index.html con la extensión Live Server y debe aparecer la landing con todos los elementos de forma correcta.
Con la herramienta Inspeccionar del navegador (dar click derecho a la página y buscar Inspeccionar), nos permite analizar cuáles son los posibles errores arrojados por consola (Console) y si se selecciona la pestaña Network, se puede visualizar los servicios y conexiones a la API en vivo.
Una vez que estemos satisfechos con la landing, se procede a subir el código a un servidor, en éste caso a Github.
Para el ++deploy++ se hace la implementación de Github pages (mostrar nuestro código html dentro del repositorio).
Vamos a consola para instalar el paquete con: npm install gh-pages --save-dev-
Agregar en el archivo package.json el script (editar el apartado “test”):
"scripts": { "deploy": "gh-pages -d src" },
Se crea una nueva rama en el repositorio y se habilita para su publicación. Para ello primero se debe actualizar los cambios al repositorio antes del deploy, en consola para conocer el estado del se proyecto: git status
git commit -m “[ADD] files”npm run deploy que ejecuta un comando de gh-pages para la subida de una rama y que luego se pueda mostrar como una página web.Settings, en el panel izquierdo entrar a Pages, automáticamente nos muestra la url para ver nuestra landing y compartirla a otros.En esta clase del curso profesional de javascript explican como es que llega un script al navegador en el caso de defer se va a ejecutar Javascript hasta el final, es decir luego de que se cargue todo el documento.
Es verdad, explica muchas cosas, pero a un nivel intermedio avanzado; lastimosamente no tuve empatía de conexión en aprendizaje con él, es muy bueno, pero creo que para la parte académica NO, se aleja a muchos profesores en su metodología de enseñanza y para este tipo de curso que es muy avanzado y útil NO logre aprender y entender muchas cosas, con él llegues hasta el 50% de su curso lo abandone y seguí en la ruta de aprendizaje para REACT pues sentí estancamiento. Saludos
Es muy interesante lo que indicas Jheyner, supongo que eso pasa con unos, otros como yo me sentí muy bien con este profesor, es cierto que en ocasiones no es tan bueno al momento de explicar diversos temas pero él me ayudó a resolver dudas, no he acabado el curso pero si he visto que mucha gente se queja de él, te invito a que le des otra oportunidad al profesor ;) Y que tengas el título de cada clase como tema a investigar por aparte, para que el profesor solo te resuelva dudas.
Luego de haber pensado mucho decidí adaptar con esto una web tributo a Lovecraft que tenía guardada, los videos quedaron en la última secci´n con la opción de ir a ellos directamente
Una bestia!
Quiero avisar que está caído el link para hacer el desafío
Si, y sigue caído a la fecha.
También he estado intentando pero aún no hay acceso a ese enlace.
No he logrado que funcione. En mi caso la consola afirma que videos.items no está definido, por lo que asumo que el llamado a la API no está sirviendo.
Hice debugging con un console.log dentro de la función fetchData y el resulto de data es un objeto que dice 'You are not subcribed to this API'. ¿Para usar esta API en especifico hay que pagar la dub premium de RapidApi? Se me hace raro porque en la pagina dice que la API es 'Freemiun'.
Podría ser que no le diste clic en el botón de suscribir en la página donde estábamos testeando la API, hay que dar clic en ese botón y posteriormente elegir la capa freemium $0. Te limita a unas cuantas peticiones diarias, pero sí funciona para resolver el proyecto del curso gratis. Es lo que se me ocurre por el error que mencionas.
Aunque si no funciona, igual podría ser otra cosa y en ese caso, sería cool si pudieras compartir tu código para que entre todos te demos un manito.
Uuu, si, tienes toda la razón, no le di a la suscripción gratis. ¡Ya está sirviendo! ¡Muchas gracias!
Realice un proyecto desde cero utilizando html, sass y js. El proyecto se basa en utilizar la API PokeApi para obtener de manera aleatoria un pokemon, mostrar sus imagenes y los detalles del mismo. Dejo el enlace al GitHub Pages https://nicogoux.github.io/Find-your-pokemon-app/
Para el reto, utilice la libreria que se llamam sweet alert es muy facil de usar, se las recomiendo, aqui les dejo el link https://sweetalert2.github.io/#examples
Que gran aporte, ¡Gracias!
Parece que por alguna razón no puedo consumir las APIs. Al cargar la pagina me sale un error en el GET que dice 403, lo que parece significar forbidden, o sea que no tngo permitido el acceso. Es muy raro porque revisé otros proyectos poesteados en los comentarios y parecen no tener problemas consumiendo las APIs de youtube u.u
me pasaba lo mismo, se soluciona seleccionando la suscripción gratis, saludos
Tengo una duda, que quizás tenga una respuesta obvio. En caso de que exista un nuevo video en la lista, se mostrara automáticamente sin necesidad de refrescar la pantalla?
No, tendríamos que crear un hook para notificar, en la API de Youtube es posible hacerlo.
Hola! Aquí les dejo mi versión 1.0. Apliqué el dark mode en Tildwindcss y capté el vídeo de YouTube que tengo en uno de mis canales. Mi reto es ahora usar la API de Pinterest para insertar mis proyectos.
!Porfolio Darkmode 1.0
Algo molesto de la metodologia del profe es que asi sea algo sencillo no lo explica asi sea por encima como el defer.
dejo una explicacion rapida
Es posible que la solución que te hayan sugerido sea utilizar el atributo "defer" en la etiqueta del script en el HTML. El atributo "defer" se utiliza para diferir la ejecución de un script hasta que se haya cargado completamente el documento HTML, lo que significa que el script se ejecutará después de que se hayan construido los elementos HTML de la página web. El error "Cannot set properties of null (setting 'innerHTML')" se produce cuando intentas establecer la propiedad "innerHTML" en un elemento que aún no ha sido creado en el DOM (Document Object Model). Si colocas el script que intenta acceder al elemento antes de que se haya creado el elemento en el HTML, se producirá este error. Al utilizar el atributo "defer" en la etiqueta del script, le estás indicando al navegador que diferirá la ejecución del script hasta que se haya construido completamente la página web, lo que garantiza que los elementos HTML que se intentan acceder ya existan en el DOM. Por ejemplo, puedes agregar el atributo "defer" en la etiqueta del script de esta manera: php Copy code <script src="tu-archivo.js" defer></script> De esta manera, el script se ejecutará después de que se haya construido la página web y se hayan creado los elementos HTML que se intentan acceder, lo que evitará el error "Cannot set properties of null (setting 'innerHTML')".
creo que tambien funciona si se coloca el script al final antes de cerrra la etiqueta body
Mi proyecto: https://vcombitad.github.io/async-landing/
Aqui dejo humildemente mi aporte, en mi caso, consumi la API de studio ghibli, la puedes encontrar aqui si deseas probar tu tambien!: https://ghibliapi.herokuapp.com/#section/Base-URL
y aqui esta el resultado de mi poryecto: https://sora-san-df.github.io/Project-CV/
y slgunas fotitos! c:
hola me sigue sin mostrar los videos en mi landing, tengo ese mensaje en consola: {
"message": "Invalid API key. Go to https:\/\/docs.rapidapi.com\/docs\/keys for more info."
}
los datos de la api-key y de api-host estan bien escritos, alguien me puede ayudar?
me sale exactamente el mismo error XD:
{"message":"Invalid API key. Go to https:\/\/docs.rapidapi.com\/docs\/keys for more info."}
Hola me llego un correo "GitGuardian has detected the following RapidAPI Key exposed within your GitHub account." saben que significa ?
Hola, alguien me puede decir porque no me sale mi pagina publicada? El link que me da github me manda solo esto :( T---T:
y ya subí todo al repositorio...
Saludos Shuriko, probablemente tenga que ver con las siguientes razones que le presenté a un compañero:
Esas son las que se me vienen a la mente en estos momentos.
Muchachos para los que les sale el error de que no cargan los datos de la API, es facil la solucion: La pagina Rapid de consumir Apis no te deja si no estas suscrito a algun plan, deben tomar el plan gratuito y ahi si se cargan los datos en nuestra landing page, a mi me funciono 🥳🥳
en caso de que no sea eso revisen el codigo debe haber algun error