Extensions - Falicer/Project_Tech_2021 GitHub Wiki

In my VSCode editor I use the following extensions

Beautify

Build Status Build status Licence VS Code Marketplace Rating Downloads Installs Donate

Beautify javascript, JSON, CSS, Sass, and HTML in Visual Studio Code.

VS Code uses js-beautify internally, but it lacks the ability to modify the style you wish to use. This extension enables running js-beautify in VS Code, AND honouring any .jsbeautifyrc file in the open file's path tree to load your code styling. Run with F1 Beautify (to beautify a selection) or F1 Beautify file.

Reason why

Beautify is a almost a standard extension for every developer/programmer, it keeps your code clean and nice looking with just a shortcut and it saves you a lot of time doing so yourself. Using this extension makes your code easily editable in a work environment where multiple people can work on multiple pieces of code.

Source

Beautify Github

Color Picker

VS Marketplace installs GitHub issues David license

Helper with GUI to generate color codes such as CSS color notations.
And, a command Convert Color to change the color notation.

A dialog box is shown by pressing Alt + C P keys or command Pick Color. If a cursor is positioned on a string that is color notation at that time, that string is selected as target for editing. Color picker gif

Reason why

This is mostly for convenience, instead of going to a site with a color picker you got one right there in your editor. Saves time, takes less work. Do you need to know more?

Source

Color Picker extension VSCode

Colorize

codebeat badge Build Status Build status Licence Version License Installs Ratings

Instantly visualize css colors in your css/sass/less/postcss/stylus/XML... files.

This extension your styles files looking for colors and generate a colored background (using the color) for each of them.

Reason why

Colorize is a nice extension combined with Color Picker, after choosing the color you can always see what the color looks like in the code.

Sources & Recommendations

Colorize extension github Recommended by: Victor Boucher

ESLint

Build Status

Integrates ESLint into VS Code. If you are new to ESLint check the documentation.

Reason why

ESLint is always usefull to have, it checks your code for errors and gives suggestions how to fix it. It's used by beginner and veteran coders, so why wouldn't you use it?

Sources

ESLint github

VSIcons

Version Installs Ratings

Build Status Build Status

Dependencies Status DevDependencies Status Greenkeeper badge

Maintainability Test Coverage Known Vulnerabilities

Average time to resolve an issue Percentage of issues still open

Wallaby.js


Bring icons to your Visual Studio Code (minimum supported version: 1.31.1)

demo

Reason why

It's mostly just for the aesthetics, if you like nice colorful icons that also kinda indicates the file property, then VSIcons is an extension you don't wanna miss.

Sources

VSIcons github Recommended by: Friends and Teachers.