Responsive (Mobile) Web Design with Bootstrap Training

Chapter 1. Getting Started with Bootstrap

• What Is Bootstrap
• Keywords from package.json
• Bootstrap History
• Responsive Web Development
• Responsive Grid Layout
• Reusable GUI Components
• JavaScript
• The Mobile First Philosophy
• Why RWD Matters
• Responsive Page Views
• SASS
• Getting Bootstrap
• Bootstrap CSS Content Delivery Network
• Bootstrap JavaScript Content Delivery Network
• Other Setup Options
• The Bootstrap Core Files
• To Min or Not to Min
• Summary

Chapter 2. Basic Bootstrap

• Bootstrap Basic Page Template
• The Viewport Meta Tag
• The user-scalable Property
• Including Bootstrap JavaScript Files
• Plugin Dependencies
• Resetting Styles
• Bootstrap Components
• Containers
• Using Containers
• Device Sizes
• The Grid System
• The Column Arithmetic
• A Grid Example
• CSS Media Queries (1/2)
• CSS Media Queries (2/2)
• Customizing Breakpoints
• Responsive Grid Layout
• Combining Column Styles
• Other Column Operations
• Navigation
• Navigation (Desktop)
• Navigation (Mobile)
• Navigation Source
• Navigation Explained
• Navigation Elements and Styles
• Icons
• Using Icons
• Responsive Images
• Summary

Chapter 3. Bootstrap Miscellaneous Topics

• Bootstrap Components
• Bootstrap Components Web Page
• Integrating Bootstrap Components with jQuery
• Identifying the Required Version of jQuery
• Customizing Bootstrap
• Customizing Sass variables
• More Customization
• Customizing Bootstrap Components
• Light Customizations Steps
•  
• Colors
• Spacing
• Notation (pt 1)
• Notation (pt 2)
• Notation (pt 3)
• Summary

Chapter 4. Bootstrap Components

• Bootstrap Components
• Component List
• Alerts
• Breadcrumb
• Collapse
•  
• List Group (with Badges)
• Badges Example
• Modal
• Progress
• Summary

Chapter 5. jQuery for Bootstrap

• jQuery and Bootstrap
• jQuery Example
• CSS Selectors
• Background – DOM
• The jQuery Function Object
• What Does the $() Function Take as Argument?
• The jQuery Function – Case 1
• The jQuery Function - Case 2
• The jQuery Function – Case 3
• The jQuery Function – Case 4
• The jQuery Wrapper
• The jQuery Wrapper as an Array-Like Object
• Note: innerHTML() vs. .html()
• jQuery Wrapper Chaining
• API Function Notation
• Selecting Elements by Attribute
• Pseudo-Selectors
• Faster Selection
• Saving Selections
• Iterating Through Selected Elements Using .each()
• JavaScript Methods
• JavaScript "this"
• Function Context 1 of 2
• .each() Revisited
• Typical Use Cases
• Handle a Menu Selection
• Hide Content
• Modify Content
• Change a Style
• Summary