[react.js] 리엑트 개발환경 세팅하기

1. 리엑트를 사용하기 위해서는 가장 먼저 node.js를 설치해야합니다. visual studio도 같이 설치해줍니다.

https://nodejs.org/ko

Node.js

 

2.  리엑트 작업용 폴더를 바탕화면에 만들어줍니다.

 

3.  비주얼스튜디오 상단 메뉴 중에서 Terminal을 누르면 나오는 new terminal을 누릅니다.

(ctrl + ~클릭해도 터미널 창이 나옵니다.)

 

4. 그렇게 나온 하단의 터미널 창에 npm init react-app '만들고자하는 프로젝트 이름'  이렇게 타이핑해주면 알아서 리엑트 파일이 생성됩니다. ( 컴퓨터 사양에 따라서 시간이 다소 걸릴 수 있습니다.. )

npx create-react-app my-app

 

5. 파일생성이 완료되면 src폴더 안에 app.js라는 파일을 볼 수 있을텐데  이 파일이 메인 화면이라고 보시면 됩니다.

 

6. 개발화면 미리보기 띄우기는 터미널 창에 npm start를 입력하면 됩니다.

( ★ npm start는 무조건 package.json 폴더가 위치한 경로 안에서 실행을 시켜줘야 에러가 안납니다..!!

터미널 창에 cd my-app 입력해서 경로 확인 필수!)

이런 화면이 나오면 리엑트 개발환경 세팅 완료

 

-끝-