Learning LESS
4.4 (10 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
101 students enrolled
Wishlisted Wishlist

Please confirm that you want to add Learning LESS to your Wishlist.

Add to Wishlist

Learning LESS

Get to grips with the CSS preprocessing language LESS
4.4 (10 ratings)
Instead of using a simple lifetime average, Udemy calculates a course's star rating by considering a number of different factors such as the number of ratings, the age of ratings, and the likelihood of fraudulent ratings.
101 students enrolled
Created by Packt Publishing
Last updated 3/2016
Price: $75
30-Day Money-Back Guarantee
  • 1.5 hours on-demand video
  • 1 Supplemental Resource
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
What Will I Learn?
  • Get to know the basics of CSS preprocessing so you can work with LESS effortlessly
  • Automate the processing of LESS with task runners
  • Get to know about variables and the best ways to use them within your LESS files
  • Nest your CSS to improve readability
  • Power-up your code with mixins
  • Work with parametric mixins to customize their output
  • Make your code more maintainable by using Extends
  • Get smart with functions by using Color functions, Math functions, and Image functions
  • Use the built-in functions with LESS to produce your own color palette
  • Discover more tools to help level-up your frontend toolkit
View Curriculum
  • This course takes a casual-yet-direct approach to learning LESS. We’ll talk through the features and then get hands-on building out some styles. You’ll learn by doing!

CSS is great; it’s a staple of the web and it helps us to produce beautiful websites, but some parts of it are archaic, and it’s often time-consuming to get right. LESS changes that. LESS includes built-in features that allow you to speed up your development and make your stylesheets easier to produce.

Learning LESS will guide you through the basics of setting up LESS within your workflow. LESS is like CSS on steroids. This course will introduce you to the main features of the language and leave you with the know-how required to make your stylesheets more efficient and maintainable.

This course starts with the fundamentals and shows you how powerful LESS can be. We’ll start by introducing you to the language, followed by incorporating LESS into our workflow, including automation and taskrunners. You’ll learn what variables do and how to use them. You’ll then find out how to create maintainable CSS using mixins and extends, and you’ll discover the best way to organise your LESS code. We’ll look at the powerful built-in functions and finally examine the other ways to power up our front-end development workflow!

Learning LESS takes you from zero to hero, leaving you with the expertise required to produce efficient stylesheets.

About The Author

Anthony Killeen is a veteran front-end developer who has been building websites since ‘97. In that time, he’s built websites for radio stations, music artists, photographers, communities, and businesses and he’s loved every single minute of it!

Who is the target audience?
  • This video is for front-end developers who are used to using CSS, but want to expand their skill set and improve the speed of their workflow.
Students Who Viewed This Course Also Viewed
Curriculum For This Course
25 Lectures
Introduction to LESS
3 Lectures 07:05

This video provides you with an overview of the entire course.

Preview 01:42

The aim of this video is to describe what LESS is and what a CSS preprocessor does.

What Is LESS?

This highlights just how easy LESS is to work with if you already know CSS.

Woah! It's That Easy, Huh?
Getting LESS into Your Current Workflow
4 Lectures 22:25

The aim of this video is to show the viewer the easiest (but not necessarily the best) way to get up and running with LESS using the direct LESS.js file parser.

Preview 05:02

The aim of this video is to show the viewer how to set up a task runner such as Grunt to automate her processing.

Using a Task Runner

The aim of this video is to show the viewer how to use third-party software to process LESS files.

Using Third-party Software

We'll take a look at using your code editor to convert LESS on the fly.

Using Our Code Editor
Variables Can Make Our Lives Easier
4 Lectures 14:08

We will explain what variables are and how they work.

Preview 05:59

In this, we will take LESS variables beyond basic usage.

Advanced Variable Usage

Nesting our LESS selectors can help in organizing our code into useful chunks, and this video will look at the good and bad points of nesting.

Basics: Nesting

This video will show you how to keep our code organized and in order.

Advanced: Nesting
6 Lectures 21:25

Mixins are an awesome feature of LESS, but it’s difficult to understand what they do.

Preview 03:37

Browsers can be a pain, especially with CSS3 selectors. Some browsers enable this functionality but behind a flag while the CSS specification is being finalized.

Using Mixins for Cross-browser Compatibility

The mixins we’ve written so far are fixed. If we wanted to change one of the values within our mixin, we could either write a new mixin or copy the code into our core LESS file, removing the mixins altogether. This video shows how to bring arguments into our mixins.

Parametric Mixins

We looked at a mixin that I’ve written. Now, you can start writing your own.

Writing Your Own Mixins

Sometimes, it may feel like a chore when you’re constantly including core classes within your HTML. LESS extends can help you avoid this.

Writing LESS Code with Extends

Our .less file may quickly become bloated with variables, mixins, extends, and functions.

A Final Word on Organization
Power Up Your Code with LESS Functions
4 Lectures 20:48

While building our color palette, we may want to have varying shades of our primary colors. We would want an easy way to adjust the colors.

Preview 03:46

This video covers more ways of manipulating color.

Advanced Color Functions

Oh no! We need to add padding to an element, but this value is the sum of two other values.

Math Functions

This video shows you some of the additional features of LESS.

Image Tools and Other Available Functions
Power Up Your Frontend Tool-kit
4 Lectures 16:57

Learn about automating repetitive tasks when developing websites.

Preview 03:59

Set up a prewritten set of LESS mixins.

LESS Prefixer

Writing code can sometimes be repetitive and laborious. Emmet fixes this.


So, we now know the basics of LESS and how to integrate LESS into our workflow, and we also have some new tools to help us out. So, where do we go from here?

So, Where Do We Go from Here?
About the Instructor
Packt Publishing
3.9 Average rating
8,175 Reviews
58,705 Students
686 Courses
Tech Knowledge in Motion

Packt has been committed to developer learning since 2004. A lot has changed in software since then - but Packt has remained responsive to these changes, continuing to look forward at the trends and tools defining the way we work and live. And how to put them to work.

With an extensive library of content - more than 4000 books and video courses -Packt's mission is to help developers stay relevant in a rapidly changing world. From new web frameworks and programming languages, to cutting edge data analytics, and DevOps, Packt takes software professionals in every field to what's important to them now.

From skills that will help you to develop and future proof your career to immediate solutions to every day tech challenges, Packt is a go-to resource to make you a better, smarter developer.

Packt Udemy courses continue this tradition, bringing you comprehensive yet concise video courses straight from the experts.