목록유튜브컨텐츠탐색-StelLife (35)
안녕하세요
Locking이란 무엇인가: 동시성 제어 Locking은 여러 프로세스 또는 스레드가 동시에 접근하거나 수정하려는 데이터나 리소스를 하나의 프로세스 또는 스레드만 접근하도록 막는 것입니다. 여러 사용자가 동시에 실행하는 데이터베이스에 동시에 접근하게 되어 데이터 무결성에 문제가 생길 수 있습니다. 예를 들어, 다수의 사용자가 동시에 자원을 접근하는 웹 애플리케이션을 개발할 때, locking이 필요한 경우가 있습니다. 이 경우, 여러 사용자가 동시에 자원에 접근하여 각각의 작업이 충돌하거나 데이터 불일치가 발생할 수 있습니다. 따라서 이러한 상황에서는 locking을 사용하여 자원에 대한 접근을 제어하고 한 번에 하나의 프로세스 또는 스레드만 함수를 실행하도록 제어합니다. 모든 db 조작 함수에 lock..
playListItems 예시 /** * @param {Array} channelIdArray * @returns */ exports.getAllPlaylistItems = async (playlistId) => { const apiKey = process.env.REACT_APP_YOUTUBE_API_KEY; let nextPageToken = null; let videos = []; try { do { const params = { key: apiKey, part: ["snippet"].join(","), playlistId, maxResults: 50, pageToken: nextPageToken, }; const response = await axios.get("https://youtube.goo..
wrapper로 여러개의 a를 감싸서 버블링 막기 a 태그를 반복 사용하는 경우 해당 요소들을 감싸는 links-wrapper를 만들고, links-wrapper에 onClick={()=> event.stopPropagation()} 이벤트를 추가하여 모든 하위 a 태그에 영향을 미칠 수 있습니다. handleLinkClick(e, `https://www.youtube.com/watch?v=${videoId}`)}> e.stopPropagation()}> {title} {channelTitle} => a를 감싸고 있는 body div를 만들고 onClick 이벤트를 추가하여 하위 a 태그에 stopPropagation() 함수를 적용했습니다.
클릭하면 변경할 옵션을 filterOption state에 저장합니다. const [filterOption, setFilterOption] = useState(""); const handleFilterOptionChange = (option) => { setFilterOption(option); }; // ... handleFilterOptionChange("")}>전체 handleFilterOptionChange("option1")}>option1 handleFilterOptionChange("option2")}>option2 옵션이 변경되면 렌더링할 리스트를 filter 기능을 이용해 구현합니다. const filteredVideos = uploadedVideos.filter((video) => { ..