Getting Started with Your First Windows IoT App

Welcome to the exciting world of Windows IoT! This guide will walk you through the essential steps to create and deploy your very first application on a Windows IoT device.

Step 1: Prerequisites and Setup

Before you begin, ensure you have the following:

For detailed setup instructions, refer to the official Windows IoT documentation.

Step 2: Creating Your First Project in Visual Studio

Let's create a simple "Hello, World!" Universal Windows Platform (UWP) app.

  1. Open Visual Studio 2022.
  2. Click "Create a new project".
  3. Search for "Blank App, UWP (C++/WinRT)" or "Blank App, UWP (C#)". We'll use C# for this example.
  4. Select the template and click "Next".
  5. Name your project "MyFirstIoTApp" and choose a location.
  6. Click "Create".

Visual Studio will generate a basic UWP project structure.

Step 3: Writing Your Code

We'll modify the main page to display a message.

Open MainPage.xaml and replace its content with the following:

C# 
<?xml version="1.0" encoding="utf-8"?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="MyFirstIoTApp.MainPage"
             BackgroundColor="{DynamicResource PageBackgroundColor}">

    <ScrollView>
        <VerticalStackLayout
            Spacing="25"
            Padding="30,0"
            VerticalOptions="Center">

            <Image
                Source="dotnet_bot.png"
                SemanticProperties.Description="Cute dot net bot waving"
                HeightRequest="200"
                HorizontalOptions="Center" />

            <Label
                Text="Hello, Windows IoT!"
                SemanticProperties.HeadingLevel="Level1"
                FontSize="32"
                HorizontalOptions="Center" />

            <Label
                Text="Your first app is running!"
                SemanticProperties.HeadingLevel="Level1"
                FontSize="18"
                HorizontalOptions="Center" />

            <Button
                x:Name="CounterBtn"
                Text="Click me"
                SemanticProperties.Hint="Counts the number of times you click"
                Clicked="OnCounterClicked"
                HorizontalOptions="Center" />

        </VerticalStackLayout>
    </ScrollView>

</ContentPage>

Now, open MainPage.xaml.cs and replace its content with the following:

C# 
using Microsoft.Maui.Controls;
using System;

namespace MyFirstIoTApp
{
    public partial class MainPage : ContentPage
    {
        int count = 0;

        public MainPage()
        {
            InitializeComponent();
        }

        private void OnCounterClicked(object sender, EventArgs e)
        {
            count++;
            CounterBtn.Text = $"Clicked {count} times";
            SemanticScreenReader.Announce(CounterBtn.Text);
        }
    }
}

Step 4: Deploying to Your IoT Device

This is where you connect your development PC to your IoT device.

  1. Ensure your IoT device is powered on and connected to the same network as your development PC.
  2. In Visual Studio, set the deployment target. From the dropdown menu next to the "Start" button, select "Remote Machine".
  3. Click "Remote Machine...".
  4. Enter the IP address of your IoT device (you can find this in the IoT Device Portal).
  5. Choose "WS-Http" as the authentication mode (or adjust based on your Device Portal configuration).
  6. Click "Select".
  7. Now, click the "Start" button (or press F5) to build and deploy your application to the remote device.

If the deployment is successful, your "Hello, Windows IoT!" app should launch on your IoT device!

Step 5: Exploring Further

Congratulations! You've built and deployed your first Windows IoT app. From here, you can: