1. 소개

저는 iOS 개발자입니다. 최근 플러터를 알게되고 흥미가 생기게 되어 간단하게 프로젝트를 진행하고 실제 앱 출시까지 해보았습니다. 출시 후기 및 개인적으로 느꼈던 플러터의 장단점에 대해 한번 얘기해보려고 합니다.

저 역시, 플러터를 시작할 때 ‘이걸 배워도 괜찮은걸까?’ 라는 생각에 망설이기도 하고 검색도 많이 해 보았는데요, 저처럼 플러터를 시작하고 싶은데 망설이는 분들에게 조금이라도 도움이 되었으면 하는 바램으로 정리해 보았습니다.

2. 직구 환율 계산기

2. 1. 앱 소개

제목에서 직관적으로 알 수 있듯이 간단한 환율 계산 앱입니다. 1시간 단위로 환율을 서버에서 API 를 통해서 가져오며, 해당 계산을 저장하여 현재 환율과 비교를 해 볼 수 있습니다.

2. 2. 스펙 및 개발 기간

크게는 앱 / 서버 / 배포 준비 이렇게 나눌수가 있을 것 같습니다. 전체 개발 기발은 약 7일 정도가 걸린 것 같고. git 의 최초 커밋한 날과 아이폰 앱 스토어에 노출하기 까지는 9일이 걸렸습니다. 기획과 디자인이 된 상태에서 플러터에 익숙하신 분이라면 거의 하루 혹은 이틀 만에 만들지 않았을까 생각합니다.

환율 정보의 경우 여러 사이트에서 API 를 제공하긴 하지만 요청횟수 제한으로 인해 직접 서버를 만들어, 해당 서버에 캐싱하는 방법을 선택하였습니다. API 서버는 카페24의 Node.js 호스팅을 이용하여 개발했습니다. 디자인 및 기획은 앱을 개발하면서 동시에 진행했습니다. 분야별 대략적인 소요기간은 아래와 같습니다.

• 앱 기획 / 디자인 개발 - 약 4일
• Node.js API 서버개발 - 약 2일
• 앱 배포 준비 및 배포 - 약 1일

2. 3. 결과물

아래는 갤럭시 S9, 아이폰 11 pro 에서 실행한 모습입니다. 두 플랫폼에서 모두 비슷한 UI 를 보여주고 있으며, 결과물 예상 이상으로 만족스러웠습니다. 광고 노출 제어를 제외하면 플랫폼에 대한 분기처리는 전혀 없었습니다.

3. 플러터 후기

실제 개발을 시작하고 앱을 출시하기 까지 느꼈던 플러터의 특징과 장단점을 한번 얘기해보도록 하겠습니다. 또한 아래 내용들은 개인적인 내용들을 많이 포함하고 있기 때문에 이 점 참고해주시면 감사하겠습니다.

3.1. 장점

하나의 코드로 안드로이드, 아이폰, 웹에 배포할 수 있다.

플러터를 시작한 가장 큰 이유이기도 하고, 사실 어떻게 작동하는지 궁금하기도 했는데, 실제로 코드를 작성하고 안드로이드 및 아이폰 단말기에 올려 체감을 해보니 예상했던 것 보다 장점이 더 크게 다가왔습니다. 앞서 언급한 것 처럼 결과물도 유사하고 굉장히 만족스러워서 실제로 개발 후 ‘이게 실재로 가능하구나’ 라고 직접 느낄수 있었습니다.

핫 리로드는 정말 환상적이다.

플러터의 가장 큰 장점 중 하나는 핫 리로드 입니다. UI 코드를 작성할 때 마치 웹페이지의 새로고침처럼 다시 빌드를 해서 확인할 수 가 있습니다.

사실 개발하기 전에는 뭐 빠르다니 얼마나 빠르겠어라고 생각을 했는데, 실제 체감을 해보니 정말 환상적이었습니다. iOS의 SwiftUI 를 통한 미리보기를 지원하기는 하지만 사실 플러터에 비하면 아쉬운 것이 사실입니다.

심지어 시뮬레이터가 아닌 단말기에서도 핫 리로드가 가능해서 세밀한 디자인 수정을 할때는 정말 유용하고 빠르게 작업할 수 있습니다.

문서화 및 한글화가 정말 잘 되어 있다.

프로젝트를 시작할 때 공식 사이트의 문서를 많이 참고했습니다. 특히, iOS 개발자를 위한 Flutter 라는 문서가 있는데, 기존의 iOS 개발과 비교하여 플러터를 설명해서 좀 더 친근하게 다가갈 수 있었던 것 같습니다.

UI 구성부터 네트워크를 이용한 데이터 가져오기 / json parsing 등 앱을 개발하는데 필요한 기본적인 내용들은 한글화된 공식 문서에서 다루고 있기 때문에, 정말 많은 도움이 되었습니다. 그 외에 테스트, 아이폰 및 안드로이드 배포에 관련된 문서도 잘 되어 있어서 크게 어려움 없이 개발 할 수 있었습니다.

플랫폼에 특화된 기능들도 제공한다.

예를 들어 이번 프로젝트에 사용성을 위해 키패드를 누르면 햅틱을 적용하였습니다. 사실 이 기능은 처리 방식이나 API 도 다를텐데, 플러터에서 지원을 하고 아이폰 및 안드로이드 플랫폼에 맞게 반영되었습니다. 각각의 플랫폼의 특성을 몰라도 플러터내에서 제공하는 기능들을 통해서 개발이 가능했습니다.

Dart 언어를 통한 다양한 기능들을 제공한다.

Optional, Future, Class Extension 등 기존의 Swift 에서도 사용했던 편리한 기능들을 제공하고 있습니다. 그래서 비슷한 부분들은 사용하는데 크게 어려움 없이 쉽게 익숙해질 수 있었습니다. 그리고 비동기 처리 역시 Dart 에서 지원하는 async / await, future, stream 등으로 손쉽게 처리할 수 있어서 앱 개발에 필수적인 비동기 처리 역시 크게 어려움 없이 개발할 수 있었습니다.

구글 서비스(Admob, Firebase 등) 의 연동이 쉽다.

Flutter 는 구글이 만들고 제공하는 플랫폼입니다. 그래서 구글이 제공하는 서비스나 라이브러리 같은것들과 연동이 굉장히 쉬운 것 같습니다. 안드로이드만 광고 적용을 위해 Admob 을 사용하였는데 이 부분 역시 정말 쉽게 적용할 수 있었습니다.

3.2 단점

UI 코드의 계층구조 다소 장황한 코드.

사실 이부분이 가장 불편했던 부분중 하나가 아닌가 생각합니다. 플러터는 기본적으로 UI 컴포넌트의 속성을 주기위해선 해당 컴포넌트를 감싸야 합니다. 그래서 계층 구조가 굉장히 깊어집니다. 사실 이 부분은 컴포넌트화 하면 어느정도 해결할 수 있지만 그럼에도 불구하고 중첩 코드가 생기고 가독성이 떨어지는 점은 어쩔 수 없어 보입니다.

아래 내용은 Hello World 라는 글자에 10 안쪽 여백 (padding) 을 주고, 파란색 배경을 적용하는 코드를 SwiftUI 와 Flutter 로 작성한 코드입니다.

Text("Hello World")
    .font(.system(size: 30, weight: .bold))
    .foregroundColor(.black)
    .padding(EdgeInsets(top: 10, leading: 10, bottom: 10, trailing: 10))
    .background(.blue)
    .onTapGesture {
        print("Hello World")
    }

GestureDetector(onTap: (){
  print("Hello World");
}, child: Container(
  padding: EdgeInsets.fromLTRB(10, 10, 10, 10),
  color: Colors.blue,
  child: Text("Hello World",
      style: TextStyle(
          fontWeight: FontWeight.bold, color: Colors.black, fontSize: 30
      )
  ),
))

Swift 에 비해 Dart 가 디테일한 기능이 부족

Dart 라는 언어가 웹을 위한 언어라 그런지, Swift 에 비해 지원하는 기능들이 많이 부족해 보였습니다. 개인적으로 가장 마음에 들지 않은 부분은 내부 변수 (private) 를 선언하기 위해서 _name 형태로 작성하는 것이었습니다. Swift 에서는 접근 범위에 다석 가지 접근제어자를 제공하는 것에 비해 부족해 보입니다.

또 다른 한 예로는 enum을 들 수 있습니다. Swift 에서는 String, Int 등 여러가지 타입을 이용해서 지정이 가능하고 값을 가질 수 있는 associated enum type 을 지원하지만, Dart 는 이러한 부분을 지원하지 않습니다.

그리고 extension 을 지원하긴 하지만, 함수만 가능하다는 점, associated enum 등 Swift 에서 존재하는 기능들이 없어서 아쉬웠습니다.

마지막으로 최근 언에서는 문장 끝에 세미콜론을 적는 방식을 없애는 추세인것 같은데, Dart 에서는 세미콜론을 처리하지 않으면 컴파일 에러가 발생합니다. 이 부분에서 실수를 많이 하게 되어 아직도 적응이 안되는 부분중 하나입니다. 아래 코드는 Swift / Dart 로 Person 이라는 클래스를 동일한 형태로 작성한 것입니다.

class Person {
	private(set) var String name

	private func print() {
		print(name);
}

class Person {
	String _name; // private 변수

	String get name => _name; // private 변수 getter

	void _print() {
		print(name);
	}
}

성능

플러터는 ‘네이티브' 급의 성능을 자랑한다고 소개되어 있습니다. 얼핏 보면 차이점을 잘 모를 것 같지만, 코드가 복잡해지고 UI 에 많은 요소들이 포함되면 스크롤이라던지 화면전환등 확실히 성능저하가 있어 보입니다. 특히 가장 체감이 심했던 부분은 앱을 실행할 때 인데, 앱을 실행하고 난 직후 앱이 굉장히 버벅임이 심합니다. 검색을 해보니 앱 실행시 플러터의 엔진을 로딩하는 과정에서 발생하는 문제이고 현재까지도 해결하지 못한 것으로 보입니다.

라이브러리 및 문제해결에 대한 리소스 부족

기본적인 개발엔 부족이 없었으나 Swift 및 Objective-C 의 외부 라이브러리에 비해 부족한 것은 사실입니다. 그리고 보통 문제가 발생했을경우 저를 포함한 많은 개발자들이 구글 검색을 통해 해결 방법을 찾을텐데 확실히 이 부분은 기존의 iOS 앱을 개발할 때 보다 검색결과가 적긴 했습니다. 이 부분은 플러터가 발전하면 할수록 해결될 문제이긴 하나 현재로써는 조금 부족해 보이는 것이 사실입니다.

플랫폼 특화 기능 적용

이 부부은 아직 해보진 않았지만, iCloud 를 이용한 동기화, 코어데이터 등 해당 플랫폼에 특화된 기능들을 과연 해결 할 수 있을까 하는 생각이 듭니다. Line PAY 앱을 플러터로 적용하려다 실패한 사례를 접했는데요, 이처럼 플러터로 프로젝트를 시작할때는 개발하려고 하는 기능의 지원여부를 분명히 한 다음에 개발을 진행해야 할 것 같습니다.

플러터로 모든 것을 해결 할 수는 없다.

플러터는 플랫폼에 관계 없이 개발을 할 수 있게 해주지만 모든 것을 해결할 수는 없었습니다. 예를 들어 앱을 배포할 때는 결국 안드로이드와 아이폰 각각의 플랫폼 설정에 맞게 추가 작업이 필요했습니다.

4. 마무리

4.1. 플러터, 배워볼 가치가 있을까?

결론부터 말하자면 충분히 가치가 있다고 생각합니다.

플러터를 시작할지 고민하시는 분들도 많을 거라고 생각을 합니다. 저 역시 플러터를 시작하기 전에 이런 고민을 했습니다. 먼저 두 플랫폼을 동시에 대응할 수 있는 부분이 매력적이었고 실제 결과물도 매우 만족스러웠습니다.

플러터에 조금 익숙해지니 무엇보다도 개발이 재미 있었습니다. Dart 라는 언어를 통해서 iOS 와 어떤점이 차이가 나는지 비교해 볼 수 있는 좋은 계기 였고, 핫 리로드를 통한 빠른 개발 역시 한몫 한 것 같습니다. iOS 개발이 레고라면 플러터는 듀플러인 느낌이었습니다.

저는 앞으로도 계속 플러터를 병행하며 프로젝트를 진행할 예정입니다.

4.2. 결론

💡 만약에, 내가 스타트업 CEO 이면 무조건 플러터를 선택할 것 같다.

플러터를 해 본 후 느낀 종합적인 결론입니다. 소수의 인원으로 여러 플랫폼에 빠르게 개발할 수 있는 최적화된 개별 환경이 아닐까 싶습니다.

하지만 앞서 언급한 플러터의 장단점처럼 분명히 그 한계점이 존재하며, 프로젝트가 커지면 커질 수록 성능 그리고 개발자 수급에 대한 문제가 있기 때문에 이 부분도 분명히 고려해야 하지 않을까 생각합니다.

잘못된 내용이나 궁금한 점이 있으시면 댓글로 알려주시면 감사하겠습니다.

참고

• 직구 환율 계산기 iOS
• 직구 환율 계산기 Android
• 네이버 블로그앱 플러터 도입기
• Line PAY 플러터 적용 실패기