Por defecto, el idioma en que nos devuelve las categorías es en inglés. Para mostrar las categorías en español, después de la API Key es necesario agregar
&language=es
para que los nombres de las categorías aparezcan en español. La URL completa debe quedar similar a esto:
https://api.themoviedb.org/3//genre/movie/list?api_key=<TU_API_KEY>&language=es
Les comparto por el momento esta de esta forma cargando las categorias y tendencias
hola, tuve un problema con lo que pasaba era esto:
este era el código:
y encontré esta solución con css grid:
y este es el codigo:
Mi aporte con el repositoio github:
Mi respositorio
Así va quedando mi proyecto.
Este es el repo.
Desktop:
Mobile:
Bueno, asi quedo mi versión de categorias, lo realizé inclusive antes de terminar de ver la clase completa y me salió a la primera :)
yo lo llevaba asi pero viendo que son muchas categorias me tocara rediseñar mi menu de categorias...
Hardcodear es escribir código que deberia ser automatizado o código que debería ser obtenido por el usuario final y no por el desarrollador
esta es la manera correcta de agregar las categorias en idioma español:
async function getCategoriesPreview() {
const res = await fetch ('https://api.themoviedb.org/3/genre/movie/list?api_key=' + API_KEY + '&language=es');
}
Así va quedando el mio!
Hiram Rodriguez Gomez
Por defecto, el idioma en que nos devuelve las categorías es en inglés. Para mostrar las categorías en español, después de la API Key es necesario agregar
&language=es
para que los nombres de las categorías aparezcan en español. La URL completa debe quedar similar a esto:
https://api.themoviedb.org/3//genre/movie/list?api_key=<TU_API_KEY>&language=es
Jonathan Guidi
Buen aporte! Gracias!!
Christopher David Erazo Herrera
Les comparto por el momento esta de esta forma cargando las categorias y tendencias
oscar Ivan Toro Gonzalez
que poder mi bro como lo hiciste?
maximo galarza
hola, tuve un problema con lo que pasaba era esto:
este era el código:
y encontré esta solución con css grid:
y este es el codigo:
Josue Cerron Tuesta
Gracias!
Brandon Argel Verdeja Domínguez
Así va quedando mi proyecto. Este es el repo. Desktop:
Dario Paladines
Bueno, asi quedo mi versión de categorias, lo realizé inclusive antes de terminar de ver la clase completa y me salió a la primera :)
Juan Castro
Profesor:clap:
Jorge Garcia
yo lo llevaba asi pero viendo que son muchas categorias me tocara rediseñar mi menu de categorias...
Jesús Emmanuel Jimenez Brito
Hardcodear es escribir código que deberia ser automatizado o código que debería ser obtenido por el usuario final y no por el desarrollador
Diego Iberri Ramírez
esta es la manera correcta de agregar las categorias en idioma español:
async function getCategoriesPreview() { const res = await fetch ('https://api.themoviedb.org/3/genre/movie/list?api_key=' + API_KEY + '&language=es'); }
Diego Eduardo Téllez Contreras
Así va quedando el mio!
Rigoberto Maldonado
Vamos genial. Comparto mi avance..
detalles y ya.
Cayo Legal
Yo creo que es mas eficiente usar textContent o innerText en vez de TextNode
Juan Castro
ProfesorPerfectamente válido :D
Gonzalo Tomas Orlando
Walter Marvin Rodriguez Sanchez
excelente clase
Cristian Paiva
Que lindo se esta poniendo este curso. No esperaba menos de JuanDC!!! Gracias maestro :)
Eduardo Rodriguez Yapur
José Luis Encastin Flores
Aguas con dejar tu API_KEY bro, en openSource no pasa nada, pero en APIs como las de google te pueden endeudar en un rato.
Christian Velázquez
Lo único que le agregué de más fie en la "API_KEY", el lenguaje ( Español)
David Guerrero Diaz
Christian Velázquez
Gracias por tu aporte. Me faltaba un "id", para que me salieran los colores.
Jorge Campero
Una pregunta, en el codigo de CSS como supo juan que ID llevaria cada categoria, que procedimiento tomo para saber la informacion?
Juan Castro
ProfesorIr categoría por categoría recolectándolos manualmente No es lo mejor, idealmente debería haber un endpoint para consultar todas las categorías con sus respectivos colores
Gilbert Ardila
me hago un apregunata, me puedes explicar la diferencia de insertar el texto en el h3 usando createTextNode o innerText, gracias
Juan Castro
ProfesorMira esta comparación: https://www.geeksforgeeks.org/difference-between-textcontent-and-innertext/
Gilbert Ardila
ohhh, entendido!!
Otra forma de realizar la funcion getMoviesCategories:
async function getMoviesCategories(){ const res =await fetch(`https://api.themoviedb.org/3/genre/movie/list?api_key=8usda933asdahhreew33423`); const data=await res.json(); console.log(data); categories=data.genres; console.log(categories); categories.forEach(category => { const categoryContainer=` <div class="category-container"> <h3 id="id${category.id}" class="category-title">${category.name}</h4> </div> `; const html = document.querySelector('#categoriesPreview .categoriesPreview-list').innerHTML; document.querySelector('#categoriesPreview .categoriesPreview-list').innerHTML=categoryContainer+html; }); }
Asi lo estoy quedando con vanilla javascript :D
import getCategories from "../utils/getCategories"; const CategoriesPreview = async () => { const categoriesMovies = await getCategories(); const categories = categoriesMovies.genres; categories.forEach((category) => { const categoriesPreviewContainer = document.querySelector( "#categoriesPreview .categoriesPreview-list" ); categoriesPreviewContainer.innerHTML += ` <div class="category-container"> <h3 id="id${category.id}" class="category-title">${category.name}</h4> </div>`; }); }; export default CategoriesPreview;