From the course: Emmet: Fast and Efficient Web Coding

Overview of how Emmet works

From the course: Emmet: Fast and Efficient Web Coding

Start my 1-month free trial

Overview of how Emmet works

“

- So what is Emmet exactly? Well, it is well stated on their website, which says that Emmet is a plugin for many popular text editors which greatly improves HTML and CSS workflow. You can think of Emmet as a productivity tool which simply is a plug-in for many popular text editors and will greatly improve the speed with which you write HTML by allowing you to transform CSS-like selectors into full-blown HTML super-fast. Additionally, it will also allow you to do the same sort of speedy coding with CSS. Once you understand how Emmett works, you'll be able to harness the power of this little gem and improve the writing of your HTML and CSS. You will see a marked improvement in development time and the amount of keystrokes by providing shortcut syntax for creating markups and CSS rules. Some features of Emmet include HTML from CSS. You already know how to use Emmett abbreviations. Its syntax is inspired by CSS selectors. Emmett uses single abbreviations to produce code for many popular syntaxes and programming languages like HAML, Pug, JSX, Sass, and more. Every abbreviation is transformed in runtime. Just slightly change the name and you'll get different results. This ensures that you're taking advantage of dynamic snippets. You'll be ultra fast at coding. With Emmet, you can quickly write a bunch of code, wrap code with new tags, quickly traverse and select important code portions, and more. Emmet is highly customizable. Users can easily add new snippets and fine-tune the Emmett experience by modifying the JSON file. It's also highly portable. Emmet is written in pure JavaScript and works across different platforms, web browsers, it works with node.js, Microsoft WSH, and Mozilla Rhino. Now that you have an overview of what Emmett is capable of, let's dive into our code editor and see how we can begin to speed things up.

Contents