티스토리 뷰
사람들은 이전부터 많은 프로그래밍 언어들에 관심을 가져왔습니다.
그 중 자바스크립트는 웹에서 하기 힘든 많은 일들을 실현시켰고, 또 하나의 언어만 알아도 많은 퍼포먼스를 낼 수 있는 역량을 가진 다수의 개발자를 독려하는데 큰 역할을 한 언어입니다. 자바스크립트가 발전하고 점점 범용성이 넓어지게 되면서 사람들은 자바스크립트보다 명확한, 또 개선되고 빠른 언어를 선호하기 시작하였습니다.
이 때문에 여러 자바스크립트 언어를 기반으로 한 프레임워크가 다수 출현하게 되었는데, 그 중 하나는 Node.js입니다.
설치를 하게 되면 아시게 되겠지만, Node는 NPM(Node Package Manager)가 전적으로 관여하게 됩니다. 모든 명령어를 'npm'이라는 단어로 실행시킬 수도 있고, 온라인이라는 상황하에 npm에서 제공하는 어느 패키지라던지 설치가 가능합니다.
React(리액트)는 Node.js에서 제공하는 라이브러리 중 하나입니다. React를 사용하기 위해서는 먼저 Node.js를 설치하여야 하죠. 설치 링크는 여기와 같아요. https://nodejs.org/ko/
Node.js가 설치 완료되었다면 가장 먼저 체크해야 하는 부분은 버전입니다.
명령 프롬프트 또는 터미널을 새로 여시고 다음과 같이 명령어를 타이핑해봅니다.
npm -version |
여기서 명령어가 작동하지 않는다면 제대로 설치가 되지 않은 것이므로 재설치를 요구합니다.
만약에 설치하고 싶은 버전과 해당 버전이 일치한다면, 이 후에 진행하여도 됩니다.
참고로 저는 Node Version >= 6 을 사용하고 있습니다.
5버전 아래는 npx라는 다른 명령어를 사용하여야 합니다.
프로젝트를 생성하고 싶은 곳으로 먼저 디렉토리를 이동합니다.
그리고 다음과 같이 명령어를 입력해봅니다.
(6버전 이상) npm install -g create-react-app create-react-app "projectname" (5버전 이하) npx create-react-app "projectname" |
자, 이렇게 명령어를 입력하셨다면 이제 React 프로젝트를 웹으로부터 다운로드하게 됩니다.
사실 로컬에서 온라인 상태가 아닌 상태에서도 프로젝트를 생성가능하지만, 다른 패키지도 순차적으로 설치해주고 환경설정까지 맞춰줘야하는 번거로움이 있습니다. (공식 문서에서도 위와 같은 방법을 선호합니다.)
이제 cd 명령어를 이용하여 터미널에서 디렉터리를 이동한 후 npm을 실행시켜봅니다.
cd projectname npm start |
정상적으로 구동되었다면 웹브라우저의 주소: "localhost:3000" 를 통하여 정상적으로 구동이 된 것을 확인할 수 있습니다.
'Client' 카테고리의 다른 글
[React.js] 간단한 시계 만들기 (2) (0) | 2020.03.22 |
---|---|
[React.js] 간단한 시계 만들기 (1) (0) | 2020.03.18 |
[React.js] React를 시작하기에 앞서 (0) | 2020.03.10 |
Thymeleaf 의 캐시(Cache) 처리 (0) | 2020.01.28 |
[TypeScript] BlockChain 만들기 (10) (0) | 2020.01.05 |
[TypeScript] BlockChain 만들기 (9) (0) | 2020.01.05 |