먼저 node js와 visual studio code가 설치되어 있어야 한다.
Node.js
Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine.
nodejs.org
Visual Studio Code - Code Editing. Redefined
Visual Studio Code is a code editor redefined and optimized for building and debugging modern web and cloud applications. Visual Studio Code is free and available on your favorite platform - Linux, macOS, and Windows.
code.visualstudio.com
리액트 프로젝트 생성
visual studio -> terminal -> new terminal
터미널에서
npx create-react-app 프로젝트명을 입력하면 리액트 파일이 생긴다.
npx는 라이브러리 설치를 도와주는 명령어이다.
create-react-app은 세팅이 되어 있는 리액트 boilerplate 만들기 쉽게 도와주는 라이브러리
다 설치가 되서 보면
app.js가 메인 페이지이다. html의 index.html 이라고 보면된다.
내가 코딩한 것을 미리 보는 방법 터미널에서 npm start 입력
이외 리액트 설치 중 뭔가 잘 안된다면
노랑색은 경고
빨간색은 에러
https://online.codingapple.com/unit/react1-install-create-react-app-npx/?id=2305
리액트 React 설치와 개발환경 셋팅 (2021 ver) – 코딩애플 온라인 강좌
0:00 Nodejs, VS Code 설치 3:34 작업폴더에서 npx create-react-app으로 리액트 프로젝트 생성하기 6:18 생성된 blog라는 폴더 에디터로 열고 코딩시작해야하는데 그 전 잡설명 8:29 내가 짠 코드 웹 미리보기
online.codingapple.com
코딩애플 유튜브 참조 했습니다.
'공부 > 리액트' 카테고리의 다른 글
| Concurrently 이용 (0) | 2021.06.15 |
|---|---|
| 데이터 Flow Axios Cors Proxy (0) | 2021.06.15 |
| 리액트 라우터 돔 (0) | 2021.06.15 |
| BoilerPlate 리액트 구조 (0) | 2021.06.15 |
| 리액트 연습 codepen 세팅 (0) | 2021.06.11 |
댓글