Please enable JavaScript to use CodeHS

Utah Web Development 1 and 2

View Syllabus Overview
Bootstrap
Description

In this lesson, students will be introduced to Bootstrap, including who uses Bootstrap and why people would want to use Bootstrap.

Objective

Students will be able to:

  • Explain what Bootstrap is
  • Explain why a web developer would want to use Bootstrap
  • Compare and contrast responsive vs. unresponsive sites
Description

In this lesson, students will learn how to add Bootstrap to a webpage and create the basic structure using Bootstrap’s container classes.

Objective

Students will be able to:

  • Enable Bootstrap on a webpage
  • Create a basic Bootstrap page using container to gather the pieces of the site
  • Explain the difference between container and container-fluid
Description

In this lesson, students will learn how to use Bootstrap’s grid system to create the layout of their webpages.

Objective

Students will be able to:

  • Use Bootstrap’s grid system to structure their webpages
  • Explain the parts of Bootstrap’s grid system
  • Explain how the grid system enables Bootstrap sites to be responsive
Description

In this lesson, students are introduced to page headers, buttons, and icons. They will use different typographies to style the header and sub-header of their webpages. They will use and style buttons to increase interactivity on their webpage.

Objective

Students will be able to:

  • Add title to their webpages by creating page headers
  • Use icons to add widely recognized icons to their webpages to improve usability
  • Create and style buttons
Description

In this lesson, students will learn how easy it is to create beautiful and interactive tables using Bootstrap classes. Students will create galleries of images and links using Bootstrap’s thumbnail class.

Objective

Students will be able to:

  • Create professional looking tables using Bootstrap’s CSS rules for tables
  • Create a gallery of thumbnail images
Description

In this lesson, students will learn how to add a navbar (navigation bar) to their websites.

Objective

Students will be able to:

  • Create a navbar that sits at the top of a webpage
  • Add links to a navbar
Description

In this lesson, students will learn how to make dropdown menus. They will apply dropdown menus to navbars as well as a way of choosing an option elsewhere on the page.

Objective

Students will be able to:

  • Create dropdown menus in a navbar
  • Create dropdown menus as part of the website to redirect to another part of the same page
Description

In this lesson, students will explore the official Bootstrap templates. They will modify an existing webpage to create their own webpage.

Objective

Students will be able to:

  • Use a Bootstrap template and modify the page content
  • Use a Bootstrap template and modify the styles
  • Understand how to properly size images and another media for use on a website
Description

In this lesson, students complete a summative assessment of the unit’s learning objectives.

Objective

Students will be able to:

  • Prove their knowledge of Bootstrap through a multiple choice quiz