첫 번째 WinUI 앱 빌드

첫 번째 WinUI 앱을 빌드하고 Windows에서 앱이 실행되는 모습을 확인할 수 있습니다. 이 빠른 시작에서는 도구 설정부터 앱을 실행하는 것까지 안내한 다음, 첫 번째 인터페이스 업데이트를 안내합니다.

시작하기 전에

학습할 내용

  • 개발 도구를 선택하고 설정합니다.
  • WinUI 앱을 만들고 실행합니다.
  • 인터페이스를 업데이트하고 실행 중인 앱에서 변경 내용을 확인합니다.

개발 도구 선택

이 빠른 시작을 통해 권장되는 경로를 따릅니다.

  • winapp CLI: 선호하는 편집기에서 터미널로 작업하세요. 이 명령줄 워크플로는 에이전트 코딩에도 적합합니다.
  • Visual Studio: 통합 개발 및 디버깅 환경을 사용합니다.

도구가 이미 설치되어 있다면 첫 번째 앱 만들기로 이동하세요.

도구 설치

  1. 개발자 모드를 활성화합니다. 해당 설정은 개발자 설정에서 열 수 있습니다.

  2. .NET 10 SDK 및 Windows 앱 Development CLI를 설치합니다. WinGet을 사용하는 경우 다음을 실행하세요:

    winget install --id Microsoft.DotNet.SDK.10 --exact --source winget
    winget install --id Microsoft.WinAppCLI --exact --source winget
    

    필요한 도구가 이미 설치된 경우 설치를 건너뜁니다.

  3. 설치된 명령을 인식하도록 새 터미널을 연 다음, 버전을 확인하세요.

    dotnet --version
    winapp --version
    

    이 워크플로에는 .NET SDK 10 이상 및 winapp CLI 0.6 이상을 사용하세요.

메모

winapp CLI는 공개 미리보기 상태입니다. winapp new는 WinUI 프로젝트 템플릿을 관리하지만 .NET SDK는 설치하지 않습니다. 새 프로젝트 명령과 실행 명령은 CLI 0.6 공지를 참조하세요.

첫 번째 앱 만들기

위에서 설치한 워크플로를 사용하여 프로젝트를 만들고 실행합니다.

프로젝트를 저장해 둔 폴더에서 다음을 실행하세요:

winapp new --name MyWinUIApp --template winui --use-defaults
cd MyWinUIApp
winapp run

winapp new는 빈 WinUI 앱을 만듭니다. winapp run는 프로젝트를 빌드하고 실행합니다. 따로 빌드하거나 패키지 등록 명령을 실행할 필요가 없습니다.

앱이 데스크톱 창을 엽니다. 아래의 변경하기를 선택하여 계속하세요.

변경하다

방금 만든 프로젝트를 그대로 둡니다. 기존 인터페이스에 메시지를 추가하세요.

  1. 실행 중인 앱을 닫으세요. MainPage.xaml을(를) 편집기에서 엽니다. 템플릿에 해당 파일이 포함되어 있지 않으면 대신 MainWindow.xaml를 엽니다.

  2. 앱의 콘텐츠가 들어 있는 레이아웃 패널을 찾으세요. 현재 CLI의 빈 템플릿에서는 MainPage.xaml에 빈 <Grid />가 포함되어 있습니다. 빈 그리드를 다음으로 대체합니다.

    <Grid>
        <TextBlock
            Text="Hello, WinUI!"
            HorizontalAlignment="Center"
            VerticalAlignment="Center" />
    </Grid>
    

    패널에 이미 컨트롤이 포함되어 있는 경우 해당 패널 내부에만 TextBlock 추가합니다. 기존 컨트롤, 이름 및 이벤트 처리기를 유지합니다. 주변 Page 또는 Window프레임 및 제목 표시 MainWindow.xaml줄을 대체하지 마세요.

  3. 파일을 저장합니다. 프로젝트 폴더에서 다시 실행 winapp run 하거나 Visual Studio F5 키를 누릅니다.

축하합니다! 첫 번째 WinUI 앱을 만들고, 실행하고, 업데이트했습니다. 이제 창에 Hello, WinUI가 표시됩니다.

Troubleshooting

문제 확인할 사항
winapp 또는 dotnet 인식되지 않습니다. 설치 후 터미널을 다시 여세요. CLI 탭의 버전 명령을 사용하여 두 도구를 모두 사용할 수 있는지 확인합니다.
winapp new 가 인식되지 않습니다. 이 워크플로에는 winapp CLI 0.6 이상이 필요합니다. 선택한 설치 방법으로 CLI를 업데이트하세요.
Visual Studio에 WinUI 템플릿이 표시되지 않습니다. Visual Studio 설치 관리자를 열고 수정을 선택하고 WinUI 애플리케이션 개발 워크로드가 설치되어 있는지 확인합니다. 나중에 Visual Studio 다시 시작합니다.
빌드에서 SDK 또는 복원 오류를 보고합니다. 선택한 워크플로의 필수 구성 요소와 빌드 출력의 첫 번째 오류를 확인합니다. 프로젝트 속성을 변경하기 전에 Windows 앱 SDK 지원을 사용하여 버전 요구 사항을 확인합니다.
배포는 개발자 모드가 비활성화되었다고 보고합니다. 개발자 모드를 사용하도록 설정한 다음, 앱을 다시 실행합니다.
새 메시지가 표시되지 않습니다. XAML 파일을 저장하고 프로젝트를 다시 실행하세요. 템플릿에서 MainPage.xaml창의 호스팅 프레임을 바꾸는 대신 해당 페이지에 메시지를 추가합니다.

다음 단계

Notes 자습서에서는 별도의 WinUINotes 프로젝트를 사용하여 페이지, 탐색, 데이터 바인딩 및 로컬 스토리지를 학습합니다. 리소스에서도 포커스된 컨트롤 예제를 찾을 수 있습니다.