Module: UI Design (Frameworks)

Bootstrap 5 is a CSS framework for building cross-browser, responsive user interfaces.

Learning Outcomes

Design using a UI framework

Create high quality technical essays

Readings

Guided tour of the UI Design (Frameworks) module

Why, what, how, and when you will learn about UI Design and framework support.

UI Frameworks

Introduction to user interface frameworks.

Bootstrap 5 Docs

Official Bootstrap 5 Documentation

Browser Color Pickers

How to use browser-based plugins to determine page colors.

7 rules for creating gorgeous UI (Part 1)

A non-artsy primer in digital aesthetics.

7 rules for creating gorgeous UI (Part 2)

A guide to visual aesthetics, written by a nerd

Clean up your mess: A guide to visual design for everyone

If you’re like most people, you feel like a baby when it comes to visual design. You sometimes have a vague sense of what you want, but can’t articulate it or make it come about. All you can do is point and cry…

Bootstrap 5 Hello World

Quick start to using Bootstrap 5 with VSCode

Color Blocked Home Pages

A common design pattern for home pages

Spaces vs non spaces in CSS rules

What’s the difference between ‘.classA.classB’ and ‘.classA .classB’?

Introduction to GitHub Desktop, Part 2 (Branching and Merging)

Branching and merging with GitHub Desktop

freeCodeCamp Full Bootstrap 5 for Beginners

3 hour tutorial

Experiential Learning

E34: BrowserHistory with Bootstrap 5

Make life wonderful with Bootstrap 5

E35: Island Snow with Bootstrap 5

Rebuild the Island Snow home page with Bootstrap 5

E36: Your Choice with Bootstrap 5

Rebuild a site of your choosing with Bootstrap 5

E37: Reflect on UI Frameworks

Write a technical essay summarizing your experience doing the UI Frameworks practice WODs.