FrameWork/React

리액트에 대해 알아보고, 프로젝트 생성하기

JHeaon 2023. 7. 8. 19:17

리액트란 사용자 인터페이스를 구축하는 자바 스크립트 라이브러리이다. 물론 Html, Css, Javascript로 사용자 인터페이스를 구축할 수 있지만, 복잡한 인터페이스를 구축하기에는 조금 불편한 점이 있을 수 있다. 따라서 리액트의 힘을 빌려 좀 더 쉽게 인터페이스를 구축하기 위해 사용한다. 

 

 

 

리액트

리액트는 사용자 인터페이스를 구축하는 자바 스크립트 라이브러리 종류 중 하나이며 모두 컴포넌트(html, css, js의 결합물)로 구성되어 있다. 리액트를 사용하게 된다면 다음과 같은 이 점을 얻을 수 있다. 

 

  • 재사용성 증대 
  • 관리 용이성 증대 

 

 

리액트 프로젝트 생성하고 실행하기

리액트 프로젝트를 생성하기 위해서는 node.js을 설치하여야 한다. 

참고 : https://nodejs.org/ko

 

Node.js

Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine.

nodejs.org

 

설치가 완료되면 작업하고자 하는 폴더로 들어가 해당 명령어를 입력한다. 

npx create-react-app project_name

그런 다음 해당 프로젝트를 실행시키기 위해서는 아래의 명령어를 입력한다. 

npm start

 

 

정상적으로 리액트 앱이 돌아가고 있는 것을 확인할 수 있다. 리액트에서 패키지 관리는 package.json에서 관리되며 이를 폴더에 node_module 모아 패키지를 관리한다. 따라서 만약 외부에서 리액트 프로젝트를 받아 사용한다면 "npm install" 명령어를 통해 패키지를 다운로드한 뒤, 프로젝트를 실행하여 사용하면 된다. 

 

즉 남이 만든 리액트 프로젝트를 사용하기 위해서는 아래와 같이 진행하면 된다. 

  • Git을 통해 react project을 가져온다. 
  • npm install 명령어를 통해 패키지를 설치한다.
  • npm start을 통해 프로젝트를 실행한다. 

 

 

 

 

 

 

'FrameWork/React'의 다른글

  • 현재글 리액트에 대해 알아보고, 프로젝트 생성하기

관련글