react.js로 영화 웹 서비스 만들기 -1

1. node.js를 설치한다. (확인하는 방법은 터미널에서 node -v)

2. node.js를 설치하면 자동으로 npm이 깔려있을 것이다. (확인하는 방법은 터미널에서 npm -v)

3. npx를 설치한다. (npm install npx -g)만약 여기서 오류가 난다면 sudo rm -r /usr/local/bin/npx를 해서 지워주고 다시 sudo npm install npx -g로 설치해준다.

4. git을 설치한다. (설치되어있는지 확인하기 위해서 터미널에서 git --version)

5. react 설치한다. 공부하기 위해 이것저것 함축해놓은 것을 다운받는다. webpack, babel 등을 포함 (npx create-react-app)여기서 오류가 나서 많이 고생했다..
마지막에 이 블로그의 도움을 많이 받았다. 도움!

npx create react app 폴더명
이렇게 실행했을 때 오류가 발생한다면 경로 문제다.
한번 documents라던지 desktop이라던지 경로로 이동하자.

 

7. package.json -> scripts에서 아래 2개를 지워준다.

8. 터미널에서 npm start 하면 새 창이 뜨면서 localhost:3000 주소를 가지고 있다.

 

빨간색 네모 부분은 컴포넌트라고 부르는 것이다. (컴포넌트를 사용할 때 이런 형태를 가져야 한다. 리액트가 동작하기 위한 요소.)

리액트를 하면서 컴포넌트를 만들고 보기좋게 만들고 데이터를 가져온다.

컴포넌트는 기본적으로 html을 반환하는 함수다.

리액트는 컴포넌트를 사용해서 HTML처럼 작성하려고 하는 경우에 필요하다.

 

javascript와 HTML사이의 이러한 조합을 JSX라고 부른다.

다른 분야로 갔을 때 JSX는 사용되지 못한다. (앵귤러, 뷰 이런곳)

하지만 리액트에서는 javascript 위에 배워야 할 유일한 개념이다.

리액트에서 나온 유일한 개념이다. 나머지 개념들은 다 javascript에서 배웠던 것.

https://nomadcoders.co/react-fundamentals/lectures/1547

All Courses – 노마드 코더 Nomad Coders