[iOS] SwiftUI 개요

SwiftUI 개요

2019년 애플의 WWDC에서 처음 소개된 SwiftUI는 모든 애플 운영체제용 앱을 개발하는데 있어 완전히 새로운 패러다임을 제시하였다.

SwiftUI의 기본적 목적은 앱 개발을 기존 방식보다 쉽고 효율적으로 함과 동시에 소프트웨어 개발시 발생하는 일반적인 버그들을 줄이는 것이다.

SwiftUI의 수많은 장점은 선언적 구문 과 데이터 주도에서 비롯되며 이번 페이지에서 공부할 핵심적인 주제다.

UIKit 그리고 Interface Builder

---

선언적 구문(Declarative Syntax) 에 대한 의미 그리고 장점을 이해하기 위해서는 UI 레이아웃이 SwiftUI 이전에는 어떠한 방식으로 설계되었는지 이해하는 것이 바람직하다.

SwiftUI 도입 이전에는 iOS Software Development Kit, SDK를 구성하는 여러 프레임워크와 함께 UIKit을 이용하여 iOS 앱을 개발하였다.

앱 화면을 구성하는 UI를 설계하기 위해 Xcode에서는 Interface Builder 라는 도구가 내포되어 있었으며, 이를 통해 앱을 구성하는 각각의 화면을 담은 스토리보드를 생성할 수 있게 해준다.

이러한 개발 과정 단계에서는 모든 것이 개발자가 의도한대로 흘러가는지, 잘 작동하는지 확인하기 위해 각각의 디바이스 타입의 시뮬레이터 혹은 실제 디바이스에서 앱을 컴파일하고 실행해야했다.

SwiftUI의 선언적 구문

---

앞서 얘기했던 기존의 UIkit과 인터페이스 빌더를 사용한 UI 구성 방식과는 달리 SwiftUI에서는 선언적 구문 방식으로 UI를 구성한다.

화면을 구성하는 컴포넌트들의 레이아웃 모양과 이에 대한 디테일 내역을 직접 설계하는 대신에, 단순하면서도 직관적인 구문을 이용하여 화면을 기술할 수 있게 해준다.

다시 말해, UI가 어떠한 모양이여아 하는지를 개발자가 직접 선언하는 방식으로 레이아웃이 생성된다.

이 과정 내에서는 기본적으로 레이아웃에 배치될 컴포넌트들을 선언하고, 이를 포함하는 레이아웃 매니저(ex: Stack, Form, List...etc)를 명시하고, 속성을 설정하기 위해 수정자(modifier)를 이용한다.

이렇게 선언하고 나면 레이아웃의 위치와 제약조건, 그리고 렌더링 방법에 대한 복잡한 사항들은 모두 SwiftUI가 담당한다.

뿐만 아니라, SwiftUI를 이용하면 시뮬레이터 혹은 실 디바이스에 빌드하고 실행하지 않아도 프리뷰 캔버스 내에서 앱을 실행하고 테스트할 수 있다.

SwiftUI는 데이터 주도적(Data Driven)이다.

---

여기서 얘기하는 데이터 주도적 이라는 의미는 앱 내 데이터와 앱의 UI 및 로직 사이에 대한 관계를 의미한다.

SwiftUI는 앱의 데이터 모델과 UI 컴포넌트, 끄리고 기능을 제공하는 로직을 바인딩(binding) 하는 여러 방법으로 복잡도를 해결한다.

데이터 주도적인 구현을 위해서는 데이터 모델은 구독(subscribe)할 수 있는 변수를 게시(publish)하게 된다.

이러한 방법을 통해 데이터가 변경되었다는 사실을 모든 구독자들에게 자동으로 알릴 수 있다. (Swift의 Observer 혹은 RxSwift와 비슷한듯..?)

만일 UI 컴포넌트와 데이터 모델 간 바인딩이 된다면, 추가적 코드를 작성하지 않아도 모든 데이터의 변경 사항을 SwiftUI가 UI에 자동으로 반영할 것이다.

정리

---

SwiftUI는 기존 방식(UIKit + Interface Builder)과는 다른 방법을 도입하였다.

이는 UI의 렌더링을 직접 구현하는 것이 아닌, 선언적 구문을 통해 UI를 선언하는 방식으로 진행된다.

또한, 데이터의 변화가 앱의 동작과 모양을 주도한다는 점에서 데이터 주도적이다.

Summary

---

• SwiftUI의 수많은 장점은 선언적 구문 과 데이터 주도에서 비롯되며 이번 페이지에서 공부할 핵심적인 주제다.

• SwiftUI의 기본적 목적은 앱 개발을 기존 방식보다 쉽고 효율적으로 함과 동시에 소프트웨어 개발시 발생하는 일반적인 버그들을 줄이는 것이다.

• 기본적으로 레이아웃에 배치될 컴포넌트들을 선언하고, 이를 포함하는 레이아웃 매니저(ex: Stack, Form, List...etc)를 명시하고, 속성을 설정하기 위해 수정자(modifier)를 이용한다.

• SwiftUI는 앱의 데이터 모델과 UI 컴포넌트, 끄리고 기능을 제공하는 로직을 바인딩(binding) 하는 여러 방법으로 복잡도를 해결한다.