Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
31 |
Tags
- 노마드코더
- H-index
- 138476
- 오블완
- Outlet
- Typescript
- 프로그래머스
- 티스토리챌린지
- 42747
- programmers
- Recoil
- 귤 고르기
- React
- Helmet
- useoutletcontext
- usesetrecoilstate
- userecoilvalue
Archives
- Today
- Total
오늘도 코딩하나
[React] (2)react-bootstrap 설치 본문
1. react-bootstrap
https://react-bootstrap.netlify.app/docs/getting-started/introduction
Introduction | React Bootstrap
Learn how to include React Bootstrap in your project.
react-bootstrap.netlify.app
(1) react-bootstrap 설치
npm install react-bootstrap bootstrap
(2-1) index.html - <head> 안에 import 시켜주기
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css"
integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN"
crossorigin="anonymous"
/>
(2-2) App.js
import 'bootstrap/dist/css/bootstrap.min.css';
-> 2-1 / 2-2 중에 하나의 방법으로 하면 된다.
** bootstrap vs react-bootstrap
- bootstrap : 상태값과 클래스를 사용
- react-bootstrap : function과 hooks 사용
'React > 코딩애플' 카테고리의 다른 글
[React] (6) Lifecycle과 useEffect (2) | 2024.06.04 |
---|---|
[React] (5) 리액트 라우터 (1) | 2024.05.28 |
[React] (4) 데이터 가져오기 (0) | 2024.05.24 |
[React] (3) image (1) | 2024.05.24 |
[React] (1)프로젝트 생성 (0) | 2023.12.20 |