search-site-pair3

json-server로 구현된 API를 활용한 검색어 조회 사이트입니다.
debouncing 기능을 활용하여 API 요청을 최적화하고,
local storage를 사용하여 새로고침을 하여도 검색 기록이 유지될 수 있도록 하였습니다.
또한 추후 프론트엔드 코드와 백엔드 코드가 개별적으로 업데이트 되거나 재사용 될 가능성을 염두에 두고,
Vercel과 Glitch를 통해 프론트엔드 코드와 백엔드 코드를 따로 배포해보았습니다.

📌 배포 링크

• FRONT-END
• BACK-END

📋 프로젝트 기록

프로젝트 구현 일지 및 API 최적화 방법, CORS 에러에 대해 공부한 후 작성하였습니다.

• 노션

🗂️ 폴더 구조

Folder Structure

📦src
┣ 📂apis
┃ ┣ 📜@core.js
┃ ┗ 📜search.js
┣ 📂components
┃ ┣ 📜recentlySearched.js
┃ ┣ 📜search-bar.js
┃ ┣ 📜searchResults.js
┣ 📂context
┃ ┣ 📜inputData.js
┃ ┗ 📜targetwords.js
┣ 📂hooks
┃ ┗ 📜useDebounce.js
┣ 📂pages
┃ ┗ 📜index.js
┣ 📂style
┃ ┗ 📜global.js
┣ ...

👾 팀원

고승용

심재원

함정우