1. 터미널에 npm install react-bootstrap bootstrap 입력
2. index.html -> link 추가
2-1. css -> import 하기
둘중하나 선택해서 진행
3. 부트스트랩을 사용할 파일에 사용할 종류 import 하기
여러개 사용하려면 아래와 같이 import 해도 괜찮음
import { Button, Container, Nav, Navbar } from 'react-bootstrap';
4. 코드 붙혀넣기
import { Button, Container, Nav, Navbar } from 'react-bootstrap';
import './App.css';
function App() {
return (
<div className="App">
<Navbar bg="dark" variant="dark">
<Container>
<Navbar.Brand href="#home">Navbar</Navbar.Brand>
<Nav className="me-auto">
<Nav.Link href="#home">Home</Nav.Link>
<Nav.Link href="#features">Features</Nav.Link>
<Nav.Link href="#pricing">Pricing</Nav.Link>
</Nav>
</Container>
</Navbar>
</div>
);
}
export default App;
5. 결과
예쁜 navbar 생김