트위터클론

폴더 생성프론트와 백엔드 코드를 관리할 수 있는 두개의 폴더 생성텍스트front폴더 안에 package.json 생성과 필요한 모듈 인스톨$ npm i next react react-dom개발환경에서 필요한 모듈 인스톨$ npm i -D nodemon webpack코드

antd UI프레임워크 설치/ css 스타일을 cdn으로 적용$ npm i antd웹의 페이지를 감싸는 메뉴나 검색창이 있는 레이아웃을 생성하자children 을 이용해 AppLayout컴포넌트에 데이터를 전달한다.AppLayout컴포넌트에 Link, div태그가 할당

React hook을 이용해 회원가입 화면을 구현해보자.기본적인 Input 핸들링. useState를 통해 state를 변경한다.비밀번호 불일치시 오류 메세지 띄우기

_app.js 를 이용해 공통된 레이아웃을 분리, 관리해준다. document.js, error.js 생성 _document.js 는 html, head, body _app.js 는 root pages 는 실제 컴포넌트

next에서는 store를 컴포넌트에 래핑하기 위해 next-redux-wrapper 를 설치해준다.크롬리덕스 데브툴을 쓰기 위해서 아래와 같이 세팅해준다.