Stanford cs193p Lecture 2 - MVVM & Type

rloyhvv·2021년 4월 30일
0
post-thumbnail

2강은 다루는 내용이 많아서 아마 나눠서 포스팅할 것 같다.
MVVM & Type 이론 -> Memorize 코드 실습 단계로 나뉜다.
지금은 MVVM 개념을 다루려고 한다.

MVVM

MVVM은 소프트웨어 아키텍처 패턴이다. Model-View-ViewModel 약자다. MVVM 말고도 MVC, MVP도 있다. 2019년 애플에서 SwiftUI를 발표할 때 MVVM 패턴을 새로 소개하였는데 SwiftUI를 사용하려면 MVVM은 반드시 알아야한다.

Model

우선 UI 부분과 data, logic 부분을 분리하고 싶다. 여기서 View가 UI이고 Model이 data, logic이다. 따라서 Model 코드를 작성할 때 import swiftUI 이딴 거 안 한다. 지금 만드는 카드게임을 예시로 들면 model이 갖는 내용을 다음과 같다.

  • 어떤 카드가 들어있는지
  • 카드를 선택했을 때 어떤 일이 일어나는지
  • 카드를 맞췄으면 점수를 어떻게 줄지
  • 카드를 못맞췄으면 어떻게 할지

View

  • Stateless
    View는 Model을 반영한다. 데이터는 Model에만 존재하기 때문에 데이터는 항상 Model에서 View로 흐른다. View에서 보여주는 모든 것들은 Model이 가진 것들을 반영한다. Model이 어떤 state를 갖고 있던 View는 그것을 보여줄 뿐이다. 따라서 View는 Stateless이다.

  • Declarative
    Declared View는 함수의 동작 순서가 바뀐다고 해서 View 생김새가 달라지지 않는다.

struct CardView: View {
    var isFaceUp: Bool
    var body: some View {
        ZStack {
            if isFaceUp {
                RoundedRectangle(cornerRadius: 10.0).fill(Color.white)
                RoundedRectangle(cornerRadius: 10.0).stroke(lineWidth: 3.0)
                Text("👻")
            } else {
                RoundedRectangle(cornerRadius: 10.0).fill()
            }
        }
    }
}

1강에서 작성한 카드 관련 코드이다. ZStack, RoundedRectangle같은 것들은 모두 화면의 생김새를 정의하는 것들이다. fill(), stroke()같은 함수 역시 생김새를 바꾸는 modifier이다.

  • reactive
    Model이 바뀔 때마다 View가 변경사항을 즉각 반영한다.

ViewModel

ViewModel은 View와 Model을 이어준다. Reactive View를 만들려면 Model이 View에게 변경사항을 알려줘야하는데 이 역할을 ViewModel이 한다.

  • from Model to ViewModel
    Model은 변경사항을 ViewModel에게 알린다.
  • from ViewModel to View
    ViewModel은 Model의 변경사항을 공표한다. (publish라는 단어를 쓰더라)
    중요한 점은, ViewModel은 View에게 직접 말하지 않는다.
    View가 ViewModel을 보고 있다가 ViewModel이 새로 공표한 사안을 끌어와서 화면을 새로 만든다.여기서 subscribe라는 단어를 쓰는데 유튜버가 자기 채널에 새로운 영상을 올리면 그 채널을 구독하는 구독자들이 채널을 방문하여 새로운 동영상을 보는 것과 비슷한 것 같다. 유튜버가 사람들에게 자기 영상을 강제로 시청하게 하는 건 아니니까.

  • from View to ViewModel
    View는 ViewModel에게 intent function을 호출한다.
    버튼을 클릭하거나 화면을 좌우로 넘기면 화면이 바뀌는데 이 때 Model도 바뀌어야한다. 즉, View가 자신의 의도를 ViewModel에게 넘긴다.
  • from ViewModel to Model
    ViewModel은 이를 Model에게 전달할지 말지를 결정한다. 괜찮다 싶으면 ViewModel이 Model을 수정한다. Model에 변경사항이 생겼으니 Model은 ViewModel에게 변경사항을 알릴거고, ViewModel이 Model의 변경사항을 공표하고, View가 이를 캐치하여 화면을 자동 업데이트할 것이다.

Type

  • struct
  • class
  • protocol
  • "don't care" type (a.k.a generic)
  • enum
  • function

이번 강의에서는 4개만 다루고 나머지 2개는 다음 강에서 다룬다고 한다.

  • struct : value type, class: reference type
  • ViewModel == class, rest of things : struct (w/o View)

  • Generics (don't care type)
    Array를 예로 들었을 때, Array 안에 어떤 type이 들어가든 상관없으나 Array 안에 variable을 넣고 빼는 등의 동작을 할 때 해당 variable의 type을 알려주어야한다. 그래서 placeholder같은 개념으로 Element를 기입한다. (Elment말고 foo, T, M 등 아무거나 적어도 괜찮음) 이를 type parameter라고 부른다.

  • Function
    function도 int, string처럼 하나의 type이다.
var foo: (Double) -> Void

여기서 foo의 type은 'Double을 input으로 받고 아무것도 return 하지 않는 function'이다.
(scala로 functional programming을 배울 때 clousre 파트에서 봤던 내용같다)

여기까지가 이론이고 여기서 배운 MVVM과 type을 이어지는 실습에서 활용한다. 실습 파트는 다음 글로 넘겨야겠다.

0개의 댓글