I currently work on a project where I need to showcase the 10 latest videos of the website owner, but using the youtube DATA API v3 but during testing I quickly ran out of the 10,000 assigned daily quota points, because I am using the "Search" request which costs 100 points, is there another way to get the video ids?Using reactjs here is what I tried
import { useEffect, useState } from "react"import useFetch from "../../hooks/useFetch"export default function YoutubeEmbed() { const KEY = '[Redacted]' const CHANNEL_ID = '[Redacted]' const MAX_RESULTS = '10' const YOUTUBE_API_URL = `https://youtube.googleapis.com/youtube/v3/search?part=snippet&channelId=${CHANNEL_ID}&maxResults=${MAX_RESULTS}&order=date&key=${KEY}` const SCALE_FATOR = 1.5 const [currentVideoIndex,setCurrentVideoIndex] = useState(0) const [videos, setVideos] = useState([]) const { loading, error, value } = useFetch( YOUTUBE_API_URL, {}, []) const getVideos = () => { let items = value?.items let videos = items?.map(((video) => { return { id: video.id.videoId, title: video.snippet.title, description: video.snippet.description, thumbnails: video.snippet.thumbnails } })) return videos } useEffect(() => { if (!loading) { if (!error) { setVideos(getVideos()) } else console.log(error); } }, [loading]) return (<><div className="youtube-current-video"><iframe src={`https://www.youtube.com/embed/${videos[currentVideoIndex]?.id}`} allowFullScreen frameborder="0" width={`${480 * SCALE_FATOR}px`} height={`${270 * SCALE_FATOR}px`} /></div></> )}