You are here

Coding Tips & Tricks: Emmet, Sass, & Code Editors

Coding Tips & Tricks: Emmet, Sass, & Code Editors


Noble Desktop
594 Broadway
Ste 1202
New York, NY 10012
Register for Course
Thursday, July 18, 2019 - 10:00am


Did you know there are faster and easier ways to code? If youre not using Emmet (coding shortcuts), Sass (a CSS preprocessor), or Sublime Text (a code editor), you should be! These tools can greatly speed up your coding with less typing. Every web developer needs to know these. Let us show you how to dramatically speed up your development. Here's a sampling of What youll learn: What are Emmet, Sass, and Sublime Text? How do they work? Why should I use them? (It will become very obvious.) Sass variables let you re-use CSS. Example: After using a color throughout your CSS, you only need to update one place to change the color throughout your CSS! Sass mixins let you re-use blocks of code. Example: Instead of typing all the -webkit, -moz, -ms prefixed properties for new CSS3 features, you can let the mixin write them all for you! With Sublime Text and Emmet you can navigate files faster. From finding a specific CSS rule amoung dozens, to moving the cursor to the right place in your code, keystrokes let you navigate quicker! 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> 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. This is phenomenal! Wrap tags efficiently and beautifully (nicely indented). Paste new code perfectly indented. Even more awesomeness! This seminar will focus on coding efficiency, assuming you understand HTML/CSS code. NOTE: Well teach the SCSS syntax of Sass. Please Note: Attendees will receive reference material containing notes, examples, keystrokes, website links, etc. so you can remember what you learned in the seminar.

Register for Course