Understanding the Twitter Bootstrap role
I imagine that 99% of the developers after a first HTML hello word may think: “this page is very ugly… what do I need to do to make it look better?”. That is the point where we start to learn about css, classes and others.
Unfortunately is not every developer that has the needed skills to create a good looking page. Sometimes we suffer for hours just to align a text inside a HTML div. To solve that kind of problems is that Twitter Bootstrap was born, to help developers like me (and maybe you).
<link href="<c:url value='/resources/css/bootstrap.min.css' />" rel="stylesheet"/> <link href="<c:url value='/resources/css/bootstrap-responsive.min.css' />" rel="stylesheet"/> <script src="<c:url value='/resources/js/jquery-1.9.1.min.js' />"></script> <script src="<c:url value='/resources/js/bootstrap.min.js' />"></script>
After we import those files it is already possible to see some changes in the project.
With Bootstrap it is easy to make a button looking good; all that is needed is to add the class “btn”: <input type=”submit” …/>. What if we want to highlight some div? Just add the classes “alert info”. It is very easy to give a good looking to your project with Twitter Bootstrap.
In the uaiContacts projects it is possible to find Bootstrap’s classes being used. To get more details about this amazing library and see a lot of tutorials go to the site: http://twitter.github.com/bootstrap/.