티스토리 뷰
리액트 개발 준비!
React JS는 페이스북에서 만든 자바스크립트
React 로 Web을 만들기 위해 설치해야하는 프로그램은?
Node JS, npm, npx
1. Node JS
아래 URL에서 다운로드 가능
Node.js
Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine.
nodejs.org
2. npm
npm은 node js를 설치하면 자동으로 설치가 된다.
3.npx
콘솔에 아래와 같이 npm install npx -g 를 입력
4. Visual studio code (에디터)
아래 URL에서 다운로드 가능
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
5. git -v
아래 URL에서 다운로드 가능
프로젝트 생성하기!
리액트는 매우 현대적인 코드로 되어 있기 때문에 브라우저에서 리액트 코드를 이해 할 수가 없다.
리액트가 작동하기 위해서는 리액트 코드를 브라우저가 읽을 수 있는 코드로 변경해줘야 한다.
이 걸 한방에 해결하는 명령어가 create-react-app 이다.
이 명령어로 React Web App을 을 Set up 할 수 있게 해준다.
이 명령어는 npx와 npm의 설치를 전제로 한다.
콘솔에 npx create-react-app (어플리케이션 이름)을 입력한다.
아래는 npm 이 할 수 있는 명령어들이다.
cd movie_app_2020
yarn start
한댄다.
Visual studio code에서 해당 폴더를 선택하여 열수도 있고,
콘솔에서 code movie_app_2020 를 실행해도 해당 폴더를 VSC에서 열수있다.
README.md 는 내용 삭제하고 아래와 같이 입력해도 괜춘
Package.json
에서는 Script 의 두 개 configuration만 기억해라.
웹 서버 구동해서 웹에 띄우기!
프로그램 실행 명령어는 npm start 하면 위의 start가 실행되나봄..
서버가 구동되었다!!
Git Hub Repository 에 저장하기
git init을 입력한다.
git에 repository를 생성한다.
콘솔에 git remote add origin (git repository 주소)
git add .
git commit -m ""
git push origin master
'직딩일기 > 자기계발' 카테고리의 다른 글
[정보처리기사/실기] SQL문 연습하기! (0) | 2017.08.28 |
---|---|
[정보처리기사/실기] 전산영어 요약 및 기출 (0) | 2017.08.28 |
Mysql DB 한글깨짐 현상 해결 (0) | 2017.08.28 |
[정보처리기사/실기] 데이터베이스 요약 및 기출 (0) | 2017.08.28 |
[정보처리기사/실기] 업무프로세스 요약 및 기출 (0) | 2017.07.10 |