부트스트랩

 

쉽게 설명하면 HTML 이라는 맨 몸에 코디셋업을 가져와서 챡 입혀주는 거라고 생각하면 될 것 같다. 

 

부트스트랩의 자세한 설명은 아래와 같다.

(아래 링크에 있는 다른 분의 블로그 참고했습니다)

 

부트스트랩은 트위터에서 사용하는 각종 레이아웃, 버튼, 입력창 등의 디자인을 CSS와 Javascript로 만들어 놓은 프레임워크이다. 

 

 '프레임워크' 라고 하는 것은 재사용이 가능한 요소들의 집합되어 있으며, 정해진 구조와 틀 안에서 이것들이 확장이 가능한 기반 코드로 이루어 짐을 뜻한다. jquery는 라이브러리이고, 부트스트랩은 프레임워크다. 따라서, 우리는 '부트스트랩 프레임워크에서 jquery 라이브러리를 사용할 수 있다.'라고 말 할 수 있다.

 

부트스트랩에 열광하는 이유는 글자, 인용문, 목록, 표, 입력폼, 버튼, 이미지, 아이콘 등의 자잘한 것 뿐만이 아니라, 드롭다운 메뉴, 버튼, 탭, 리스트, 메뉴바, 페이지 이동 바, 알림 메시지, 썸네일, 진행 바 등의 웹 페이지에서 많이 쓰이는 요소를 거의 전부 내장하고 있고, 입맛에 따라 재사용 할 수 있기 때문이다. 이 때문에 웬만한 웹 페이지는 부트스트랩의 CSS와 JavaScript, 관련 이미지만 설치하고 미리 지정된 CSS 클래스나 JavaScript 함수만 불러오면 트위터에서 쓰는 것과 비슷한 디자인이 뚝딱 만들어진다.

 

게다가 PC용 디자인 뿐만 아니라 태블릿이나 스마트폰 같은 모바일용 디자인도 지원한다. 이 때문에 디자인을 할 시간이 크게 줄어들고, 여러 웹 브라우저를 지원하기 위한 크로스 브라우징에 골머리를 썩일 필요가 없다. 크로스 브라우징을 위한 각종 핵도 들어 있기 때문이다. 거기다 웹 브라우저 크기에 따라 자동으로 정렬되는 "그리드 시스템"을 채용하고 있기 때문에 하나의 웹 페이지를 데스크탑, 태블릿, 스마트폰 모두에서 무리없이 보게 만들 수 있다. 즉 '반응형 웹 디자인'을 지원한다는 의미이다.

 

추가적으로 이게 오픈소스이며, 상업적으로 이용이 가능하다. 브라우저에 bootstrap template 키워드로 검색하면 어마어마한 양의 부트스트랩 템플릿이 존재하고, 무료로 제공하는 경우도 있으나 유료로 판매하는 경우도 많다. MIT 허가서를 사용하는데, 재배포 면에서는 GPL보다 휠씬 자유로운 라이선스이다.

 

 

https://getbootstrap.com/

Bootstrap

부트스트랩에 들어가서 아래 코드를 복붙해주면 바로 오른쪽과 같은 창이 만들어 지는 것을 알 수 있다. 참 쉽죠?...

 

 

 

 

 

 

---

https://ict-nroo.tistory.com/21

[Bootstrap] 부트스트랩이란?