Text Editor & Extensions for Web Development.

visual studio code

Visual Studio Code

In writing codes, one of the most important tools, you need is a text editor. Some people may go in for an IDE but in order to keep it simple I’d recommend a text editor. Almost all the time, I get questions from people like what’s the best text editor to use for web development. My answer to that question has always been simple. Every text editor gets the job done but others have features which may be liked or disliked depending on the user preference. But if you ask me which editor I like?, I’d tell you straight that it is Visual Studio Code, vscode for short. Let’s get straight into installing vscode.
We will have a look at two ways of getting visual studio code

• using the graphical user interface
• using the command line interface

Installing with the Graphical User Interface

To install vscode using the graphical user interface, you have to first visit the visual studio code website by following the link below

Download Visual Studio Code — Mac, Linux, Windows

visual studio code download site

Now download the appropriate version of visual studio base on the operating system you are using.

After downloading the vscode setup, run the setup and launch vscode

visual studio code

Installing with the Command-Line Interface

Since we have already installed a terminal and a package manager it’ll be very easy to install visual studio text editor (vscode).

1. Open your terminal (cmder, I’d prefer) as an Administrator.
2. Type into it choco install vscode and press enter
3. Enter yes or y to any question that’s being asked
4. Wait until the installation is done and type code -v and press enter to test your installation. If successfully installed, a string (series) of numbers or version of vscode will appear. Like the one below

chocolatey version

after a successful installation, type code in your terminal and press enter to launch vscode.

Extension for web development

Sometimes when coding, things can really get tough. Your code might get dirty, you might forget a function name, a tag or something. This is where editor extensions come in. In this tutorial, we’re going to be installing two extensions in our editor. Don’t worry if you don’t have enough data, these extensions are a few kilobytes. Follow the instructions to install the extension in vscode editor

1. Press Ctrl + B to view the side bar if it’s not in view
2. Click on the extension’s icon which is the fifth icon on the left side.You can alternatively press Ctrl + Shift + X to select
3. Type the name of the extension you want to install, in this case it’s going to be prettier (An extension for refactoring code and making it look organized as the name suggests)
4. Select the first option and click on install
5. After prettier is installed, repeat the the same process to install for Lorem (An extension for giving content)
6. Voila!!! We are done

Installing the extensions

© 2021 Marathintech inc
Codetopia Community