Emmet is a set of keyboard abbreviations that will automatically convert to the language you're using them with. Although that may sound confusing, it's a lot simpler than it sounds. Emmet allows you to type less and create code more quickly. It is simply a list of shorthand keystrokes that will fill out as HTML, CSS, and other languages. Checkout the Emmet Cheat Sheet here to see all of the available languages and to get started. Let's dive right in to see Emmet in action.
To put it simply, Prettier is a code formatter. The reason we format code is to make it readable, not only for others, but for yourself as well. Readable code is workable code and you can make your code easy to work with if you format it appropriately. The problem with formatting your code manually is that not only is it error prone, but it's tedious and time consuming. Using a tool like Prettier can save you time, and prevent errors in your formatting. Your code will be more legible and you'll have an easier time navigating your code if you haven't looked at it in a while. You can even set up Prettier in VSCode to format your code whenever you save it. Configuring Prettier is not always a straight forward process. In this article I'm going to show you how to set Prettier up in VSCode to make your coding life easier.