".NET 9를 사용하여 'Hello, World!' UWP 앱(XAML)을 만들기"

2025-05-06

이 자습서에서는 네이티브 AOT (Ahead-of-Time)와 함께 XAML, C# 및 .NET 9를 사용하여 Windows에서 UWP(유니버설 Windows 플랫폼)용 간단한 "Hello, World!" 앱을 만드는 방법을 설명합니다. Microsoft Visual Studio에서 단일 프로젝트를 사용하면 지원되는 모든 버전의 Windows 10 및 Windows 11에서 실행되는 앱을 빌드할 수 있습니다.

여기서 다음과 같은 내용을 배우게 됩니다.

Visual Studio에서 .NET 9를 대상으로 하는 새 UWP 프로젝트를 만듭니다.
XAML을 작성하여 시작 페이지에서 UI를 변경합니다.
Visual Studio의 로컬 데스크톱에서 프로젝트를 실행합니다.
SpeechSynthesizer를 사용하여 단추를 누를 때 앱이 대화되도록 합니다.

필수 조건

유니버설 Windows 앱이란?
"Visual Studio" 및 "Windows"을 다운로드합니다. 도움이 필요한 경우 설정하는 방법을 알아봅니다.
또한 Visual Studio에서 기본 창 레이아웃을 사용하고 있다고 가정합니다. 기본 레이아웃을 변경하는 경우 창 레이아웃 다시 설정 명령을 사용하여 창 메뉴에서 다시 설정할 수 있습니다.

비고

이 자습서에서는 Visual Studio 2022를 사용합니다. 다른 버전의 Visual Studio를 사용하는 경우 약간 다르게 보일 수 있습니다.

1단계: Visual Studio에서 새 프로젝트 만들기

Visual Studio를 시작합니다.
파일 메뉴에서 새 > 프로젝트 선택하여 새 프로젝트 대화 상자를 엽니다.
언어 드롭다운 목록에서 C#을 선택하고 프로젝트 형식 드롭다운 목록에서 UWP를 선택하여 사용 가능한 템플릿 목록을 필터링하여 C# 개발자를 위한 사용 가능한 UWP 프로젝트 템플릿 목록을 확인합니다.

(UWP 템플릿이 표시되지 않으면 UWP 앱을 만들기 위한 구성 요소가 누락되었을 수 있습니다. Windows 시작 메뉴에서 Visual Studio 설치 관리자 를 열어 설치 프로세스를 반복하고 UWP 지원을 추가할 수 있습니다. 자세한 내용은 UWP 개발을 위한 Visual Studio 설정을 참조하세요.)
UWP 빈 앱 템플릿을 선택합니다.

중요합니다

UWP 빈 앱 템플릿을 선택해야 합니다. UWP 빈 앱(.NET 네이티브) 템플릿을 선택하면 .NET 9가 아닌 .NET 네이티브 런타임을 대상으로 합니다. .NET 네이티브를 대상으로 하는 앱은 최신 .NET 및 C# 기능이나 보안 및 성능 향상에 액세스할 수 없습니다. 두 프로젝트 형식 간의 차이점에 대한 자세한 내용은 .NET 9 및 Native AOT에 대한 미리 보기 UWP 지원을 사용하여 UWP 앱 현대화를 참조하세요.
다음을 선택하고 프로젝트 이름으로 "HelloWorld"를 입력합니다. 선택하고생성합니다.

비고

Visual Studio를 처음 사용하는 경우 개발자 모드사용하도록 설정하라는 설정 대화 상자가 표시될 수 있습니다. 개발자 모드는 스토어가 아닌 곳에서 앱을 직접 실행할 수 있는 권한과 같은 여러 기능을 활성화하는 특별한 설정입니다. 자세한 내용은 기기를 개발용으로 설정하는 방법을 읽어보세요. 이 가이드를 계속하려면 개발자 모드선택하고 예클릭한 다음 대화 상자를 닫습니다.
대상 버전/최소 버전 대화 상자가 나타납니다. 이 자습서에서는 기본 설정이 적합하므로 확인 선택하여 프로젝트를 만듭니다.
새 프로젝트가 열리면 해당 파일이 오른쪽의 솔루션 탐색기 창에 표시됩니다. 파일을 보려면 속성 또는 GitHub Copilot 채팅 탭 대신 솔루션 탐색기 탭을 선택해야 할 수 있습니다.

UWP 빈 앱은 최소한의 템플릿이지만 여전히 많은 파일이 포함되어 있습니다. 이러한 파일은 C#을 사용하는 모든 UWP 앱에 필수적입니다. Visual Studio에서 만드는 모든 UWP 프로젝트에는 해당 프로젝트가 포함됩니다.

파일에 무엇이 있나요?

프로젝트에서 파일을 보고 편집하려면 솔루션 탐색기파일을 두 번 클릭합니다. 폴더와 마찬가지로 XAML 파일을 확장하여 연결된 코드 파일을 확인합니다. XAML 파일은 디자인 화면과 XAML 편집기를 모두 보여 주는 분할 보기에서 열립니다.

비고

XAML이란? XAML(Extensible Application Markup Language)은 앱의 사용자 인터페이스를 정의하는 데 사용되는 언어입니다. 수동으로 입력하거나 Visual Studio 디자인 도구를 사용하여 만들 수 있습니다. .xaml 파일에는 논리를 포함하는 .xaml.cs 코드 숨김 파일이 있습니다. XAML과 코드 비하인드는 함께 하나의 완전한 클래스를 만듭니다. 자세한 내용은 XAML 개요참조하세요.

App.xaml 및 App.xaml.cs

App.xaml은 앱 전체에서 사용되는 리소스를 선언하는 파일입니다.
App.xaml.cs 파일은 App.xaml의 코드 뒤편 파일입니다. 모든 코드 숨김 페이지와 마찬가지로 InitializeComponent 메서드를 호출하는 생성자가 포함되어 있습니다. InitializeComponent 메서드를 작성하지 않습니다. Visual Studio에서 생성되며, 주요 목적은 XAML 파일에 선언된 요소를 초기화하는 것입니다.
App.xaml.cs가 앱의 진입점입니다.
App.xaml.cs 앱의 활성화 및 일시 중단 처리하는 메서드도 포함되어 있습니다.

MainPage.xaml

MainPage.xaml은 앱의 UI를 정의하는 위치입니다. XAML 태그를 사용하여 요소를 직접 추가하거나 Visual Studio에서 제공하는 디자인 도구를 사용할 수 있습니다.
MainPage.xaml.cs 파일은 MainPage.xaml의 코드 숨김 페이지입니다. 여기서 앱 논리 및 이벤트 처리기를 추가합니다.
이 두 파일은 함께 MainPage 네임스페이스에 있는 Page로부터 상속받는 새 클래스 HelloWorld를 정의합니다.

package.appxmanifest

앱 이름, 설명, 타일, 시작 페이지 등을 설명하는 매니페스트 파일입니다.
앱에 포함된 종속성, 리소스 및 파일 목록을 포함합니다.

로고 이미지 집합

자산Square150x150Logo.scale-200.png 및 Wide310x150Logo.scale-200.png은 시작 메뉴에서 당신의 앱(중간 크기 또는 와이드 크기)을 나타냅니다.
자산/Square44x44Logo.png 시작 메뉴, 작업 표시줄 및 작업 관리자의 앱 목록에서 앱을 나타냅니다.
자산/StoreLogo.png Microsoft Store의 앱을 나타냅니다.
자산/SplashScreen.scale-200.png 앱이 시작될 때 표시되는 시작 화면입니다.
자산/LockScreenLogo.scale-200.png 사용하여 시스템이 잠겨 있는 경우 잠금 화면에서 앱을 나타낼 수 있습니다.

2단계: 단추 추가

디자이너 뷰 사용

페이지에 단추를 추가해 보겠습니다. 이 자습서에서는 이전에 나열된 몇 가지 파일인 App.xaml, MainPage.xaml 및 MainPage.xaml.cs 작업합니다.

MainPage.xaml을 두 번 클릭하여 XAML 편집기에서 엽니다.

비고

.NET 9를 사용하는 UWP 빈 앱 템플릿을 사용하는 경우 디자인 보기가 표시되지 않습니다. XAML 디자인 보기를 사용하여 UWP 프로젝트를 사용하려는 경우 UWP 빈 앱(.NET 네이티브) 템플릿을 대신 사용할 수 있습니다. 앞에서 설명한 것처럼 UWP 빈 앱(.NET 네이티브) 템플릿은 UWP 빈 앱 템플릿과 약간 다르지만 기본 구조는 동일합니다. 주요 차이점은 UWP 빈 앱(.NET 네이티브) 템플릿이 .NET 네이티브를 사용하여 앱을 컴파일한다는 것입니다. 새 .NET 9 템플릿 사용의 이점에 대한 자세한 내용은 .NET 9 및 Native AOT에 대한 미리 보기 UWP 지원을 사용하여 UWP 앱 현대화 를 참조하세요.
MainPage.xaml의 요소에 <Grid> 다음 XAML 코드를 추가합니다. 입력하거나 여기에서 복사하여 붙여넣을 수 있습니다.
```
<Button x:Name="button" Content="Button" HorizontalAlignment="Left" Margin = "152,293,0,0" VerticalAlignment="Top"/>
```
이 시점에서 매우 간단한 앱을 만들었습니다. 이제 앱을 빌드, 배포 및 시작하고 앱의 모양을 확인할 수 있습니다. 로컬 컴퓨터, 시뮬레이터 또는 에뮬레이터 또는 원격 디바이스에서 앱을 디버그할 수 있습니다. Visual Studio의 대상 디바이스 메뉴는 다음과 같습니다.

앱 디버깅하기 위한 디바이스 대상의 드롭다운 목록

기본적으로 앱은 로컬 컴퓨터에서 실행됩니다. 대상 디바이스 메뉴는 데스크톱 디바이스 패밀리의 디바이스에서 앱을 디버깅하기 위한 몇 가지 옵션을 제공합니다.
- HelloWorld (로컬 컴퓨터에서 실행됨)
- WSL
- 새 에뮬레이터 다운로드...
앱을 실행하여 실행 중인 단추를 확인합니다. 로컬 컴퓨터에서 디버깅을 시작하려면 디버그 |를 선택하여 앱을 실행할 수 있습니다. 도구 모음에서 시작 디버깅 단추를 클릭하거나( HelloWorld 레이블 사용) F5 키를 눌러 메뉴에서 디버깅 항목을 시작합니다.

앱이 창에서 열리고 기본 시작 화면이 먼저 나타납니다. 시작 화면은 이미지(SplashScreen.png) 및 배경색(앱의 매니페스트 파일에 지정됨)으로 정의됩니다.

시작 화면이 사라지고 앱이 나타납니다. 다음과 같습니다.
Windows 키를 눌러 시작 메뉴를 연 다음 [ 모두 ]를 선택하여 모든 앱을 표시합니다. 앱을 로컬로 배포하면 시작 메뉴의 프로그램 목록에 앱이 추가됩니다. 나중에 디버깅 모드가 아닌 앱을 다시 실행하려면 시작 메뉴에서 앱을 선택할 수 있습니다.

아직 많은 작업을 수행하지는 않지만 축하합니다. 첫 번째 UWP 앱을 빌드하고 로컬 컴퓨터에 배포했습니다.
디버깅을 중지하려면:

도구 모음에서 디버깅 중지 단추()를 클릭합니다.

–또는–

디버그 메뉴에서 디버깅 중지클릭합니다.

–또는–

앱 창을 닫습니다.
Content 값을 Button로 변경하여 Hello, world!의 텍스트를 변경합니다.
```
<Button x:Name="button" Content="Hello, world!" HorizontalAlignment="Left" Margin = "152,293,0,0" VerticalAlignment="Top"/>
```
앱을 다시 실행하면 단추가 업데이트하여 새 텍스트가 표시됩니다.

3단계: 이벤트 처리기

"이벤트 처리기"는 복잡해 보이지만 이벤트가 발생할 때 호출되는 코드의 또 다른 이름입니다(예: 사용자가 단추를 클릭하는 경우).

아직 실행되지 않은 경우 앱 실행을 중지합니다.
XAML 편집기에서 입력을 Click 시작하면 Visual Studio에서 가능한 이벤트 목록이 표시됩니다. 목록에서 클릭 을 선택합니다.
다음으로 목록에서 선택합니다 <New Event Handler> . 그러면 코드 숨김 파일(MainPage.xaml.cs)에 새 이벤트 처리기 메서드가 만들어지고 XAML 코드의 단추 요소에 이벤트가 추가됩니다 Click .

XAML 편집기에서는 XAML 코드의 단추 요소에 이벤트를 자동으로 추가합니다 Click .
```
<Button x:Name="button" Content="Hello, world!" HorizontalAlignment="Left" Margin = "152,293,0,0" VerticalAlignment="Top" Click="button_Click"/>
```
또한 코드 숨김 파일(MainPage.xaml.cs)에 이벤트 처리기를 추가합니다. 이벤트 처리기는 단추를 클릭할 때 호출되는 메서드입니다. 메서드 button_Click의 이름은 다음과 같은 두 개의 매개 변수 object sender 가 있습니다 RoutedEventArgs e.
```
private void button_Click(object sender, Windows.UI.Xaml.RoutedEventArgs e)
{

}
```
이 Click 이벤트는 단추에 대한 표준 이벤트입니다. 사용자가 단추를 클릭하면 메서드가 button_Click 호출됩니다.

코드 숨김 페이지인 MainPage.xaml.cs 이벤트 처리기 코드를 편집합니다. 이것이 바로 흥미로운 일입니다. 다음과 같이 변경해 보겠습니다.

private async void button_Click(object sender, Windows.UI.Xaml.RoutedEventArgs e)
{
    var mediaElement = new MediaElement();
    var synth = new Windows.Media.SpeechSynthesis.SpeechSynthesizer();
    Windows.Media.SpeechSynthesis.SpeechSynthesisStream stream = await synth.SynthesizeTextToStreamAsync("Hello, World!");
    mediaElement.SetSource(stream, stream.ContentType);
    mediaElement.Play();
}

메서드 서명에 비동기 키워드가 포함되어 있는지 반드시 확인하세요. 그렇지 않으면 앱을 실행하려고 할 때 오류가 발생합니다.

우리는 방금 무엇을 했는가?

이 코드는 일부 Windows API를 사용하여 음성 합성 개체를 만든 다음 말할 텍스트를 제공합니다. SpeechSynthesis 사용에 대한 자세한 내용은 WinRT(Windows 런타임) API 설명서의 SpeechSynthesis 네임스페이스를 참조하세요.

앱을 실행하고 단추를 클릭하면 컴퓨터(또는 휴대폰)가 문자 그대로 "Hello, World!"라고 표시됩니다.

요약

축하합니다. .NET 9를 사용하여 Windows용 첫 번째 UWP 앱을 만들었습니다.

ko-KR: 앱에서 사용할 컨트롤을 배치하기 위해 XAML을 사용하는 방법을 배우려면 그리드 자습서을 시도해 보거나, 바로 다음 단계로 이동하세요.

UWP 앱을(를) 게시합니다.
UWP 앱 개발에 대한 방법 안내 문서
UWP 개발자를 위한 코드 샘플