Mobile First Bootstrap

Mobile First Bootstrap
eBook: $20.99
Formats: PDF, PacktLib, ePub and Mobi formats
save 15%!
Print + free eBook + free PacktLib access to the book: $55.98    Print cover: $34.99
save 6%!
Free Shipping!
UK, US, Europe and selected countries in Asia.
Also available on:
Table of Contents
Sample Chapters
  • Get to grips with the essentials of mobile-first development with Bootstrap
  • Understand the entire process of building a mobile-first website with Bootstrap from scratch
  • Packed with screenshots that help guide you through how to build an appealing website from a mobile-first perspective with the help of a real-world example

Book Details

Language : English
Paperback : 92 pages [ 235mm x 191mm ]
Release Date : December 2013
ISBN : 1783285796
ISBN 13 : 9781783285792
Author(s) : Alexandre Magno
Topics and Technologies : All Books, Mobile Application Development, Open Source

Table of Contents

Chapter 1: Bootstrap 3.0 is Mobile First
Chapter 2: Designing Stylesheet in Bootstrap 3
Chapter 3: JavaScript, the Behavior in Mobile First Development
Chapter 4: Getting it All Together – a Simple Twitter App
Chapter 5: Performance Matters
  • Chapter 1: Bootstrap 3.0 is Mobile First
    • Bootstrap reviewed
    • Desktop to responsive
    • The new mindset – Mobile First
    • Practical example – The responsive dropdown
    • Now Bootstrap uses Bower and Jekyll
    • Running the docs
      • Version 3 in progress in the Github repository
      • Installing Jekyll
    • Bower
      • First step to responsiveness
    • Making changes in the Bootstrap source code
      • Running tests
    • Summary
  • Chapter 2: Designing Stylesheet in Bootstrap 3
    • The grid system
      • Semantic grids
      • The grid framework
      • Breakpoints and completely fluid layouts
      • Predefined classes to control responsive flow
    • Forms in different resolutions
    • The icon library
    • Responsive utilities
      • Responsive classes
      • Semantic grid variables and functions
    • Relative units
    • Navigation
    • Summary
  • Chapter 3: JavaScript, the Behavior in Mobile First Development
    • The carousel example
      • A touch of enhancement
    • Data attributes
    • Mobile First and progressive enhancements
      • Be semantic in your HTML markup
    • Unobtrusive JavaScript
    • Follow the Bootstrap tips about accessibility
      • Test a site in a lynx browser
    • Namespace events
    • JavaScript on the server
    • Summary
  • Chapter 4: Getting it All Together – a Simple Twitter App
    • Bootstrapping our application
      • Inserting a customizable version of Bootstrap
      • The project template
    • The Bootstrap modal component example
    • Geolocation
    • The Twitter API search
      • Make a search
    • Going from a tablet device to desktop screen resolution
    • The choice between a web app and mobile application
    • Summary

Alexandre Magno

Alexandre Magno has worked for 10 years as a web developer, and is currently working as a software engineer at He is a very active contributor in the open source community with plenty of projects and acts as a jQuery evangelist and a responsive design missionary. As a multidisciplinary developer, he has strong experience in a wide range of server-side frameworks and CMS such as Ruby on Rails, Django, WordPress, and exploring Node.js. He has developed many libraries that are widely used at, and was one of the first developers to develop mobile websites with a responsive design in the company he worked at. He is an active contributor of Twitter Bootstrap and the creator of one of its branches, the Globo Bootstrap, which is the first translation of Bootstrap to Portuguese, and also developed some components used in He is very passionate about web development, and he writes about it in his blog at He has already contributed in the publishing of a web magazine about jQuery UI and has even made presentations in some technical events, such as the International Free Software Forum (FISL). Writing this book for him is a great step further, after these achievements. Besides technology, he is a musician and song writer too. He likes to remember every moment of his life with a music lyric. At this moment, for example, the verse would be "We are the champions, my friend".
Sorry, we don't have any reviews for this title yet.

Code Downloads

Download the code and support files for this book.

Submit Errata

Please let us know if you have found any errors not listed on this list by completing our errata submission form. Our editors will check them and add them to this list. Thank you.


- 2 submitted: last submission 25 Mar 2014

Type: typo | Page no: 14

The given sentence is :

The Web is growing too in a different way alexmagno December 9, 2013 10:58 AM from native applications

This should be:

The Web is growing too in a different way by using native applications



Type: typo | Page no: 23

The given sentence is:

All grid placements, are CSS responsibility

This should be:

All grid placements are CSS responsibility


Type: typo | Page no: 14


The given sentence is:

Simplifying need be expensive or time consuming

This should be:

Simplifying needs can be expensive or time consuming


Type: Code | Page no: 45

Given : <button type="button" class="btn btn-link">Link</a>

Should be: <button type="button" class="btn btn-link">link</button>


Sample chapters

You can view our sample chapters and prefaces of this title on PacktLib or download sample chapters in PDF format.

Frequently bought together

Mobile First Bootstrap +    Bootstrap Site Blueprints =
50% Off
the second eBook
Price for both: $33.45

Buy both these recommended eBooks together and get 50% off the cheapest eBook.

What you will learn from this book

  • Develop websites using the mobile-first approach
  • Use the new Bootstrap grid system
  • Develop a mobile-first website from scratch with the help of a practical example of a live website
  • Deal with responsive design performance issues
  • Use Bootstrap as a kick-start framework to develop your websites for mobile, tablets, and desktop
  • Learn the best design decisions to make your frontend scalable for any device

In Detail

Bootstrap changes the way we develop websites in the frontend, and mobile web development has grown incredibly over the past few years. There are over 1.2 billion mobile web users in the world, and 25% of those mobile web users are exclusively mobile. Now, Bootstrap has also gone mobile-first. The mobile-first version of Bootstrap lets you first think about the mobile site and then think about how it expands to larger screens. To build websites for mobile devices that improve the overall experience of your customers, you need to be skilled at using the mobile-first feature of Bootstrap.

Mobile First Bootstrap covers the new features in Bootstrap 3 and focuses on how they affect development from a mobile-first perspective. It will show you how to use Bootstrap 3 for developing websites for mobile and how to use that knowledge for your own development projects.

The book starts by highlighting the new changes that have been made to Bootstrap 3. After learning about these new features, you will discover how to easily build websites for mobile. You will learn how to run Bootstrap 3 Docs to customize Bootstrap for your needs. You will then be introduced to the new mobile grid system, the responsive utilities, and how to use mobile-first for navigation. Then, using JavaScript, you will explore the power of data attributes and progressive enhancement before starting to develop a web project from scratch. The last section of the book will discuss the main issues that affect the performance of Bootstrap as well as the issues that arise while dealing with responsive images.

Mobile First Bootstrap guides you through everything you need to know about Bootstrap 3 and helps you to understand and use the mobile-first approach in your own projects with the help of an example project.


A practical, step-by-step tutorial on developing websites for mobile using Bootstrap.

Who this book is for

This book is for anyone who wants to get acquainted with the new features available in Bootstrap 3 and who wants to develop websites with the mobile-first feature of Bootstrap. The reader should have a basic knowledge of Bootstrap as a frontend framework.

Code Download and Errata
Packt Anytime, Anywhere
Register Books
Print Upgrades
eBook Downloads
Video Support
Contact Us
Awards Voting Nominations Previous Winners
Judges Open Source CMS Hall Of Fame CMS Most Promising Open Source Project Open Source E-Commerce Applications Open Source JavaScript Library Open Source Graphics Software
Open Source CMS Hall Of Fame CMS Most Promising Open Source Project Open Source E-Commerce Applications Open Source JavaScript Library Open Source Graphics Software