본문 바로가기
728x90

2024/082

[Next.js+MongoDB] 게시판 북마크 기능 구현하기 (feat. App Router) 평소 메모장을 사용할 때 편리했던 기능 중에 하나인 '북마크 기능'을현재 리팩토링을 진행하고 있는 게시판 프로젝트에 적용해보고 싶었다 북마크 버튼을 통해 게시글을 북마크하고,북마크된 게시글을 최상단에서 볼 수 있는 기능을 구현하고자 한다.구현 화면 목차북마크 기능 구현 단계MongoDB를 활용한 API 세팅(Next.js App Router 를 사용한) UI 세팅  📌 북마크 기능 구현 단계북마크 기능을 구현하기 위해서는 아래 단계를 거치면 된다. 데이터베이스 내 게시글 데이터에 북마크 관련 필드를 추가한다북마크 여부를 저장하는 API 를 세팅한다UI 를 세팅한다 (→ 북마크 버튼, 북마크된 게시글이 최상단에 위치할 수 있도록 재정렬)  📌 MongoDB 를 활용한 API 세팅게시글 북마크 관련 필드.. 2024. 8. 24.
[Next.js] App Router API 요청 방식 정리 (+ Pages Router와 비교) (feat. MongoDB) 최근 게시판 프로젝트를 다시 리팩토링하고 기능을 보강하는 작업을 진행하고 있는데,App Router 로 프로젝트를 작업했지만API 요청은 Pages Router 방식으로 작성이 되어 있어서App Router 방식으로 변경하고자 하였다. API 요청 방식을 다룬 글이 많이 없어서공식 문서를 뜯어보고 한참 헤매다가해결한 코드를 공유하면 좋을 것 같아서 글을 작성하게 되었다! (기존에 작성했던 Pages Router 방식과 비교해서 보여주면좀 더 이해하기 쉬울 것 같았다.) 목차API 파일 폴더 구조GET 요청POST 요청 (application/json , formData 요청 방식)DELETE 요청 📌 API 파일 폴더 구조Pages Router ver.Pages Router 에서는 api 파일을 [프로.. 2024. 8. 10.
728x90