Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll

Bootstrap Basics

Preview

Start a free Courses trial
to watch this video

Sign up for Treehouse

Rapid Development with Bootstrap

2:01 with Guil Hernandez

In this course, you'll learn how Bootstrap, one of the most popular open-source front-end frameworks, can help you build a functional design and layout in little time. This course assumes you have a basic understanding of HTML and CSS, so make sure you complete the prerequisites for this course before continuing.

Resources

Advantages of Bootstrap

  • Bootstrap makes front end web development faster and easier by using some of the latest front end tools
  • Bootstrap provides reusable HTML and CSS for common elements like buttons, forms, navigations, grids, and more
  • Add interactivity to your site with Bootstrap's custom JavaScript plugins
  • One of the best parts of Bootstrap is cross-browser compatibility
  • Your code will work on every device, from phones to tablets, to desktop computers

Related Discussions

Have questions about this video? Start a discussion with the community and Treehouse staff.

Sign up

    Related Discussions

    Have questions about this video? Start a discussion with the community and Treehouse staff.

    Sign up

    [MUSIC] 0:00
    When you start to build a website or app, 0:04
    how often do you ask yourself what front-end tools should I use? 0:06
    What about the layout? 0:09
    Should I use floats, a grid system, or venture in a flexbox? 0:10
    Do I use pixels or ems for the typography and media queries? 0:14
    What about browser compatibility? 0:16
    And so on and so on. 0:18
    Sometimes the toughest part about building a website or 0:20
    app is knowing where to start or how to design and build the thing. 0:23
    I'm Guil, a fine-art teacher here at Treehouse. 0:27
    In this course, 0:29
    I'll teach you how Bootstrap, one of the most popular open source front-end 0:30
    frameworks can help you build a functional design and layout in little time. 0:34
    One of the biggest advantages of using Bootstrap is development speed. 0:37
    Bootstrap makes web development faster and easier, using some of the latest and 0:41
    most advanced front-end tools. 0:46
    So instead of designing and coding your site app from scratch, you can 0:48
    take advantage of Bootstrap's ready-made components to help you get started. 0:52
    The bootstrap framework comes with reusable HTML and CSS for common elements, 0:57
    like buttons, forms, navigations, grids and lots more. 1:01
    And you can easily add interactivity to many of the components with over a dozen 1:05
    custom JavaScript plugins without having to write a single line of JavaScript. 1:09
    And one of the best parts about Bootstrap is cross-browser compatibility. 1:14
    There's no need to spend hours testing how your responsive design looks and 1:18
    works in IE, Safari, Firefox, and Chrome. 1:21
    Bootstrap already figured out that part for us. 1:24
    It offers you tried and tested cross-browser code that just works. 1:27
    In fact, your code will work on every device, 1:31
    from phones to tablets to desktop devices. 1:34
    This will all start to make more sense once we crack open 1:37
    the Bootstrap documentation, and begin building a website for 1:40
    a fictitious JavaScript conference called Full Stack Conf. 1:43
    By the end of this course, you'll know how to use Bootstrap to streamline and 1:46
    speed up your front-end work load. 1:50
    But before we start, this course assumes you have a basic understanding of HTML and 1:52
    CSS, so make sure you complete the prerequisites for 1:57
    this course before continuing. 1:59

    You need to sign up for Treehouse in order to download course files.

    Sign up

      You need to sign up for Treehouse in order to set up Workspace

      Sign up