React 입문 | React 개발 준비 | React 준비


React은 JavaScript의 프론트 엔드(클라이언트 측에 표시되는 부분)를 개발을 위해 만들어진 프레임워크이다.

많은 사람들은 Web 어플리케이션 프레임워크라고 하면, Spring 같은 MVC 응용 프로그램 프레임워크를 생각할 것이다. JavaScript으로 프런트 엔드를 위한 프레임워크라고 하면, “그런 것이 있나? 일반적으로 HTML 및 JavaScript로 쓰면 되 잖아"라고 생각할지도 모른다.

그런데, 최근의 Web을 보면 알 수 있듯이 더 이상 Web 페이지의 표시라는 것은 “텍스트와 이미지를 HTML로 조합하여 완성하지만은 않는다. Web 화면에서 자유 자재로 콘텐츠가 배치되어 움직이고 돌아간다. 무언가를 조작하면 실시간으로 디스플레이가 변경되어 업데이트 된다. 이것은 전부 수작업으로 코드를 넣어 만든다면 상당히 어러울 것이라고 생각되지 않는가?

고급 프론트 엔드 표현은 이제 수작업으로 작성하는 시대가 아니다. 그런 프론트 엔드 개발을 위해 만들어진 것이 React이다. React은 Facebook 의해 개발되고 있으며, 실제로 Facebook에서 사용되고 있는 것이므로, 그 품질은 보증되었다고 할 수 있다.

React 설치

React 설치에는 여러 가지 방법이 있지만 가장 알기 쉬운 것은 npm을 사용하는 방법이다.

npm이란 것은 “Node Package Manager"이다. 이것은 원래 Node.js (JavaScript 런타임 환경) 패키지 관리를 위해 만들어진 것이지만, JavaScript의 라이브러리 관리에 안성맞춤으로, JavaScript의 라이브러리와 프레임워크로 사용되는 것이다. Node.js를 설치하면 자동으로 npm도 들어가기 때문에, 사용한 적이 없는 사람은 이것을 설치한다.

https://nodejs.org

React 설치는 명령 프롬프트 또는 터미널에서 한다. React 자체는 단순한 스크립트 파일이므로 사실 설치하는 작업은 필요 없지만, React 응용 프로그램 환경을 갖추는 것이 귀찮은 작업이기에 “React 사용하는 응용 프로그램을 만드는 도구"라는 것을 준비하기 위해 이것을 설치한다.

$ npm install -g create-react-app

이와 같이 실행한다. 이 “create-react-app"라는 것은 그 패키지이다.

$ sudo npm install -g create-react-app
/usr/local/bin/create-react-app -> /usr/local/lib/node_modules/create-react-app/index.js
+ create-react-app@1.4.3
added 106 packages in 6.226s

이것으로 React 응용 프로그램을 만들고 개발할 준비가 되었다.