[twitter bootstrap] 트위터 부트스트랩이란?

트위터 근무자가 web UI를 트위터와 비슷하게.. 빠르게 만들수 있는 프레임 워크로 만들었다고 한다.

1. 부트스트랩은 HTML5와 CSS3, JQuery를 기반으로 사용 한다고 한다.

2. 일반적으론 CSS 프레임 워크랜다.

3. 반응형 웹이다 ---> 브라우저 크기에 따라 형태가 변한다(모바일, 태블렛, PC모두에서 사용 가능)

한마디로 버튼, 테이블 등 디자인이 어느정도 되어서 나온 소스라고 본다.

★ 웹 개발자들은 필요 없겠지만, 비 웹개발자가 무언가를 금방 만들어야 할때!!!

쓸만 할것 같다.

CSS는 HTML에서 디자인(겉모양)을 따로 때어낸 것이며,

JQuery는 javascript 라이브러리 라고 보면 될 듯하다.

---

아랫 글 : http://rkjun.wordpress.com/2012/02/28/bootstrap-2-0-intro/

1. 부트스트랩 (Bootstrap, from Twitter) 은 무엇인가?

부트스트랩  (http://twitter.github.com/bootstrap/) 은 트위터에 근무하는 두 명의 엔지니어 (Mark Otto와 Jacob Thornton) 가 개발한 가볍고 간단한 오픈소스기반 (아파치2.0라이센스) 의 HTML5, CSS3 UI 프레임워크입니다. HTML5, CSS3, Javascript 로 구성되어 있고, 가볍게 트위터 디자인 비슷한 UI 를 빠르게 구현해낼 수 있는 각종 콤포넌트들을 제공해 주고 있습니다.

3. 내 홈페이지에 bootstrap 적용하기

HTML, CSS, Javascript 에 선수지식이 있으면 조예가 깊지 않아도, 부트스트랩을 가져다가 나만의 사이트를 만들 수 있습니다. 이미 샘플로 구성된 부트 스트랩 예제 화면을 참조하면 어렵지 않게 따라 만들 수 있습니다. 또한 부트스트랩 홈페이지에서 자세한 설명까지 설명되어 있으니, 조금만 시간을 내어 읽어보면 원하는 입맛대로 만들어 낼 수 있습니다. 기본적으로 CSS 에 대한 깊은 지식이 없어도 class 를 이용하는 것으로 충분히 원하는 의도대로 만들어 낼 수 있다는 점에서, 디자인에 약한 개발자에게는 나홀로 이쁜 사이트 만들기에 최적화된 아이템임에 틀림없습니다.

4. 커스터마이징

어느정도까지는 내 입맛대로 바꿔서 쓸 수 있어야, 써볼 맛이 납니다. 부트스트랩 페이지에서도 이미 커스터마이즈 기능을 기본으로 제공해 주고 있습니다. 추가로 부츠왓치(http://bootswatch.com/) 사이트를 통해서도 간단하게 색상 변경을 통해 원하는 CSS 를 얻어낼 수도 있습니다. 랩부트스트랩 (http://wrapbootstrap.com/) 에서는 부트스트랩용 테마를 판매하고 있기도 합니다.

5. 웹 개발자의 놀이가 되어 줄 부트스트랩.

사이트의 틀을 부트스트랩이 잡아주니, 나머지는 웹 개발자 혼자서도 어떻게든, 그럭저럭 이쁜 사이트를 만들어 낼 수 있을 듯 합니다. 나머지 코딩은 개발자 몫인 거죠. 부트스트랩에 최적화된 JQuery Plugin 들도 꽤 흥미롭습니다.  특히나 캐러셀 (carousel : 화면을 회전하듯 부드럽게 전환시키는 방식.) 같은 기능들은 왠지 무조건 넣고 봐야 하는 거죠.^^;

8. 잡담

디자인에 약한 웹 개발자들(특히나 서버사이드개발자) 에게  꽤 흥미로운 물건이다. 쉽고 재밌게 가져다 쓸 수 있는 것도 큰 장점이고. 암튼 이 bootstrap 의 기반에는 less (http://lesscss.org/) 기술도 사용되어지고 있는데 이게 또 꽤 흥미로운데, 이건 나중에 차차 다시 포스팅해야겠다.