목록Next13 블로그 프로젝트 (23)
안녕하세요
https://sakuraop.tistory.com/598 게시물 수정 기능 구현, 권한 없는 이용자 접근 제한하기 목차 1. 게시물 수정 라우터, API 생성하기 postId를 쿼리로 GET 요청을 보내 수정할 게시물의 데이터를 불러오기 수정 버튼을 클릭하면 /manage/newpost/1로 POST 요청보내기 DB에서 게시물 데이터 업데이 sakuraop.tistory.com 위의 게시물에서 이어지는 문제 해결 글입니다. (수정한 게시물로 redirect 하였더니 새로고침이 되지 않는 문제 발생) 게시물을 수정하였지만 redirect된 게시물에는 변화가 없습니다. 🔻ㅎㅎ를 지우고🔻 🔻게시물로 redirect 했더니 바로 반영이 안되는 문제🔻 업데이트한 게시물이 DB의 데이터와 다른 문제 발생 redi..
목차 1. 게시물 수정 라우터, API 생성하기 postId를 쿼리로 GET 요청을 보내 수정할 게시물의 데이터를 불러오기 수정 버튼을 클릭하면 /manage/newpost/1로 POST 요청보내기 DB에서 게시물 데이터 업데이트하기 작성된 게시물로 redirect 하기 2. 게시물 수정 권한을 확인하고, 권한이 없다면 돌려보내기 게시물 작성자의 id와 로그인 중인 user의 id가 일치하는지 확인 + 블로그 관리자인 경우(isBlogAdmin)에도 수정 권한을 가지도록 하기 수정 권한이 없는 경우에는 경고창을 띄우고 접근하려던 게시물로 redirect 하기 1. 게시물 수정 라우터, API 생성하기 게시물 작성 페이지 라우터: /manage/newpost 게시물 수정 페이지 라우터: /manage/ne..
목차 1. router 만들기 2. 라우터에 들어갈 컴포넌트기 만들기 3. quill 만들기 4. server에 quill에 작성한 데이터 전송 (request) 5. DB에 저장 6. 저장 결과 7. react-quiil이 content를 저장하는 원리 1. router를 만들어줍니다. /manage/newpost 경로에 라우터를 만들어줍니다. import Editor from "@/containers/Editor/Editor"; const NewPostRouter = async () => { return ( ); }; export default NewPostRouter; Router는 라우팅 역할만 맡도록 합니다. 2. /src/containers/Editor/Editor.tsx 컴포넌트를 만들어 줍..
Next.js 미들웨어(middleware) 목차 1. 미들웨어란 2. Next.js 에서 middleware 사용하는 법 middleware 세팅 NextResponse란 3. middleware가 적용될 경로 설정하기 react + express로 서버를 구현했을 때도 유저가 로그인했는지 정보를 확인하기 위해 middleware를 사용했듯 Next.js에서는 middleware를 어떻게 사용하는지 찾아보았다. 1. 미들웨어(middleware)란 특정 경로의 페이지로 접근할 때 또는 특정 api 를 실행하기 전 "이 함수를 실행"하는 역할을 한다. 인증이 되지 않은(비로그인) 유저가 url 주소를 통해 게시글 작성 페이지로 접근하려 할 때 (/manage/newpost) 회원 정보 수정 페이지로 접근..