Expanded

Creating a Living Style Guide with Sass and Vanilla JavaScript

This course will teach you how to create a custom style guide with global helpers and reusable components that you can recycle across different projects.
Course info
Rating
(15)
Level
Intermediate
Updated
Dec 23, 2019
Duration
2h 42m
Table of contents
Description
Course info
Rating
(15)
Level
Intermediate
Updated
Dec 23, 2019
Duration
2h 42m
Your 10-day individual free trial includes:

Expanded library

This course and over 7,000+ additional courses from our full course library.

Hands-on library

Practice and apply knowledge faster in real-world scenarios with projects and interactive courses.
*Available on Premium only
Description

Long-term software projects tend to suffer from multiple issues, including inconsistent branding, code bloat, and poor documentation. In this course, Creating a Living Style Guide with Sass and Vanilla JavaScript, you will gain the ability to architect a style guide that tackles these issues at a core level and bridges the gap between design and development. First, you will learn how to identify the building blocks of a design system. Next, you will discover how to translate these building blocks into modular styles and reusable components. Finally, you will explore how to add stateful styles for user interaction, as well as accessibility for users with different needs. When you are finished with this course, you will have the skills and knowledge of style guide driven development needed to build a lightweight, custom style guide.

About the author
About the author

Karen Menezes is a freelance UI developer and author who specializes in CSS.

More from the author
Section Introduction Transcripts
Section Introduction Transcripts

Course Overview
[Autogenerated] Hi, everyone. My name is Karen Menezes and welcome to my course, creating a living style guide with sass and vanilla JavaScript. I'm a front end developer with eight years of experience in building modular responsive web interfaces. Living style guides form the bridge between design and development and keep the code based clean and maintainable. In this course, we are going to dive into the fundamentals of style guide driven development on build our very own custom style guide for a Web application. Some off The major topics that we will cover include analyzing the building blocks of design, creating a lightweight style guide boilerplate with sass and vanilla JavaScript. Using Global's styling, native HTML elements on building components and adding state ful styles and accessibility to the style guide. By the end of this course, you'll know how to architect and built a living style guide that can be reused across different projects before beginning the course. You should be familiar with sass and know the basics off JavaScript. I hope you'll join me on this journey to learn the fundamentals off style guide driven development with the creating a living style guide with sass and vanilla JavaScript course by Pluralsight IE6