Developing Websites and Front-Ends with Bootstrap

Developing Websites and Front-Ends with Bootstrap

This course is part of IBM Front-End Developer Professional Certificate

Instructors: IBM Skills Network Team

What you'll learn

Summarize key features and benefits of using Bootstrap
Demonstrate your proficiency in building flexible and responsive websites using Bootstrap

Details to know

Earn a career certificate

Add to your LinkedIn profile

Assessments

5 assignments

Taught in English

See how employees at top companies are mastering in-demand skills

Learn more about Coursera for Business

Build your Mobile and Web Development expertise

This course is part of the IBM Front-End Developer Professional Certificate

When you enroll in this course, you'll also be enrolled in this Professional Certificate.

Learn new concepts from industry experts
Gain a foundational understanding of a subject or tool
Develop job-relevant skills with hands-on projects
Earn a shareable career certificate from IBM

Earn a career certificate

Add this credential to your LinkedIn profile, resume, or CV

Share it on social media and in your performance review

There are 3 modules in this course

Building flexible, fast, and responsive websites and front-ends with a consistent look and feel has become a basic requirement. To accomplish this, the use of libraries and frameworks is trending. As a front-end developer, it is important that you know at least one front-end framework.

Bootstrap is a CSS framework that provides an extensive set of templates that help with speeding up the website development process. According to W3Tech.com, Bootstrap is a popular CSS framework that is used by 18.7% of all the websites, that is a CSS framework market share of 78.6%. In this short course, which is part of the IBM Front-End Developer Professional Certificate, you will not only equip yourself with concepts but get several opportunities to practice building website components using Bootstrap. After completing this course, you will be able to: - Describe the features of Bootstrap - Set up Bootstrap for a project using a suitable method - Outline key classes and components offered by Bootstrap - Create a simple React app and use Bootstrap for styling - Create a responsive grid layout - Demonstrate your proficiency in using Bootstrap classes and components to build responsive websites

Bootstrap is a popular framework widely used for front-end development. This module provides you with an overview of Bootstrap and its key concepts. You will get familiar with Bootstrap features for layouts, content, and form. Then, you will get to experience how you can set up Bootstrap for a project. Finally, the module will briefly introduce Bootstrap themes.

What's included

6 videos2 readings2 assignments2 plugins

6 videosTotal 37 minutes

Course Introduction3 minutesPreview module
Overview of Bootstrap6 minutes
Setting Up Bootstrap6 minutes
Essential Concepts of Bootstrap 7 minutes
Layouts, Contents, and Forms in Bootstrap8 minutes
Browser Compatibility of Bootstrap5 minutes

2 readingsTotal 7 minutes

Course Overview and Prerequisites5 minutes
Helpful Tips for Course Completion2 minutes

2 assignmentsTotal 21 minutes

Module 1 Graded Quiz: Getting Started with Bootstrap15 minutes
Module 1 Practice Quiz: Getting Started with Bootstrap6 minutes

2 pluginsTotal 35 minutes

Hands-on Lab: Getting Started with Bootstrap30 minutes
Reading: Bootstrap Themes5 minutes

Module 2 will introduce to the different types of Bootstrap components. You will then apply some key Bootstrap classes, styles, and components to build different responsive website components. You will also learn about the Bootstrap icons and experience the power of Bootstrap-React integration by developing a simple application.

What's included

5 videos2 assignments4 app items2 plugins

5 videosTotal 35 minutes

Getting Started with Components7 minutesPreview module
Utilities7 minutes
Helpers in Bootstrap7 minutes
Bootstrap Icons6 minutes
Cards and Grid System in Bootstrap7 minutes

2 assignmentsTotal 16 minutes

Module 2 Graded Quiz: Intermediate Bootstrap10 minutes
Module 2 Practice Quiz: Intermediate Bootstrap6 minutes

4 app itemsTotal 240 minutes

Hands-on Lab: Working with Bootstrap Alert Buttons60 minutes
[OPTIONAL] Hands-on Lab: Creating a Year Validation Component in React and Using Bootstrap Styling60 minutes
Hands-on Lab: Working with the Responsive Grid System 60 minutes
Hands-On Lab: Implementing Bootstrap Pre-built Components60 minutes

2 pluginsTotal 20 minutes

[OPTIONAL] Reading: React Integration with Bootstrap5 minutes
Reading: Understanding Pre-built Components in Bootstrap15 minutes

In this module, you will complete a final project where you will have an opportunity to demonstrate your proficiency in Bootstrap. Next, the final exam will test your knowledge of the course’s content including the essential concepts, Bootstrap components, and their application.