몽땅뚝딱 개발자

[React] 리액트 부트스트랩 사용하기 본문

Development/React.js · Next.js

[React] 리액트 부트스트랩 사용하기

레오나르도 다빈츠 2022. 9. 2. 08:30

 

◽ 설치하기

npm install react-bootstrap bootstrap

 

◽ 예제

import 'bootstrap/dist/css/bootstrap.min.css';
import { Button, Navbar, Nav, Container } from "react-bootstrap";
import './App.css';

function App() {
  return (
    <div className="App">
      <Button as="a" variant="primary" />
      <Navbar bg="primary" 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;

 

 


 

출처

 

React-Bootstrap

The most popular front-end framework, rebuilt for React.

react-bootstrap.github.io

 

 

Comments