03. [React] react 시작하기

준비

Node.js 를 설치하여 npm 라이브러리 설치가 필요합니다
https://chuun92.tistory.com/13
본 포스트에서는 IntelliJ를 사용하여 개발을 진행합니다

현재 개발 화면

1. 아래 Terminal 창 띄워서 main 위치로 이동 / 혹은 완전 신규일 경우 IntelliJ 실행
2. React 컴파일 환경 만들기 $npm install -g create-react-app
3. create-react-app으로 프로젝트 생성하기 $npx create-react-app [프로젝트 이름] (밑 예시 사진에서는 hello로 했습니다)
4. terminal에서 해당 프로젝트 경로로 들어가서 (cd [프로젝트 이름] ) npm start
   아래와 같이 페이지 화면이 나오면 정상적으로 프로젝트가 시작된 것입니다.
   
   
5. 메인 실행 페이지를 직접 조작해봅시다.
   App.js 내에 return 아래 있는 코드를 지우고, 아래 사진처럼 간단한 내용을 넣어줍니다.
   그리고 파일을 저장만 해주면 알아서 화면을 띄워줍니다.
   
   

---

위와 같은 순서로 새로운 React 프로젝트를 생성하였습니다.
이후 마지막에 조작해본 App.js 를 메인 페이지로 하여 React로 웹페이지 개발을 시작할 것입니다.

---

Something is already running on port 3000. Probably 오류 발생 시

위 오류는 같은 컴퓨터의 localhost 서버에서 이미 react 프로젝트를 띄우고 있을 때 발생합니다.
말 그대로 3000 번 포트에 다른 프로젝트( 위 case 에서는 작성자가 frontChart 라는 다른 프로젝트로 react를 띄우고 있습니다 ) 가 실행되고 있으므로, 다른 포트를 사용할 것인지 물어보는 겁니다.
그냥 'Y' 치고 넘어가면 다른 포트에 배정이 되면서 프로젝트가 정상적으로 실행됩니다.

---

출처

https://chuun92.tistory.com/15
https://chuun92.tistory.com/13