You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: hub/apps/get-started/start-here.md
+18-16Lines changed: 18 additions & 16 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -16,21 +16,36 @@ Welcome to Windows app development. This guide will take you through the steps n
16
16
> [Microsoft Copilot](https://copilot.microsoft.com) is a great resource if you have questions about getting started writing Windows apps.
17
17
18
18
19
-
## 1. Install Visual Studio
19
+
## 1. Enable Developer Mode
20
+
21
+
Windows has a special mode for developers that adjusts security settings in order to let you run the apps you're working on. You'll need to enable Developer Mode before you can build, deploy, and test your app using Visual Studio.
22
+
23
+
> [!TIP]
24
+
> If you don't enable it now, you'll be prompted to enable it when you try to build your app in Visual Studio.
25
+
26
+
To enable Developer Mode:
27
+
28
+
* Open Windows Settings and navigate to the **[System > For developers](ms-settings:developers)** page.
29
+
* Toggle the Developer Mode switch to **On** and confirm your choice in the confirmation dialog.
30
+
31
+
For more information about Developer Mode, see [Enable your device for development](/windows/apps/get-started/enable-your-device-for-development).
32
+
33
+
34
+
## 2. Install Visual Studio
20
35
21
36
You'll use [Visual Studio](/visualstudio/ide/), Microsoft's comprehensive integrated development environment (IDE), to create your WinUI app. It's the preferred development tool of many Windows developers and it will help you write, debug, and deploy your apps. The project templates in Visual Studio will quickly get you started with projects for Windows and many other platforms.
22
37
23
38
> [!TIP]
24
39
> Before installing these tools, make sure your development computer meets the [system requirements for Windows app development](../windows-app-sdk/system-requirements.md).
25
40
26
-
Use this link to download and install the latest Visual Studio. The installer will walk you through the steps, but if you find you need detailed instructions, see [Install Visual Studio](/visualstudio/install/install-visual-studio).
41
+
Use the link below to download and install the latest Visual Studio. The installer will walk you through the steps, but if you find you need detailed instructions, see [Install Visual Studio](/visualstudio/install/install-visual-studio).
The free Visual Studio Community Edition includes everything you need to create your apps. If you're working with a development team or enterprise, you might need Visual Studio Professional or Visual Studio Enterprise. See [What is Visual Studio?](/visualstudio/get-started/visual-studio-ide) for more info.
32
47
33
-
### Required workloads and components
48
+
### 2.2 Required workloads and components
34
49
35
50
While installing Visual Studio, you need to install the workloads and components required for developing with WinUI and the Windows App SDK. After installation, you can open the Visual Studio Installer app and select **Modify** to add workloads and components.
36
51
@@ -57,19 +72,6 @@ On the **Workloads** tab of the Visual Studio Installer app, select the followin
57
72
58
73
---
59
74
60
-
## 2. Enable Developer Mode
61
-
62
-
Windows has a special mode for developers that adjusts security settings in order to let you run the apps you're working on. You'll need to enable Developer Mode before you can build, deploy, and test your app using Visual Studio.
63
-
64
-
> [!TIP]
65
-
> If you don't enable it now, you'll be prompted to enable it when you try to build your app in Visual Studio.
66
-
67
-
To enable Developer Mode:
68
-
69
-
* Open Windows Settings and navigate to the **[System > For developers](ms-settings:developers)** page.
70
-
* Toggle the Developer Mode switch to **On** and confirm your choice in the confirmation dialog.
71
-
72
-
For more information about Developer Mode, see [Enable your device for development](/windows/apps/get-started/enable-your-device-for-development).
Copy file name to clipboardExpand all lines: hub/apps/how-tos/hello-world-winui3.md
+21-16Lines changed: 21 additions & 16 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -47,29 +47,32 @@ This separation of **business logic** and **presentation** concerns lets you bin
47
47
48
48
### The project's file structure
49
49
50
-
Let's review the project's file structure before making code changes.
50
+
Let's review the project's file structure before making code changes. This is located in the [Solution Explorer](/visualstudio/ide/use-solution-explorer).
51
+
52
+
> [!TIP]
53
+
> To locate features like the Solution Explorer, click on Search on navigation bar and use the Feature Search option. :::image type="content" source="images/hello-world/feature-search.png" alt-text="Feature Search":::
51
54
52
55
The project's file structure currently looks like this:
This table describes the files, starting from the top and working down:
57
60
58
-
|Item| Description |
61
+
|File Name and <br> Image Reference Number| Description |
59
62
|--|--|
60
-
|`Solution 'Hello World'`| This is a **solution file**, a logical container for your **projects**. Projects are often apps, but they can also be supporting class libraries. |
61
-
|`Hello World`| This is a **project file**, a logical container for your app's files. |
62
-
|`Dependencies`| Your app depends on **frameworks** (like [.NET](/dotnet/fundamentals/) and the [Windows SDK](https://developer.microsoft.com/windows/downloads/windows-sdk/)) and **packages** (like [Windows App SDK](https://www.nuget.org/packages/Microsoft.WindowsAppSDK/#versions-body-tab)). As you introduce more sophisticated functionality and third-party libraries into your app, additional dependencies will appear here. |
63
-
|`Properties`| By convention, WinUI 3 projects place publish profiles and launch configuration files in this folder. |
64
-
|`PublishProfiles`| Your **publish profiles** specify your app's publishing configuration across a variety of platforms. |
65
-
|`launchSettings.json`| This file lets you configure **launch profiles** that can be used when running your app via `dotnet run`. |
66
-
|`Assets`| This folder contains your app's logo, images, and other media assets. |
67
-
|`app.manifest`| This app manifest file contains configuration related to the way that Windows displays your app when installed on user devices. |
68
-
|`App.xaml`| This markup file specifies the shared, globally accessible resources that your app depends on. |
69
-
|`App.xaml.cs`| This code-behind file represents the entry point to your app's business logic. It's responsible for creating and activating an instance of your `MainWindow`. |
70
-
|`MainWindow.xaml`| This markup file contains the presentation concerns for your app's main window. |
71
-
|`MainWindow.xaml.cs`| This code-behind file contains the business logic concerns associated with your app's main window. |
72
-
|`Package.appxmanifest`| This [package manifest file](/uwp/schemas/appxpackage/uapmanifestschema/generate-package-manifest) lets you configure publisher information, logos, processor architectures, and other details that determine how your app appears in the Windows Store. |
63
+
|`Solution 'Hello World'`<br> 1.| This is a **solution file**, a logical container for your **projects**. Projects are often apps, but they can also be supporting class libraries. |
64
+
|`Hello World`<br> 2. | This is a **project file**, a logical container for your app's files. |
65
+
|`Dependencies`<br> 3. | Your app depends on **frameworks** (like [.NET](/dotnet/fundamentals/) and the [Windows SDK](https://developer.microsoft.com/windows/downloads/windows-sdk/)) and **packages** (like [Windows App SDK](https://www.nuget.org/packages/Microsoft.WindowsAppSDK/#versions-body-tab)). As you introduce more sophisticated functionality and third-party libraries into your app, additional dependencies will appear here. |
66
+
|`Properties`<br> 4. | By convention, WinUI 3 projects place publish profiles and launch configuration files in this folder. |
67
+
|`PublishProfiles`<br> 5. | Your **publish profiles** specify your app's publishing configuration across a variety of platforms. |
68
+
|`launchSettings.json`<br> 6. | This file lets you configure **launch profiles** that can be used when running your app via `dotnet run`. |
69
+
|`Assets`<br> 7. | This folder contains your app's logo, images, and other media assets. |
70
+
|`app.manifest`<br> 8. | This app manifest file contains configuration related to the way that Windows displays your app when installed on user devices. |
71
+
|`App.xaml`<br> 9. | This markup file specifies the shared, globally accessible resources that your app depends on. |
72
+
|`App.xaml.cs`<br> 10. | This code-behind file represents the entry point to your app's business logic. It's responsible for creating and activating an instance of your `MainWindow`. |
73
+
|`MainWindow.xaml`<br> 11. | This markup file contains the presentation concerns for your app's main window. |
74
+
|`MainWindow.xaml.cs`<br> 12. | This code-behind file contains the business logic concerns associated with your app's main window. |
75
+
|`Package.appxmanifest`<br> 13. | This [package manifest file](/uwp/schemas/appxpackage/uapmanifestschema/generate-package-manifest) lets you configure publisher information, logos, processor architectures, and other details that determine how your app appears in the Windows Store. |
73
76
74
77
## Display "Hello world!"
75
78
@@ -112,7 +115,9 @@ public sealed partial class MainWindow : Window
112
115
}
113
116
```
114
117
115
-
If you restart your app, you should see a red `Hello world!`:
118
+
Reset your app by selecting Build > Rebuild Solution from the menu or pressing Ctrl + Shift + B. Then Start your app again by clicking the "Start" button in the Visual Studio toolbar or by pressing F5.
119
+
120
+
The app will update and you should see a red `Hello world!`:
116
121
117
122
:::image type="content" source="images/hello-world/red-hello.png" alt-text="A red 'Hello world!'":::
0 commit comments