Bootstrap is a powerful framework to empower and enhance frontend web designing. Version 3 comes with a plethora of features including a mobile-first responsive grid, LESS variables, tailor-made components, and plugins that help users design dynamic user interfaces. With the advent of mobile web development, owing to the fact that mobiles and tablets are increasingly becoming the de facto standard for using the Internet, it is essential that websites are developed from a mobile-first perspective and then adapted to larger screens for desktops and notebooks. Bootstrap is batteries-loaded meaning that it packs it all with expertly crafted solutions and attributes that help developers to accomplish difficult tasks with ease and greater speed. Apart from its built-in features, it gets vibrant support from the community mainly in terms of additional resources and third-party utilities that take out a great deal of guesswork when it comes to difficult layout styles resulting in enterprise-grade and aesthetic web applications. Learning Bootstrap is a comprehensive source to help you get to grips with the technical know-how enabling you to know the ins and outs of Bootstrap in an easy-to-follow format.
Chapter 1, Getting Started with Bootstrap, is a short introduction to the technology. This chapter explains the need for Bootstrap in addition to explaining the paradigm related to the mobile-first approach adopted by Bootstrap to streamline web designing.
Chapter 2, Installing and Customizing Bootstrap, discusses the inclusion of Bootstrap with relevant information, overriding with customized styles, the deep customization of Bootstrap, and compiling LESS files in a practical manner.
Chapter 3, Using the Bootstrap Grid, starts with usage of the Bootstrap Grid classes wherein you learn about adding rows and columns and offsets, nesting of columns, and using the different variables and mixins and summing it up with a real-time example of creating a custom blog layout.
Chapter 4, Using the Base CSS, builds up from explaining the typography and subsequently moves on to explain the various facets of CSS including tables, forms, buttons, and the various responsive utilities in a step-by-step approach also including the helper classes used extensively in Bootstrap.
Chapter 5, Adding Bootstrap Components, incorporates the learning of the popular components such as the Glyphicons and Breadcrumbs in addition to the different navigation components such as nav tabs, nav pills, and dropdowns, which help you to build interactive webpages.
Chapter 6, Doing More with Components, contains an extensive in-depth understanding of the remaining components such as wells, labels, progress bars, badges, panels, alerts, and pagination, which form a crux of modern websites enabling you to build aesthetic websites.
Chapter 7, Enhancing User Experience with JavaScript, deals with official and optional plugins to create modals, carousels, tooltips, and accordion, which empowers you to develop dynamic webpages in a jiffy thereby eliminating the need to write exhaustive and humongous code for those attributes.
Chapter 8, Bootstrap Technical Hub – A One-stop Shop for Powerful Bootstrap Utilities, helps you to leverage the benefits of third-party toolkits and themes tailored to streamline your web designing experience with Bootstrap. This section is a one-stop solution to a plethora of relevant resources such as templates, custom layouts, and code snippets that enable to build robust user interfaces in quick time and with minimum effort. It also includes an overview of the future of Bootstrap, the next steps, and the myriad compatibility with WordPress, Joomla, and the likes of it which make an imperative framework for futuristic web design.
Bonus Chapter, Building an E-Commerce Website with Bootstrap, describes the procedure to build a modern e-commerce website in a step-by-step format, which will help you to understand the web designing aspects in a real-world scenario. This bonus chapter is a sample example for readers who want to leverage the knowledge gained to build enterprise-level websites with relative ease in a systematic and efficient manner. This chapter can be found online at https://www.packtpub.com/sites/default/files/downloads/Building%20an%20e-commerce%20Website%20with%20Bootstrap.pdf.
Apart from the basic fundamentals of HTML, CSS, and JavaScript, you would need an editor such as Notepad or Notepad++ to work with the examples in this book. Though we have written most of the code in Notepad, you may prefer to use Notepad++ as it is open source, advanced, and is loaded with features such as syntax highlighting and syntax folding, which help you code in a well organized way.
Learning Bootstrap is for budding as well as proficient web designers and developers who want to build professional-looking, dynamic websites. Basic knowledge of HTML, HTML5, and CSS in addition to a little bit of JavaScript (very basic) is required for aspiring users looking to implement Bootstrap in their development process. Prior knowledge of Bootstrap is not needed as the learning guide equips you with all the know-how required to incorporate Bootstrap into your pet projects.
In this book, you will find a number of text styles that distinguish between different kinds of information. Here are some examples of these styles and an explanation of their meaning.
Code words in text, database table names, folder names, filenames, file extensions, pathnames, dummy URLs, user input, and Twitter handles are shown as follows: "You will find that we have used the minified versions, that is, bootstrap.min.js and bootstrap.min.css, to lower the file size resulting in faster loading of the website."
A block of code is set as follows:
#packt {
padding: 19px 30px;
-webkit-border-radius: 35px;
-moz-border-radius: 35px;
border-radius: 35px;
color: red
}When we wish to draw your attention to a particular part of a code block, the relevant lines or items are set in bold:
#packt {
padding: 19px 30px;
-webkit-border-radius: 35px;
-moz-border-radius: 35px;
border-radius: 35px;
color: red
}Any command-line input or output is written as follows:
lessc --yui-compress bootstrap.less > bootstrap.min.css
New terms and important words are shown in bold. Words that you see on the screen, for example, in menus or dialog boxes, appear in the text like this: "Click on the Download Bootstrap button and the file will be downloaded in the ZIP format."
Feedback from our readers is always welcome. Let us know what you think about this book—what you liked or disliked. Reader feedback is important for us as it helps us develop titles that you will really get the most out of.
To send us general feedback, simply e-mail <[email protected]>, and mention the book's title in the subject of your message.
If there is a topic that you have expertise in and you are interested in either writing or contributing to a book, see our author guide at www.packtpub.com/authors.
Now that you are the proud owner of a Packt book, we have a number of things to help you to get the most from your purchase.
You can download the example code files from your account at http://www.packtpub.com for all the Packt Publishing books you have purchased. If you purchased this book elsewhere, you can visit http://www.packtpub.com/support and register to have the files e-mailed directly to you.
Although we have taken every care to ensure the accuracy of our content, mistakes do happen. If you find a mistake in one of our books—maybe a mistake in the text or the code—we would be grateful if you could report this to us. By doing so, you can save other readers from frustration and help us improve subsequent versions of this book. If you find any errata, please report them by visiting http://www.packtpub.com/submit-errata, selecting your book, clicking on the Errata Submission Form link, and entering the details of your errata. Once your errata are verified, your submission will be accepted and the errata will be uploaded to our website or added to any list of existing errata under the Errata section of that title.
To view the previously submitted errata, go to https://www.packtpub.com/books/content/support and enter the name of the book in the search field. The required information will appear under the Errata section.
Piracy of copyrighted material on the Internet is an ongoing problem across all media. At Packt, we take the protection of our copyright and licenses very seriously. If you come across any illegal copies of our works in any form on the Internet, please provide us with the location address or website name immediately so that we can pursue a remedy.
Please contact us at <[email protected]> with a link to the suspected pirated material.
We appreciate your help in protecting our authors and our ability to bring you valuable content.
If you have a problem with any aspect of this book, you can contact us at <[email protected]>, and we will do our best to address the problem.