React 로 롤 전적 통계 사이트를 만들어보자! - 1

 

 

소스 편집 툴은 비쥬얼 스튜디오 코드를 이용하려 한다. 

프로그램이 가볍고 다양한 기능을 지원해서 추천.😝

 

이 게시물은 React , Node.js , NPM , CRA ... 등등 

프론트엔드 기본 지식이 있는 사람이 볼 것이라고 가정하에 작성할 것이다.😩

 

목차📋

1. React 개발환경 설정

2. React 신규 프로젝트 생성

3. React 프로젝트 구동

 

 

---

1.  React 개발환경 설정

 

VS code

https://code.visualstudio.com/

Visual Studio Code - Code Editing. Redefined

 

이어서 노드(Node.js)를 설치해주자.

 

Node.js 설치

https://nodejs.org/ko/

Node.js

 

노드가 정상적으로 설치되었는지 확인해보자.

명령프롬포트를 실행해서 확인 할 수 있다. (단축키 윈도우 + R CMD 입력후 실행)

 

 

 

---

2. React 신규 프로젝트 생성

npx create-react-app 프로젝트명

시간이 컴퓨터 환경에 따라 소요될 수 있다. 

 

 

---

3. React 프로젝트 구동

비쥬얼 스튜디오 코드를 실행하자 

폴더 열기 또는 좌측 상단 폴더 열기( Ctrl + K + O)

이용하여 프로젝트 생성한 경로로 찾아가 프로젝트를 열어 확인하자

 

 

터미널에 npm start 입력하여 프로젝트를 구동해서 확인할 수 있다 😋

 

---

* Reference

https://reactjs-kr.firebaseapp.com/

React – A JavaScript library for building user interfaces

본문 중 틀린 내용이 있으면 언제든지 말씀해주시면 수정하도록 하겠습니다.