윈도우와 Mac 리액트 타입스크립트 설치하기

윈도우

1. Node.js 설치

먼저 Node.js가 설치되어 있어야 합니다. 설치되어 있지 않다면 Node.js 공식 웹사이트에서 최신 버전을 다운로드하여 설치합니다.

2. Vite와 React 프로젝트 생성

Step 1: 터미널 또는 명령 프롬프트 열기

Windows 키를 누르고 "cmd" 또는 "PowerShell"을 입력하여 명령 프롬프트 또는 PowerShell을 엽니다. 혹은, Visual Studio Code와 같은 통합 개발 환경(IDE)에서 터미널을 열 수도 있습니다.

Step 2: 프로젝트 생성 명령 실행

아래 명령을 실행하여 Vite와 React를 사용한 새로운 프로젝트를 생성합니다:

# Vite 프로젝트 생성 명령 실행
npm create vite@latest my-react-app --template react

 

위 명령에서 my-react-app 부분은 원하는 프로젝트 이름으로 변경할 수 있습니다.

Step 3: 프로젝트 디렉토리로 이동

프로젝트 디렉토리로 이동합니다:

cd my-react-app

Step 4: 의존성 설치

프로젝트 디렉토리에서 아래 명령을 실행하여 필요한 의존성을 설치합니다:

npm install

3. 개발 서버 시작

아래 명령을 실행하여 개발 서버를 시작합니다:

npm run dev

 

명령을 실행하면 터미널에 로컬 서버 주소가 표시됩니다. 보통 http://localhost:5173과 같이 나옵니다. 이 주소를 웹 브라우저에 입력하면 새로운 React 프로젝트를 확인할 수 있습니다.

이제 Vite와 React를 사용하여 새로운 프로젝트가 성공적으로 생성되고 실행되고 있을 것입니다. 추가적으로 필요한 설정이나 패키지를 설치하여 프로젝트를 커스터마이징 할 수 있습니다.

 

*추가

styled-components 설치 

npm i styled-components

 

---

Mac

yarn create react-app <프로젝트 이름> --template typescript