시작하며...게시물 수정 페이지 같은 경우 해당 게시글을 작성한 사용자만 수정이 가능하다. 그래서 작성자에게만 수정 버튼이  렌더링 되지만 만약 그렇지 않은 사용자가 주소창을 통해 강제로 수정 페이지로 이동하였을 때, 해당 게시글의 작성자가 아니면 접근을 하지 못하게 막아야 된다. Next.js Server Side Rendering 에서 이를 구현하는 방법에 대해 알아볼 것이다. 구현 방식현재 로그인한 유저의 user id 와 게시물을 작성한 user id 를 비교해서, 다르면 not found 페이지로 이동시킨다. 로컬 스토리지서버 사이드 렌더링은 서버에서 페이지를 렌더링하며, 브라우저 API 인 document, window 등 객체에 접근할 수 없다. 그래서 로컬 스토리지 같은 경우 브라우저에서 ..

시작하며...이번 프로젝트에서 Storybook 을 적용하게 되었다. 이전 프로젝트에서는 공통 컴포넌트를 테스트 페이지를 만들어서, 사용하는 방법과 예시를 다른 팀원들에게 보여줬는데이제 Storybook 을 사용하면 번거롭게 테스트 페이지를 만들 필요가 사라진다. 설치하기먼저 Storybook 을 설치한다.npx storybook@latest init그러면 Storybook 이 설치되면서 실행이 된다.  해당 프로젝트는 yarn 이라서 yarn stroybook 을 입력하면 스토리북이 실행이 된다.만약 npm 이라면 npm run stroybook 를 입력하면 된다. 스토리북 작성하기컴포넌트 주석달기버튼 컴포넌트에 대해 Storybook 을 작성하기 전에 해당 버튼 컴포넌트의 interface 에 주석을..