리액트란 사용자 인터페이스를 구축하는 자바 스크립트 라이브러리이다. 물론 Html, Css, Javascript로 사용자 인터페이스를 구축할 수 있지만, 복잡한 인터페이스를 구축하기에는 조금 불편한 점이 있을 수 있다. 따라서 리액트의 힘을 빌려 좀 더 쉽게 인터페이스를 구축하기 위해 사용한다.
리액트
리액트는 사용자 인터페이스를 구축하는 자바 스크립트 라이브러리 종류 중 하나이며 모두 컴포넌트(html, css, js의 결합물)로 구성되어 있다. 리액트를 사용하게 된다면 다음과 같은 이 점을 얻을 수 있다.
- 재사용성 증대
- 관리 용이성 증대
리액트 프로젝트 생성하고 실행하기
리액트 프로젝트를 생성하기 위해서는 node.js을 설치하여야 한다.
설치가 완료되면 작업하고자 하는 폴더로 들어가 해당 명령어를 입력한다.
npx create-react-app project_name
그런 다음 해당 프로젝트를 실행시키기 위해서는 아래의 명령어를 입력한다.
npm start
정상적으로 리액트 앱이 돌아가고 있는 것을 확인할 수 있다. 리액트에서 패키지 관리는 package.json에서 관리되며 이를 폴더에 node_module 모아 패키지를 관리한다. 따라서 만약 외부에서 리액트 프로젝트를 받아 사용한다면 "npm install" 명령어를 통해 패키지를 다운로드한 뒤, 프로젝트를 실행하여 사용하면 된다.
즉 남이 만든 리액트 프로젝트를 사용하기 위해서는 아래와 같이 진행하면 된다.
- Git을 통해 react project을 가져온다.
- npm install 명령어를 통해 패키지를 설치한다.
- npm start을 통해 프로젝트를 실행한다.
'FrameWork > React' 카테고리의 다른 글
리액트 State와 useState 사용하기 (0) | 2023.07.09 |
---|---|
리액트 이벤트 처리하기 (0) | 2023.07.09 |
리액트 JSX와 Props에 대해 알아보기 (0) | 2023.07.08 |
리액트 활용을 위한 자바스크립트 내용 간단하게 정리하기 (2) | 2023.07.08 |