수업 53일차
이론
- react-bootstrap: bootstrap을 React의 컴포넌트 형태로 사용 가능
SPA의 특징: 1. 라우팅, 2. 컴포넌트
react-router: React에서 다양한 Routing 기능을 사용하기 위한 라이브러리
BrowserRouter: History API를 사용하여 페이지를 새로 불러오지 않고, 주소를 변경할 수 있음
Routes: 하위 Route 중 매칭된 한개만 렌더링 함
Route: 연결될 path와 컴포넌트를 설정
axios: node.js와 브라우저를 위한 Promise 기반 HTTP 클라이언트
Bootstrap
부트스트랩은 반응형 웹페이지를 위한 무료 소프트웨어이며 HTML, CSS, JS 템플릿을 모아둔 프레임워크이다.
쉽게말하면, 다른 사람들이 만들어논 css를 가져와서 사용하는 것이다.
- bootstrap.css를 불러오고, 해당파일에 정의된 버튼이나 레이아웃 등을 가져와서 사용
- 클래스로 간단하게 불러와서 사용
- 트위터에서 개발
부트스트랩 적용 방법
1. cdn에서 웹에서 지정되어있는 url 가져오는 방법
구글에 bootstrap cdn검색 > old ver > 3.4.1
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css"2. 다운로드를 받은 후에 bootstrap.min.css를 적용하는 방법
부트스트랩 장점과 단점
장점
빠른 개발 시간으로 인한 높은 생산성
pc 뿐만아니라 반응형으로 모바일을 함께 지원 --> 반응형
단점
양산형 디자인으로 개성이 떨어짐
낮은 웹페이지 로딩속도와 성능 ( 템플릿을 통째로 가져오기때문에 )
코린이 입니당 :)