ViewModel 먼저 개발하기 - 上

👨‍🏫 튜토리얼, 팁, 강좌
,
1

ViewModel 먼저 개발하기 - 上

이철우

응용프로그램에서 사용자 접속(UI)과 논리(Logic)를 분리하는 것은 여러가지 장점이 있다. 디자이너와 개발人의 협업을 가능하게 하고, 논리와는 별개로 UI를 바꿀 수 있으며, 하나의 논리에 여러 UI를 짝지을 수 있으며, 테스트를 쉽게 한다. C# WPF 프로젝트에서는 가장 진보한 MVVM 패턴을 이용하여 UI와 논리를 분리하는 것이 WPF 장점을 살리는 것이다.

MVVM 패턴은 - Model(논리), View(UI), ViewModel - 이렇게 세 개로 이루어져 있다. ViewModel(VM)이 논리와 UI를 붙이는 역할을 한다. 디자이너(또는 개발人)는 View를 개발人은 Model과 ViewModel을 담당하게 된다.

좁은 의미에서 UI는 GUI(Graphic User Interface)를 말한다. 이 글에서도 UI는 GUI를 대신한다. 글쓴이는 GUI를 '마이크로소프트 윈도우’를 통해 처음 접했고, '마이크로소프트 Visual C++(MFC)'를 이용하여 첫 GUI 응용프로그램을 개발했다. 이 때, '윈도우 메세지 루프’를 알게 되었다.

다시 이 글의 주제 - ViewModel 먼저 개발 - 로 돌아가자. 글쓴이도 몇 번의 프로젝트에서 MVVM 패턴에 익숙해지는 시간을 가졌다. 최근에 윈도우 데스크탑 프로젝트인데 MacOS에서 콘솔 프로젝트로 개발을 시작해야 하는 상황이 발생했다. UI는 나중에 작업해도 되기에 Model과 흉내낸 ViewModel을 개발하고, 윈도우OS에서 View와 붙일 시점에 흉내낸 ViewModel을 조금 고치기로 하였다. 이 때의 경험이 'View 먼저’가 아닌 'ViewModel 먼저 개발’에 친숙해지는 계기가 되었다.

이 글에서는 MVVM 패턴을 적용하기 전에, '윈도우 메세지 루프’를 흉내낸 콘솔 프로그램을 소개하며 마무리 하고, 다음 글에서 모델(Model)과 흉내낸 ViewModel을 만들어 '윈도우 메세지 루프’에 적용/테스트 한다. 여기까지는 콘솔 프로젝트로 진행하며, 마지막 글에서 View와 정상 ViewModel을 WPF 데스트탑 프로젝트로 만들 것이다.

아래는 '윈도우 메세지 루프’를 흉내낸 .Net7 콘솔 프로젝트(이름 ViewModelFirst) 코드이다.

// Program.cs

Console.WriteLine("Hello, World!");

var isQuitRequired = false;

while (!isQuitRequired)
{
    var input = Console.ReadLine();
    switch (input)
    {
        case "quit":
            isQuitRequired = true;
            break;
        default:
            Console.WriteLine(input);
            break;
    }
}

Console.WriteLine("Bye.");
5개의 좋아요