Visual Studio is an Integrated Development Environment (IDE) used to develop apps for Windows, the web, and other platforms. It consists of a source code editor, designer, compiler, and debugger.
There are three editions of Visual Studio 2022: the Community, Professional, and Enterprise editions. Visual Studio Community is free and it's the edition used throughout this module.
The images used in this module might look different if you're using the Professional or Enterprise editions.
Download and install Visual Studio. Check out the Introduction to Windows 10 module for more detailed instructions and some automated scripts.
Don't confuse Visual Studio — a comprehensive IDE for .NET and C# development — with Visual Studio Code.
Visual Studio Code is a standalone lightweight code editor with a plug-in ecosystem that's ideal for web development.
Visual Studio is also available for Mac. This module doesn't cover development with Mac. You might want to visit Visual Studio for Mac.
Before starting, you need to install Visual Studio. Check that you're using the latest version by running the Visual Studio Installer:
Projects include source code, like C# and XAML files. Projects also include resources, such as images, sounds, and other Visual Studio information.
A Solution can encompass more than one project. Your app might use another project for some key functionality or might run on different types of devices and need to be built in different ways. Solutions bring all of your projects together in one place.
IntelliSense displays information about your code directly within the editor. It essentially provides inline documentation, which removes the need to look up reference information elsewhere. In some cases, it might even write small bits of code for you.
The following image is an example of the Visual Studio UI with a Solution open.
The Solution Explorer helps you view, navigate, and manage files. Organize your code by grouping files into solutions and projects.
The Editor Window is where you edit code and design user interfaces (for example, a window with buttons and text boxes). It can also be used to display the contents of files.
The Output Window displays notifications from different message sources in separate tabs (including debugging and error messages, compiler warnings, publishing and status messages, and other notifications).
The Team Explorer allows you to track work items and share code with others using version control technologies such as Git.
The previous image shows an example with C# code. You can also use the Editor Window to design the appearance of your app. If you select a XAML file, for example MainPage.xaml, you see:
Preview your UI in the upper window along with the XAML code used to define it. You can switch between views using the arrow button. The arrow button is the border between the Design and Code views near the words Design and XAML. The preview changes whenever you change the XAML file and vice versa.
If you make changes to the XAML code that violate the formatting rules — like misspelling the name of a control or leaving out a closing (>) tag — the design view displays and Invalid Markup message. You won't be able to display a preview.
If you don't know how to fix your mistake, you can step back by selecting Edit → Undo until the preview works again.
Now that Visual Studio is up and running and you're familiar with the environment, let's create a project to test that everything works.
Your project is created. Your project isn't empty — some files and settings are automatically generated for you.
The blue rectangle toward the top of your app window is a Visual Studio tool that helps with debugging. It won't appear in your final app.