리액트 기초- 1

리액트 기초- 1

(https://academy.nomadcoders.co/courses/enrolled/216871)

(https://www.youtube.com/watch?v=sM2p1EqTlw4&list=PL7jH19IHhOLOFTVD4R8FeZWkwpVi8-9Fv)

노마드 코더 (Nomad Coders) 라는 분의 영상을 보고 배운 것을 정리한것입니다.

---

nodejs와 npm, yarn이 설치되어있는 상태여야합니다.

Code Editer 는 Visual Studio Code를 사용할겁니다!

---

0. 환경

Window10 / 64bit

---

1. create-react-app 설치

작업환경 설정을 쉽게 해주는 모듈?입니다.

-g(global 로 전역으로 설치한다는 것입니다.)

CRA의 장점

구성,설정 (configuration)이 잡혀있어서

프로젝트 내부의 파일을 저장만 해도 자동으로 컴파일을 해주며

웹페이지가 바로 수정됩니다.

---

2. 프로젝트 생성

제 작업 경로는

E:\(블라블라)\react_ex 입니다.

cmd 창에서 작업하고자하는 곳으로 이동 후

create-react-app movie-app2

를 실행합니다.

(movie-app으로 하셔도됩니다. 전 2번째 해보는거라 2로 했습니다.)

---

3. 확인하기

movie-app2 폴더가 생성된걸 확인할수있습니다.

cmd 창에서 생성된 폴더로 이동 후

yarn start

실행

서버가 열립니다.(3000번 포트)

그리고 기본적으로 만들어져있는 페이지가 띄워집니다!

yarn start 시에

movie-app2의 src/.*js 코드들을 html 파일에 담습니다.

(index.html 실행이 되는데 index.js를 포함하면서 화면이 표출..?됩니다.)