728x90
리액트(React)를 사용하여 기본 파일을 만드는 방법!
Node.js 설치하기
: 리액트 애플리케이션을 개발하기 위해서는 Node.js를 먼저 설치해야 합니다.
Node.js는 자바스크립트 런타임 환경으로, npm(Node Package Manager)을 제공합니다.
npm은 리액트 및 다른 종속성을 관리하는 데 사용됩니다.
Node.js를 설치하려면 공식 웹사이트(https://nodejs.org)에서 다운로드하여 설치하세요.
리액트 앱 생성하기
: 터미널(혹은 명령 프롬프트)을 열고 새로운 디렉토리를 생성한 후, 해당 디렉토리로 이동하세요.
예를 들어, 다음과 같은 명령어를 사용하여 디렉토리를 생성하고 이동할 수 있습니다 :)
mkdir my-react-app //리액트 앱 생성
cd my-react-app // 리액트 앱으로 이동
Create React App 사용하기
: Create React App은 리액트 애플리케이션을 쉽게 생성할 수 있는 공식적인 도구입니다.
다음 명령어를 실행하여 Create React App을 전역으로 설치하세요.
npm install -g create-react-app
// 에러가 발생할경우
sudo npm install -g create-react-app //sudo 는 관리자 권한
리액트 앱 생성하기
: Create React App을 사용하여 리액트 앱을 생성합니다.
npx create-react-app 프로젝트-디렉토리 .
// 위 명령어의 마지막에 있는 마침표(.)는 현재 디렉토리에 리액트 앱을 생성하라는 의미입니다.
앱 실행하기
: 리액트 앱이 생성되면, 앱을 실행하기 위해 다음 명령어를 실행하세요.
npm start
// 이 명령어는 개발 서버를 시작하고, 앱을 브라우저에서 자동으로 엽니다. 변경 사항이 저장될 때마다 앱이 자동으로 다시 로드됩니다.
리액트 앱이 성공적으로 생성되면, src 폴더 내에 기본 파일들이 있을 것입니다.
index.js 파일은 앱의 진입점이며, App.js 파일은 기본적인 컴포넌트입니다.
이 파일들을 수정하여 리액트 앱을 개발할 수 있습니다.
728x90
'웹 < 프론트앤드 > > React' 카테고리의 다른 글
JSX 주요 문법 (0) | 2023.07.14 |
---|