한 권으로 끝내는 Node & Express(2판): 모던 웹을 위한 서버 사이드 자바스크립트의 모든 것

277

16

장

단일 페이지 애플리케이션

애플리케이션 루트로 이동해서

server

디렉터리를 만듭니다. 이 디렉터리에 익스프레스 서버

를 만듭니다. 클라이언트 앱이 들어갈 디렉터리는 만들지 마세요.

CRA

에서 필요한 작업을 할

겁니다.

CRA

를 실행하기 전에 먼저 얀

3

을 설치해야 합니다. 얀은

npm

과 비슷한 패키지 매니저이며

실제로 많은 부분에서

npm

을 대체합니다. 얀이 리액트 개발에 필수는 아니지만 사실상 표준

이며, 얀을 사용하지 않고 리액트 앱을 개발하는 것은 물길을 거슬러 헤엄치는 것만큼 어렵습

니다. 얀과

npm

사이에는 세밀한 차이가 여러 가지 있지만, 여러분이 체감할 수 있는 차이는

npm

install

대신

yarn

add

를 실행한다는 것 정도입니다. 얀을 설치하려면

http

://

bit

.

ly

/

2xHZ2Cx

의 설명을 따라 하세요.

설치한 다음에는 애플리케이션 루트에서 다음 명령을 실행합니다.

yarn create-react-app client

다음에는 클라이언트 디렉터리로 이동해서

yarn

start

명령을 실행합니다. 몇 초가 지나면 리

액트 앱을 실행 중인 브라우저 창이 나타납니다.

이 터미널 창은 닫지 말고 그대로 둡니다.

CRA

는 실시간 리로드를 정말 잘 지원합니다. 소스

코드를 업데이트하면 즉시 서버 앱도 업데이트되고 브라우저도 자동으로 ...