dev-miri
쇼핑몰 웹사이트 만들기(4)-bootstrap 설치하기 본문
bootstrap를 웹사이트에 적용해보자
https://react-bootstrap.github.io/getting-started/introduction
React-Bootstrap
The most popular front-end framework, rebuilt for React.
react-bootstrap.github.io
- bootstrap 설치하기
npm install react-bootstrap bootstrap

필자는 이 과정에서 문제를 겪어서 아래 글에 트러블 슈팅 글을 따로 작성하였다
https://devmiri.tistory.com/21
npm add react-bootstrap bootstrap 안됨 해결방법
프로젝트가 있는 디렉토리에서 npm add react-bootstrap bootstrap이 안될 때 경로를 앞으로 이동해서 했다 설치가 진행은 되지만, 프로젝트 안에 설치가 되지 않아서 module not found 에러가 생겼다. Module no
devmiri.tistory.com
2. import 하기
설치를 완료하였고, 사용하기 위해서는 import를 해줘야 한다.
index.js에 import:
import "bootstrap/dist/css/bootstrap.min.css";
app.js에
import Button from "react-bootstrap/Button";

App.js 파일에 Bootstrap button을 만들어 줬다

실행결과는 이와 같다
'CSE > Internet Programming' 카테고리의 다른 글
| 쇼핑몰 웹사이트 만들기(5)-styled component 설치하기 (0) | 2022.06.01 |
|---|---|
| 쇼핑몰 웹사이트 만들기(3)-페이지 기획하기 (0) | 2022.05.30 |
| [react]쇼핑몰 웹사이트 만들기(2)-경로 설정하기/react-router-dom (0) | 2022.05.30 |
| 쇼핑몰 웹사이트 만들기(1)-환경구축 (0) | 2022.05.30 |
| [JSP] JSP 개념 (0) | 2022.05.21 |
Comments