Hey Everyone! This is my first blog post as a dev! The main reason is to help those who are having difficulties learning front-end technologies. Visual Studio Code aka vscode is so great that it will make your life easier and sometimes by installing extensions.

List of Extensions: 

  1. Live Server: Live server opens your project on localhost and it will help you switch between pages because we add cdn's which will make it slow when reloading the webpage + { you don't need to reload the page, it will automatically show the changes that you have made } );
  1. Live Sass Compiler: Live Sass Compiler is a handy tool which made my project so easy that I just made one index.scss file and did all CSS + SASS on it for 7 to 8 webpages. { Reason for using LSC is the functionalities that SASS have for ex: Nesting, Storing CSS properties in variables as we do in JS, and much more.

  2. Better Comments ( The Better Comments extension will help you create more human-friendly comments in your code. With this extension, you will be able to categorize your annotations into Alerts, Queries, TODOs, Highlights, and other comment styles to make your comment look good!!

  3. Auto Rename Tag: Auto Rename Tag is a lifesaver when you change the first tag and it will change the second tag automatically. 

  4. Highlight Matching Tag: This extension helps you when you in-built tag highlighter is not working!!

  5. Gatito Theme: I'm using this theme for quite a while and it doesn't annoy me when I'm staring at the screen for hours.

  6. Best Settings: AutoSave = ON, Wordwrap = ON + ( Alt + Ctrl ) + Live Server + Live Sass Compiler. You can turn autosave and word wrap on and you'll see the changes + Alt and ctrl will help you switch between pages + live server will help you reload the page automatically and live sass compiler will save the changes with a blink of an eye!!

You can follow me on @tahaadotdev at Instagram, twitter!! Happy Coding!!

This post is also available on DEV.