[React] 리액트 프로젝트 생성 및 실습 (+부트스트랩 설치)

 

 

[1] demo02 프로젝트 생성

npx create-react-app demo01

깃허브 설정 제거 후 프로젝트 생성
npx create-react-app demo01 --skip-git

 

[2] demo02 프로젝트 실행

cd demo02
npm start

 

 

[3] 각자 작업할 환경에서 App.js 파일 수정

import logo from './logo.svg';
import './App.css';

function App() {
  return (
    <h2>
      React 실습 <br></br><br></br>

      <a href='http://google.com'>구글로 이동</a><br></br>
      <a href='http://naver.com'>네이버로 이동</a><br></br>
      <a href='http://kakao.com'>카카오로 이동</a><br></br>
    </h2>

  );
}

export default App;

   (+) 리액트는 전체를 감싸는 태그 하나만 허용한다. 

 

 

[4] 결과 확인

 

프로젝트 종료는 cmd에서 Ctrl+C하면 된다

---

bootstrap, bootswatch 파일도 설치 해보자

 

(주의) 사용하고자 하는 프로젝트 내에서 설치해야 한다!!

 

npm i bootstrap
npm install bootswatch

 

 

설치 후 package.json 파일을 확인해보면 "bootstrap"과 "bootswatch"가 설치된 것을 확인할 수 있다.

 

또는 프로젝트 > node_modules > 에서도 확인 가능하다

 

다음으로, 이 라이브러리를 불러와 사용할 수 있도록 임포트 해줘야 한다.

 

 

 

 

 

 

 

개인 공부 기록용입니다:)