Easy Way to develop Web : the Twitter Bootstrap

Easy Way to develop Web : the Twitter Bootstrap

Twitter Bootstrap is a front end framework to develop web apps and sites. It provides the basic modules used in such development projects (like Grid, Typography, Tables, Forms, and Responsiveness). It also comprises other useful and free front end components like Dropdown menus, Navigation, Modals, Typehead, Pagination, Carousal, Breadcrumb, Tab, Thumbnails, Headers etc. With such tools a web project could be completed pretty quickly and easily.

It contains HTML and CSS-based design templates with optional JavaScript extensions. The framework developed by Mark Otto and Jacob Thornton at Twitter to encourage consistency across internal tools at Twitter was also the most popular GitHub development project in Feb’12.

For most of the newbies here, which include me ;), it provides a very good base to start the web development without even knowing much of HTML or CSS. Even with very little knowledge in this field, one may develop great sites by deploying it directly or first customizing it to look exclusive and then using it…

To use Bootstrap in an HTML page, simply download the CSS stylesheet and include a link to this script in the HTML file:

<link href=”http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.no-icons.min.css&#8221; rel=”stylesheet”>

Bootstrap consists essentially of a series of ‘LESS’ stylesheets which implement the various components of the toolkit. The central configuration stylesheet can’t be utilized for all types of adjustments… many of the changes could be applied only through these ‘LESS’ declarations.

Also, it provides a set of stylesheets which contain basic CSS definitions for all key HTML components. This ensures a uniform, modern appearance of respective components of the web-page. In addition to all these it contains other commonly used interface elements: buttons with advanced features (which includes but is not limited to grouping of button(s) with drop-down option, make and navigation lists, horizontal and vertical tabs, navigation, breadcrumb navigation and pagination), labels, advanced typographic capabilities, thumbnails, warning messages and a progress bar. Bootstrap includes several JavaScript components in the form of jQuery plugins which provide other UI elements like dialog boxes, tooltips and carousels. Some other similar Bootstrap plugins include Dojo Bootstrap or UI Bootstrap which is its implementation using Dojo Toolkit and AngularJS respectively.

Advertisements