개발환경 셋팅
- Node.js 설치
- vscode 설치
- 바탕화면에 작업파일 만들기
작업파일 (shift + 우클릭으로 파일 선택 후, PoewrShell 창 열기 클릭)
PowerShell창이 열리면, npx create-react-app 프로젝트이름 을 쳐준다.
vscode 열어서 해당 폴더를 열어보면, 리액트가 깔려있다.
왼쪽 src파일 안의 App.js 를 열고, 터미널에 npm start를 쳐보자. (이때 파일경로가 정확한 지 확인해야 함.)
로컬창이 뜨면 실행 성공!
Create React App을 설치함으로써, 자바스크립트에 html형식의 코드가 실행된다.
(index.js 파일이 자동으로 App.js의 코드를 html파일로 보내줌)
아래 강의를 보면 더 쉽게 이해할 수 있다.
https://www.youtube.com/watch?v=00yJy7W0DQE&list=PLfLgtT94nNq0qTRunX9OEmUzQv4lI4pnP&index=1
https://codingapple.com/unit/react1-install-create-react-app-npx/?id=2305
리액트 React 설치와 개발환경 셋팅 (2022 ver) - 코딩애플 온라인 강좌
0:00 개발환경 셋팅 0:42 리액트프로젝트 생성은 2:38 이제 에디터에서 오픈해서 코드짜십쇼 4:04 뭐했는지 설명 개발환경 셋팅 1. 구글에 Nodejs 검색해서 LTS라고 써있는 버전을 설치합시다. - 13
codingapple.com
그냥 강의 듣기 싫어서 써봤다.
그래도 처음부터 시작하는 나같은 코린이는 이렇게 간략하게 정보를 모아놓은 곳이 필요하지 않을까?
'React' 카테고리의 다른 글
CSS 모달창을 만들어보자구나! (0) | 2022.11.18 |
---|---|
react-hook-form 사용기 (0) | 2022.11.15 |
리액트 제어컴포넌트와 비제어 컴포넌트 (0) | 2022.11.14 |
리액트 geolocation으로 내 위치 좌표값 가져오기 (0) | 2022.11.09 |
useEffect() 가 뭐꼬? (0) | 2022.10.08 |