'예제코드'에 해당하는 글 1건

[번역]VIPER 아키텍처로 iOS 앱 만들기

share this post

제목 : Building iOS App with VIPER Architecture

이 글은 완전히 iOS VIPER 아키텍처에 관한 내용이다. 우리는 3가지 포인트를 통해 이야기해 나갈 예정이다.

이 표준 아키텍처는 재사용성과 테스트용이함에대해 코드를 분리시켜주는 중요한 역할을 한다. 이 아키텍처는 그 역할에 맞춰 앱 컴포넌트를 분리시키며, 이것은 seperation of concern이라 부른다.

이제 iOS를 위한 VIPER 아키텍처에대해 탐험해보자.

VIPER 아키텍처란?

VIPER는 View, Interactor, Presenter, Entity, Router로 구성되있다.

이 아키텍처는 단일책임원칙(링크)를 기반으로 하는데, 이것이 명확한 아키텍처로 만들어준다.

View : View의 책임은 사용자의 동작을 Presenter로 보내주고 Presenter가 요청하는 모든 것을 보여준다.
Intereactor : 이것은 비지니스 로직을 가지고있는 앱의 뼈대이다.
Presenter : 이것의 책임은 사용자 동작에 Interactor에서 데이터를 뽑아온 뒤, 그것을 보여주기 위해 View에 보낸다. 또한 네비게이션(화면이동)을 위해 router(혹은 wireframe)에게 물어보기도한다.
Entity : Interactor에서 사용하는 기본 오브젝트 모델이다.
Router : 이것은 어느 화면이 언제 나타날지에대한 정보를 담고 있는 네비게이션 로직이다. 보통 wireframe으로 쓰인다.

VIPER 아키텍처의 청사진

보통 VIPER 아키텍처는 큰 프로젝트에서 쓰인다. 그러나 이해를 돕기위해 이것을 위한 작은 앱을 하나 만들었다.

VIPER 아키텍처로 iOS 앱 만들기

나는 VIPER 아키텍처를 사용한 샘플 iOS 앱을 하나 만들었다.

이해를 돕기위해 프로젝트의 구조를 보자

샘플 앱의 스크린샷이다.

이 앱은 3가지 화면으로 구성된다.

시작화면 : 일반적인 시작화면이다 따라서 더 설명할건 없다.
PostListView :화면 이 PostListView는 포스팅 목록을 가져와라고 Presenter에게 말한다. 그런 다음 Presenter는 관련 데이터를 위해 Interactor에게 접근한다. Intereactor는 로컬 데이터베이스에서 그 데이터의 사용 가능 여부를 확인해보고, 만약 데이터가 있으면 Presenter로 반환하고, Presenter는 View로 반환한다. 데이터가 로컬 데이터베이스에 없을경우 네트워크를 호출하여 데이터를 가져온 다음 Presenter에게 반환한다. 그리고 역시 이 데이터를 로컬 데이터베이스(CoreData)에 저장한다.
PostDetailView 화면 : 사용자가 PostViewList에 표시된 포스트를 클릭하면, PostListPresenter는 PostDetailView를 열어도 되는지 Router(PostListWireFrame)에게 물어본다. 선택된 포스팅의 세부사항이 이 화면에 나타난다.

그리고 이 프로젝트에서 대부분 클래스간의 의사소통은 정의된 프로토콜을 통해 일어난다.

이것을 완전히 이해하는데 가장 좋은 방법은 소스코드를 확인하고 구현해보는 방법일 것이다. 프로젝트를 깃으로 클론해서 빌드&런 해보자.

VIPER 아키텍처의 이점들

이게 다다. 즐거운 코딩하길 바란다 :)

이 블로그는 공부하고 공유하는 목적으로 운영되고 있습니다. 번역글에대한 피드백은 언제나 환영이며, 좋은글 추천도 함께 받고 있습니다. 피드백은

으로 보내주시면 됩니다.

[번역]스위프트에서 중복을 피하기위한 프로토콜과 MVVM (0)	2017.07.20
[번역]MVP와 MVC가 무엇이며, 그 차이는 무엇입니까? - StackOverflow (3)	2017.05.11
[번역]코코아에서 본 Model-View-Controller (0)	2017.05.09
[번역] 어떻게 네트워크 레이어를 만들 수 있을까? (0)	2016.12.29
(번역)Real World Flux Architecture on iOS (0)	2016.10.01

WRITTEN BY