Learning LESS

Course

Online

£ 10 VAT inc.

Description

  • Type

    Course

  • Methodology

    Online

  • Start date

    Different dates available

Get to grips with the CSS preprocessing language LESSCSS 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 AuthorAnthony 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!

Facilities

Location

Start date

Online

Start date

Different dates availableEnrolment now open

About this course

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

Questions & Answers

Add your question

Our advisors and other users will be able to reply to you

Who would you like to address this question to?

Fill in your details to get a reply

We will only publish your name and question

Reviews

This centre's achievements

2021

All courses are up to date

The average rating is higher than 3.7

More than 50 reviews in the last 12 months

This centre has featured on Emagister for 4 years

Subjects

  • Works
  • Workflow
  • Syntax
  • Install

Course programme

Introduction to LESS 3 lectures 07:06 The Course Overview This video provides you with an overview of the entire course. What Is LESS? The aim of this video is to describe what LESS is and what a CSS preprocessor does.
  • Learn how LESS and CSS are similar in syntax
  • Learn how LESS works and how it can improve our work
  • Learn converting LESS into CSS and the output
Woah! It's That Easy, Huh? This highlights just how easy LESS is to work with if you already know CSS.
  • Learn some standard CSS
  • Learn the equivalent in LESS
  • Check out the similarities between the two
Introduction to LESS 3 lectures 07:06 The Course Overview This video provides you with an overview of the entire course. What Is LESS? The aim of this video is to describe what LESS is and what a CSS preprocessor does.
  • Learn how LESS and CSS are similar in syntax
  • Learn how LESS works and how it can improve our work
  • Learn converting LESS into CSS and the output
Woah! It's That Easy, Huh? This highlights just how easy LESS is to work with if you already know CSS.
  • Learn some standard CSS
  • Learn the equivalent in LESS
  • Check out the similarities between the two
The Course Overview This video provides you with an overview of the entire course. The Course Overview This video provides you with an overview of the entire course. The Course Overview This video provides you with an overview of the entire course. The Course Overview This video provides you with an overview of the entire course. This video provides you with an overview of the entire course. This video provides you with an overview of the entire course. What Is LESS? The aim of this video is to describe what LESS is and what a CSS preprocessor does.
  • Learn how LESS and CSS are similar in syntax
  • Learn how LESS works and how it can improve our work
  • Learn converting LESS into CSS and the output
What Is LESS? The aim of this video is to describe what LESS is and what a CSS preprocessor does.
  • Learn how LESS and CSS are similar in syntax
  • Learn how LESS works and how it can improve our work
  • Learn converting LESS into CSS and the output
What Is LESS? The aim of this video is to describe what LESS is and what a CSS preprocessor does.
  • Learn how LESS and CSS are similar in syntax
  • Learn how LESS works and how it can improve our work
  • Learn converting LESS into CSS and the output
What Is LESS? The aim of this video is to describe what LESS is and what a CSS preprocessor does.
  • Learn how LESS and CSS are similar in syntax
  • Learn how LESS works and how it can improve our work
  • Learn converting LESS into CSS and the output
The aim of this video is to describe what LESS is and what a CSS preprocessor does.
  • Learn how LESS and CSS are similar in syntax
  • Learn how LESS works and how it can improve our work
  • Learn converting LESS into CSS and the output
The aim of this video is to describe what LESS is and what a CSS preprocessor does.
  • Learn how LESS and CSS are similar in syntax
  • Learn how LESS works and how it can improve our work
  • Learn converting LESS into CSS and the output
Woah! It's That Easy, Huh? This highlights just how easy LESS is to work with if you already know CSS.
  • Learn some standard CSS
  • Learn the equivalent in LESS
  • Check out the similarities between the two
Woah! It's That Easy, Huh? This highlights just how easy LESS is to work with if you already know CSS.
  • Learn some standard CSS
  • Learn the equivalent in LESS
  • Check out the similarities between the two
Woah! It's That Easy, Huh? This highlights just how easy LESS is to work with if you already know CSS.
  • Learn some standard CSS
  • Learn the equivalent in LESS
  • Check out the similarities between the two
Woah! It's That Easy, Huh? This highlights just how easy LESS is to work with if you already know CSS.
  • Learn some standard CSS
  • Learn the equivalent in LESS
  • Check out the similarities between the two
This highlights just how easy LESS is to work with if you already know CSS.
  • Learn some standard CSS
  • Learn the equivalent in LESS
  • Check out the similarities between the two
This highlights just how easy LESS is to work with if you already know CSS.
  • Learn some standard CSS
  • Learn the equivalent in LESS
  • Check out the similarities between the two
Getting LESS into Your Current Workflow 4 lectures 22:26 LESS.js 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.
  • Include the LESS.js file
  • Include the styles.less file
  • View it in the browser
Using a Task Runner The aim of this video is to show the viewer how to set up a task runner such as Grunt to automate her processing.
  • Install the LESS Grunt or Gulp plugin
  • Set up the plugin
  • Run the plugin
Using Third-party Software The aim of this video is to show the viewer how to use third-party software to process LESS files.
  • Download and install the third-party software
  • Set up the software
  • Run the software
Using Our Code Editor We'll take a look at using your code editor to convert LESS on the fly.
  • Open your code editor
  • Locate and install the plugin
  • Run the plugin
Getting LESS into Your Current Workflow 4 lectures 22:26 LESS.js 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.
  • Include the LESS.js file
  • Include the styles.less file
  • View it in the browser
Using a Task Runner The aim of this video is to show the viewer how to set up a task runner such as Grunt to automate her processing.
  • Install the LESS Grunt or Gulp plugin
  • Set up the plugin
  • Run the plugin
Using Third-party Software The aim of this video is to show the viewer how to use third-party software to process LESS files.
  • Download and install the third-party software
  • Set up the software
  • Run the software
Using Our Code Editor We'll take a look at using your code editor to convert LESS on the fly.
  • Open your code editor
  • Locate and install the plugin
  • Run the plugin
LESS.js 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.
  • Include the LESS.js file
  • Include the styles.less file
  • View it in the browser
LESS.js 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.
  • Include the LESS.js file
  • Include the styles.less file
  • View it in the browser
LESS.js 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.
  • Include the LESS.js file
  • Include the styles.less file
  • View it in the browser
LESS.js 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.
  • Include the LESS.js file
  • Include the styles.less file
  • View it in the browser
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.
  • Include the LESS.js file
  • Include the styles.less file
  • View it in the browser
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.
  • Include the LESS.js file
  • Include the styles.less file
  • View it in the browser
Using a Task Runner The aim of this video is to show the viewer how to set up a task runner such as Grunt to automate her processing.
  • Install the LESS Grunt or Gulp plugin
  • Set up the plugin
  • Run the plugin
Using a Task Runner The aim of this video is to show the viewer how to set up a task runner such as Grunt to automate her processing.
  • Install the LESS Grunt or Gulp plugin
  • Set up the plugin
  • Run the plugin
Using a Task Runner The aim of this video is to show the viewer how to set up a task runner such as Grunt to automate her processing.
  • Install the LESS Grunt or Gulp plugin
  • Set up the plugin
  • Run the plugin
Using a Task Runner The aim of this video is to show the viewer how to set up a task runner such as Grunt to automate her processing.
  • Install the LESS Grunt or Gulp plugin
  • Set up the plugin
  • Run the plugin
The aim of this video is to show the viewer how to set up a task runner such as Grunt to automate her processing.
  • Install the LESS Grunt or Gulp plugin
  • Set up the plugin
  • Run the plugin
The aim of this video is to show the viewer how to set up a task runner such as Grunt to automate her processing.
  • Install the LESS Grunt or Gulp plugin
  • Set up the plugin
  • Run the plugin
Using Third-party Software The aim of this video is to show the viewer how to use third-party software to process LESS files.
  • Download and install the third-party software
  • Set up the software
  • Run the software
Using Third-party Software The aim of this video is to show the viewer how to use third-party software to process LESS files.
  • Download and install the third-party software
  • Set up the software
  • Run the software
Using Third-party Software The aim of this video is to show the viewer how to use third-party software to process LESS files.
  • Download and install the third-party software
  • Set up the software
  • Run the software
Using Third-party Software The aim of this video is to show the viewer how to use third-party software to process LESS files.
  • Download and install the third-party software
  • Set up the software
  • Run the software
The aim of this video is to show the viewer how to use third-party software to process LESS files.
  • Download and install the third-party software
  • Set up the software
  • Run the software
The aim of this video is to show the viewer how to use third-party software to process LESS files.
  • Download and install the third-party software
  • Set up the software
  • Run the software
Using Our Code Editor We'll take a look at using your code editor to convert LESS on the fly.
  • Open your code editor
  • Locate and install the plugin
  • Run the plugin
Using Our Code Editor We'll take a look at using your code editor to convert LESS on the fly.
  • Open your code editor
  • Locate and install the plugin
  • Run the plugin
Using Our Code Editor We'll take a look at using your code editor to convert LESS on the fly.
  • Open your code editor
  • Locate and install the plugin
  • Run the plugin
Using Our Code Editor We'll take a look at using your code editor to convert LESS on the fly.
  • Open your code editor
  • Locate and install the plugin
  • Run the plugin
We'll take a look at using your code editor to convert LESS on the fly.
  • Open your code editor
  • Locate and install the plugin
  • Run the plugin
We'll take a look at using your code editor to convert LESS on the fly.
  • Open your code editor
  • Locate and install the plugin
  • Run the plugin
Variables Can Make Our Lives Easier 4 lectures 14:09 What Is a Variable and How Does It Work? We will explain what variables are and how they work.
  • Identify a value that can be replaced with a variable
  • Write the variable
  • Explain what variables are and how they work
Advanced Variable Usage In this, we will take LESS variables beyond basic usage.
  • Set up some variables
  • Pull these variables into class names
  • Write the classes
Basics: Nesting 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.
  • Find some code and nest them
  • View the nested code
Advanced: Nesting This video will show you how to keep our code organized and in order.
  • Identify some pseudo elements
  • Rewrite them using LESS Nesting and view the compiled CSS
Variables Can Make Our Lives Easier. 4 lectures 14:09 What Is a Variable and How Does It Work? We will explain what variables are and how they work new mixin or copy the code into our core LESS file,...

Additional information

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!

Learning LESS

£ 10 VAT inc.