Skip to content

Installation Guide: Microsoft Visual Studio Code (VS Code)

Welcome back to the blog! ๐Ÿ‘‹

I've talked with friends and coworkers a lot since my recent blog post; in these discussions, I realized a central element was the fact we were communicating. Be it body language, verbal, written, or other mediums of communication, all of those conversations enabled myself and those around me to exchange information and share knowledge. This led me to think about my desire to start a Python installation and series of articles to help one learn Python - in order for these to be successful, we need to be speaking the same language. The best place to start with that in a programming context is with the installation of your first IDE. Let's get started!

  1. What is an IDE?
  2. What is Visual Studio Code?
  3. Why Use VS Code?
  4. Windows Installation Instructions:
  5. Mac Installation Instructions:
  6. Process Complete
  7. Summary/Links
  8. Summary
  9. Links
  10. Conclusion

What is an IDE?

An IDE, or Integrated Development Environment, enables programmers to consolidate the different aspects of writing a computer program.
IDEs increase programmer productivity by combining common activities of writing software into a single application: editing source code, building executables, and debugging.

Codecademy

๐Ÿคจ What do each of these mean? I'm glad you asked!

  1. ๐Ÿ“ Editing Source Code. A major part of writing programming languages is the actual creation of the code. While we could use any text editor like NotePad or TextEdit to do this, IDEs offer multiple benefits and efficiency gains for this effort (autocomplete - the IDE can offer suggestions on what comes next; syntax highlighting - different words/keywords have different meanings in different languages, so it helps to color-code these appropriately based on the situation; multi-language support - IDEs often have extensions/functionalities to support multiple programming languages in one window, eliminating the need for an IDE for each different programming language)
  2. ๐Ÿ› ๏ธ Building executables. Programs are often written in high-level languages like Python or Java which can't be understood by the computer without a translation-layer first. IDEs handle this through a "build" process than translates the high-level language instructions into low-level instructions the computer can quickly understand and execute.
  3. ๐Ÿ•ต๏ธ Debugging. Rarely is the first version of a program written the final version either due to missing requirements, implementing improvements, creating a more robust program, or many other reasons. Therefore, debugging is a process that allows programmers to more easily troubleshoot their programs, identify the unexpected/unintended operation, and improve upon these for future executions.

What is Visual Studio Code?

Visual Studio Code (or often shorthand as VS Code) is a lightweight (my recent Windows installation was only 366 MB!) IDE offered by Microsoft. It is a ๐Ÿ†“ IDE supporting a plethora of extensions to enable multiple languages/use-cases and is a common tool used across academic, personal, and professional projects. In addition, it has a huge official and unofficial community that comes with resources, tips and tricks, help articles, and so much more!

Why Use VS Code?

VS Code offers a quality programming experience at no cost (other than the machine you're running it on), allowing those new and experienced to programming a quick and easy solution for their coding needs/wants.

Windows Installation Instructions:

We've discussed what VS Code is and why to use it; now let's get it installed on your machine!

  1. Launch web browser of your choice.
  2. Navigate to https://code.visualstudio.com/.
  3. Download the Windows User Installer.
  4. Launch the downloaded installer.
  5. ***All following steps are in the installation pop-up window.
  6. Toggle the radio button for "I accept the agreement", then click the "Next >" button
  7. Click the "Next >" button (customize the installation destination location if desired)
  8. Click the "Next >" button (customize the Start Menu folder if desired)
  9. On the next screen for Additional Tasks:
  10. a. Within the "Additional icons" section:
    • (if desired) Check the box for "Create a desktop icon"
  11. b. Within the "Other" section:
    • i. Check the box for 'Add "Open with Code" action to Windows Explorer file context menu
      ii. Check the box for 'Add "Open with Code" action to Windows Explorer directory context menu"
      iii. Check the box for "Register Code as an editor for supported file types"
      iv. Check the box for "Add to PATH (requires shell restart)"
  12. c. Click the "Next >" button
  13. Click the "Install" button
  14. After installation, click the "Finish" button

Mac Installation Instructions:

  1. Launch web browser of your choice.
  2. Navigate to https://code.visualstudio.com/.
  3. Download the MacOS Universal Installer.
  4. Launch Finder and navigate to your Downloads folder.
  5. In your downloads, double click the downloaded 'VSCode-darwin-universal.zip' file to unzip the contents.
  6. Drag the "Visual Studio Code" application file into the left-pane and drop it in your "Applications" to complete installation.

Process Complete

Congratulations! You've now installed your first IDE. There are a vast amount of articles out there on Medium, YouTube, LinkedIn, and other sources to continue with additional configurations and customizations. I would encourage you to check these out and experiment.

Summary

An IDE (Integrated Development Environment) is a powerful tool for those new or experienced to programming. It offers a lot of features speeding up quality development efforts. Microsoft offers a free IDE named VS Code (Visual Studio Code) that I provide step-by-step instructions to assist in installation of this software.

  • Recent Blog Post: If you missed it, my last post was in the "Personal Progress Update" series giving you the inside scoop on my latest personal, professional, and academic goals!
  • Codecademy IDE Definition: I really felt their definition said it best in a succinct manner, so I borrowed it! I still encourage you to go check out their article, too!
  • Microsoft VS Code Homepage: From here, you can quickly download VS Code, navigate to recent releases, or see what's new in their latest patches!

Conclusion

As I was driving into work this morning and before publishing this post, I realized it would be helpful to have an image/video-based tutorial of the above. Between these, preparing my own installation guides is the least LOE while I figure out video editing (to ensure it's a good experience for all of you!). Therefore, I'll edit this post later to add a Google Doc link showing how to perform the above steps!

If you're wondering why I don't just build that into the post directly, there's a limit to the amount of storage I have through WordPress on their free plan; therefore, I'm approaching their storage cautiously until I have defined reasons to start using it!

This was a fun and quick write; it all started after helping a friend install VS Code & I realized I could see myself giving the same explanation over and over. Considering that, why not write it down? This way, the world can benefit from the same explanation and it will live on indefinitely!

Be on the lookout for additional posts coming soon starting the Python series (with an Installation Guide, of course!); as always, thank you for taking the time to read this post! Until the next time we learn (or discuss) something together, have a wonderful Monday!