An overview of Visual Studio features
Welcome to Visual Studio
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 may look different if you're using the Professional or Enterprise edition.
Don't confuse Visual Studio (a comprehensive IDE for .NET and C# development) with Visual Studio Code (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 may want to visit Visual Studio for Mac.
Install or update Visual Studio
Before starting, you'll need to install Visual Studio. Check that you're using the latest version by running the Visual Studio Installer:
- Open the Start menu and select Visual Studio Installer.
- Click the Update button (if it appears). Visual Studio will download and install the most recent version.
Projects include source code (C# and XAML files), resources (images and sound), and other Visual Studio information.
A Solution can encompass more than one project. Your app could 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 (removing the need to look up reference information elsewhere). In some cases, it may even write small bits of code for you.
A quick tour of Visual Studio
The Visual Studio UI with a Solution open:
The Solution Explorer (top-right) helps you view, navigate, and manage files. Organize your code by grouping files into solutions and projects.
The Editor Window (center) 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 (bottom-center) 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 (bottom-right) 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. Selecting a XAML file (for example, MainPage.xaml) displays:
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 (in the border, between the Design and Code views, near the words Design and XAML). The preview will change whenever you change the XAML file and vice versa.
In this view, open the Toolbox (far left), select your desired controls, and drag them into your app window.
If you make changes to the XAML code that violate formatting rules (for example: misspelling the name of a control or leaving out a closing (
>) tag), design view displays an 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 (Click Edit and select Undo) until the preview works again.
Creating a project with Visual Studio
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.
Open Visual Studio. A Visual Studio 2022 window appears. Click Create a New Project.
Type Windows Universal in the search box, select Blank App (Universal Windows), and click Next.
In the Configure your new project screen; name your app Hello World, leave Location and Solution name set to their default values, and click Create.
Set the Minimum Version to Windows 10, version 1809 or later. Click OK.
Your project has been created. Your project isn't empty – some files and settings are automatically generated for you.
Check your debug settings on the menu bar. They should be set to Debug and x86.
Click the Run (green triangle) button to build and run your app (or press the F5 key).
A large, blank window displays with the text Hello World. This screen is a preview of your app when it's running.
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.
Close out of your app or click the Stop (red square) button on the menu bar to stop running it.