Coding doesn't have to take a long time.

In this class, we'll help you shave hours off each project you create by using Emmet, Sass, and Sublime Text.

Emmet is a plugin that works with a variety of text editors.  It speeds up your workflow by allowing you to use shortcuts to produce large amounts of code.  Sass, a CSS preprocessor, saves you time by allowing you to make global changes to your stylesheets with a single line of code.  We'll also take you through Sublime Text, a popular text editor with features designed to take the monotony out of coding from scratch.

Here’s an overview of what you’ll learn:

  • What is Emmet?  How does it work? 
  • What are Sass variables?  How can we make changes across an entire stylesheet without scrolling and changing each parameter manually?
  • How can we use Sublime Text to speed up our workflow?

You'll learn tips and tricks like these:

  • Type a keystroke and 6 characters to turn a plain list like this:
    Chocolate
    Fruits
    Candy
    
    into this:
    <ul>
      <li>Chocolate</li>
      <li>Fruits</li>
      <li>Candy</li>
    </ul>
    
  • Make the following 290 characters by only typing 24 characters!
    <ul>
      <li class="item1"><a href=""></a></li>
      <li class="item2"><a href=""></a></li>
      <li class="item3"><a href=""></a></li>
      <li class="item4"><a href=""></a></li>
      <li class="item5"><a href=""></a></li>
      <li class="item6"><a href=""></a></li>
      <li class="item7"><a href=""></a></li>
    </ul>
    
  • Quickly change a tag by editing start and end tags simultaneously.
  • Place multiple cursors to edit multiple lines or attributes at the same time. 
  • Paste new code into an existing project without worrying about indentation.

This class focuses on coding efficiency.  While we will teach the SCSS syntax required for Sass, a solid grasp of HTML and CSS are prerequisites for this course.

This Coding Tips and Tricks workshop is held at our coding school, Noble Desktop, in Midtown.

What You'll Learn

  • How to use Emmet, Sass (SCSS), and Sublime Text to code faster
  • How to use Sass variables to re-use CSS and speed up the creation of large stylesheets
  • Navigate files faster using Sublime Text and Emmet
  • Create lists quickly using a keystroke and 6 characters
  • Quickly change a tag by editing start and end tags simultaneously
  • Place multiple cursors to edit multiple lines or attributes at the same time
  • Wrap tags efficiently and beautifully, with perfect indentation