Next 환경에서 Storybook로 컴포넌트 개발하기
1. 프롤로그 컴포넌트 UI를 개발하면서 Storybook을 많이 사용하죠 이번 포스팅에서는 Next 환경에서 Storybook을 적용하면서 Storybook에 애드온 패널을 연결해 곧바로 컴포넌트를 편집하는 방법을 알아보도록 하죠 2. 환경세팅 > 🌱 Next 설치 및 실행 > > 터미널을 열고 차례대로 입력을 해준다 > 🌱 Storybook 설치 및 실행 > > 스토리북 설치가 되면 애드온 knobs도 추가 해준다 > 🌱 addon-knobs 설치 > > 애드온 knobs을 사용하면 컨트롤바에서 동적으로 props를 조작할 수 있음 3. 컴포넌트 컴포넌트를 하나 만들건데 단계별 진행 표시를 해주는 Progress Bar를 생성한다 > Knobs 창에서 props를 직접 바꿔가면서 상태를 확인할 수 있음! 
Next에서 SEO 처리하기
1. 프롤로그 기업과 관계자들이 Next를 선호하는 이유에는 SEO도 포함된다 SEO가 왜? 🤔🤔🤔 2. SEO 검색 엔진 최적화(Search Engine Optimization)는 사이트를 검색 결과에 잘 노출될 수 있도록 하는 것인데 구글, 네이버와 같은 검색 엔진은 자체적으로 만든 검색봇을 이용해서 수 많은 웹페이지에서 검색 결과에 근접한 페이지를 최상위에 매칭해준다 3. NEXT-SEO Next는 기본적으로 SSR을 지원하기 때문에 _document.js로 <head>안에 공통으로 들어가는 <meta>를 지정해줄 수 있는데 문제는 페이지마다 다른 메타, OG(오픈그래프)태그로 나눠서 처리해야 할 경우가 생긴다 다행히도 SEO를 더 쉽게 관리해주는 라이브러리가 존재한다 > 🌱 설치 > > 설치가 완료되면 next-seo를