🔵부트스트랩이란 무엇이며, 왜 사용하는 것일까?
부트스트랩 사이트를 방문하면 아래와 같은 글을 볼 수 있다.
부트스트랩은 반응형이며 모바일 우선인 웹프로젝트 개발을 위한 가장 인기 있는 HTM, CSS, JS 프레임워크입니다.
한마디로 정리하면 웹사이트 개발 프레임워크다.
그렇다면 프레임워크란 뭘까?
프레임워크는 영어로는 FrameWork로
한국어로 쉽게 도우미라고 생각하면 된다.
즉, 부트스트랩은 HTML, CSS, JS 도우미다.
🙄웹페이지를 제작할 때 무엇을 도와준다는 것일까?
코딩의 양을 줄여준다. 즉, 웹페이지 제작 시 가장 많이 사용되는 CSS, JS 파일을 미리 만들어 놓고 다운로드 또는 CDN 방식으로 링크해서 사용하기만 하면된다.
단순히 링크 하나와 클래스 하나만 추가했을 뿐인데 버튼이 깔끔해진 것은 버튼에 관련된 CSS가 모두 사전에 지정이 되어 있기 때문이다. 사용자는 어떤 클래스인지 확인 후에 해당 클래스만 추가하면 된다.
- 부트스트랩을 사용하면 코딩량을 줄여 개발시간도 줄어들고 디자인도 깔끔하게 제작이 가능하다.
- 부트스트랩 사용방법
- CDN 방식으로 링크
- 다운로드
어떤 방법으로 사용해도 무방하지만, CDN 방식은 인터넷에 연결되어 있어야 하며, 다운로드 방법은 인터넷 연결과 상관이 없다.
여기서는 CSS 관련만 언급을 하였지만 JS 사용도 가능하며, 부트스트랩 웹사이트를 방문하면 각 태그에 관련 사용법이 자세히 나와 있으므로 쉽게 적용가능하다.
✔️부트스트랩 탄생배경 (트위터)
- 서로 다른 인터페이스를 사용한 여러 개발자들의 공동작업
- 디지인 불일치, 관리 어려움, 방대한 코드량 → 일관성 유지 불가
- 문제점 개선을 위해 트위터의 개발자와 UI 디자이너가 개발
- 2011년 8월 깃허브 오픈, 2014년 6월 깃허브 첫 번째 프로젝트
✔️부트스트랩이란?
- 프론트엔드 개발을 빠르고 쉽게 할 수 있는 프레임워크 : 재사용 가능한 요소의 집합, 구조와 툴 결정, 확장 가능한 기반 코드 등
- HTML, CSS 기반의 템플릿 양식, 버튼, 네비게이션 및 기타 페이지를 구성하는 요소 포함
- 자바스크립트를 선택적으로 확장 할 수 있음
- Github의 오픈 소스로 사용 가능. 상업적 이용 가능
부트스트랩은 트위터에서 사용하는 각종 레이아웃, 버튼, 입력창 등의 디자인을 CSS와 Javascript로 만들어 놓은 것이다. 웹 디자이너나 개발자 사이에서는 웹 디자인의 혁명이라고 불릴 정도로 폭발적인 반응을 얻는 프레임워크이다.
‘프레임워크’라고 하는 것은 재사용이 가능한 요소들이 집합되어 있으며, 정해진 구조와 틀 안에서 이것들을 확장이 가능한 기반 코드로 이루어 짐을 뜻한다. jQuery는 라이브러리이고 부트스트랩은 프레임워크이다. 따라서 ‘부트스트랩 프레임워크에서 jQuery 라이브러리를 사용할 수 있다.’라고 할 수 있다.
부트스트랩에 열광하는 이유는 글자, 인용문, 목록, 표, 입력폼, 버튼, 이미지, 아이콘 등의 자잘한 것뿐만 아니라 드롭다운 메뉴, 버튼, 탭, 리스트, 메뉴바, 페이지 이동 바, 알림 메시지, 썸네일, 진행 바 등의 웹 페이지에서 많이 쓰이는 요소를 거의 전부 내장하고 있고 입맛에 따라 재사용할 수 있기 때문이다.
이 때문에 웬만한 웹 페이지는 부트스트랩의 CSS와 JavaScript, 관련 이미지만 설치하고 미리 지정된 CSS 클래스나 JavaScript 함수만 불러오면 트위터에서 쓰는 것과 비슷한 디자인이 바로 만들어진다.
게다가 PC용 디자인뿐만 아니라 태블릿 스마트폰 같은 모바일 디자인도 지원한다. 이 때문에 디자인을 할 시간이 크게 줄어들고 여러 웹 브라우저를 지원하기 위한 크로스 브라우징에 골머리를 썩일 필요가 없다. 크로스 브라우징을 위한 각종 핵도 들어 있기 때문이다. 거기다 웹 브라우저 크기에 따라 자동으로 정렬되는 ‘그리드 시스템’을 채용하고 있기 때문에 웹 페이지를 데스크톱, 태블릿, 스마트폰 모두에서 무리 없이 보게 만들 수 있다. 즉 ‘반응형 웹 디자인’을 지원한다.
추가적으로 오픈소스이며, 상업적으로 이용이 가능하다. 브라우저에 Bootstrap template 키워드로 검색하면 어마어마한 양의 템플릿이 존재하고, 무료로 제공하는 경우도 있으나 유료로 판매하는 경우도 많다. MIT 허가서를 사용하는데, 재배포 면에서는 GPL 보다 훨씬 자유로운 라이선스이다.