Course in Twitter Bootstrap

Course in designing web apps using Twitter Bootstrap

Twitter Bootstrap has reformed web UI design from the ground up. From having been an art form granted to the few, web UI design have now become a walk in the park and it is easy to created complex layouts with nested columns, panels/cards, accordions, sliding images and more.

This practically oriented course concerns web app developers that quickly need to be productive in using Bootstrap.

This is what you will learn
  • Create various layout types based on grids
  • Being able to design good looking cards (panels/widgets)
  • Being able to design navigational elements, such as tabbed panes and side-menues
  • Hantera font icons
Course Contents

Background and Overview

  • Why Twitter Bootstrap is awesome
  • Bootstrap components
  • HTML5 doctypes
  • Viewports
  • Containers
  • Installation and linkage of Bootstrap

Typography

  • Simple span and block elements
  • Standardized color system
  • Buttons
  • Images
  • Tables
  • Helper CSS classes

Page Layout

  • Grid system
  • Navbars
  • Sidebars

Font Icons

  • What is a font icon and why is it smart use
  • Glyphicons
  • Fontawesome
  • Simple icon markup
  • Icons within other components

Components

  • Dropdown menues
  • Button groups
  • Labels and badges
  • Breadcrumbs
  • Alerts
  • Progressbars
  • Panels and wells

Widgets

  • Tabbed panes
  • Scrollspy
  • Tooltips and popovers
  • Modal popups
  • Alerts
  • Collapsible panes and accordions
  • Carousel

Bootstrap Themes

  • Where to find themes
  • What to expect from commercial themes

Brief about Build Tools

  • Why you need a build tool
  • Node JS and its package mananger NPM
  • Bower
  • Gulp
  • Building a Bootstrap site using gulp
Facts
NameTwitter Bootstrap
Duration 1 Days
LevelBeginner
AudienceWeb app developers
Prerequisites Working knowledge of programming in HTML/CSS
Tools
  • NodeJS
  • JetBrain WebStorm IDE
  • Google Chrome
On-Site Course

If you order an On-Site course, we will come to you and hold the course in your office. The price is determined by our price model and is based on the number of course days, number of participants and any travel and lodging.

Read more about out price modell and term of sales here.

Related Courses
CourseDaysLevel
JavaScript3 Beginner Show
Angular4 BeginnerShow