비전공자 Kotlin, Flutter 로 플레이스토어, 앱스토어 앱 승인 (android, ios 개발)

"must" 라는 이름으로 이전에 플레이스토어 앱 승인을 받았는데,

이번에는 ios 앱스토어 출시 기념으로 이어서 리뷰를 써보고자 한다.

비전공자가 Chat GPT 사용해서 앱 개발 했습니다. (할 일 관리 앱 must)

---

 

Flutter를 사용해 새로 개발한 "must" ios 버전

‎Must

---

플레이스토어 출시 이후 목표는 ios 개발

 별안간 Kotlin를 독학하기로 마음먹고 플레이스토어에 앱 출시한 이후, 내가 만든 앱이 다른 사람들의 스마트폰에 들어가는 게 참 신기했다. 잘 쓰고 있다는 리뷰가 달리면, 퇴근하고 몇 개월 동안 개발하면서 고생했던 시간을 보상받는 느낌이 들기도 한다.

사실 나도 앱을 다운로드하고 리뷰를 잘 작성하진 않는데, 이번에 개발자 처지에서 앱을 출시하고 보니 리뷰가 대단히 큰 힘이 되는 것을 느꼈다.

플레이스토어 총 설치 추이

 

 이와 별개로 하나 더 느낀 것이 있는데, 생각보다 주변 지인들이 아이폰을 많이 쓰고 있다는 것을 알았다. 그러다 보니 ios 버전도 출시해달라는 요청이 꽤 많았다. 원래는 어떤 스토어던 일단 앱을 처음부터 끝까지 독학해서 개발해보고 출시하는 것이 목표였는데, 많은 요청과 더불어 Flutter라는 프레임워크를 사용해보고 싶기도 해서 ios 출시도 후속 목표가 되었다.

---

Why Flutter?

 

 ios 앱 개발을 하려면 어떤 언어를 선택해야 하는지 알아보니 네이티브로는 Swift를 선택하고, 빠른 크로스 플랫폼 출시가 목적이면 Flutter를 선택하는 것을 알게 되었다.

ios에 대한 깊은 이해까지는 필요가 없었고, Mac이 없기도 했고, Dart 언어가 배우기 쉽고 빠르게 개발할 수 있다는 장점이 있어 Flutter를 선택했다. (ios 앱 빌드를 하려면 Mac이 필수인 것을 이때는 몰랐다...8ㅅ8)

 

 Flutter를 선택하는 기업이나 개발자는 많은 이유가 있겠지만 역시 뭐니뭐니해도 android와 ios 동시 개발이 가능하다는 점이 가장 큰 장점이 아닐까 싶다. 네이티브에 비해 업데이트 대응 속도가 느릴 수 있거나 하는 다양한 단점이 있지만, 개발 능력이 된다면 충분히 극복 가능한 수준이고, 또한 크로스 플랫폼 대응이 된다는 것 장점 하나가 매우 크게 작용하는 것 같다. 구글링을 해보면 실제로 네이버의 경우 네이버 블로그나 지식 IN의 앱 일부를 Flutter로 전환 개발하고 있다고 한다. 현재도 꾸준히 Flutter 유저와 수요가 상승추세라고 한다.

---

Kotlin ≠ Flutter // 이 점이 달랐다

 

 Kotiln과 Flutter를 둘 다 찍어 먹어보니, 가장 달랐던 부분은 ui를 구현하는 방식이다. android는 Layout을 XML에 작성해서 Code로 불러오는데, Flutter는 Widget Tree로 작성해서 구현한다.

좌(android) - 우(Flutter) widget 구현 예시 ./ 출처 : android 및 Flutter 공식 문서

 

 

 처음에는 Widget Tree로 ui를 구현하는 게 매우 다른 방식으로 다가와, 익숙하지 않았는데 작성하다 보니 오히려 왠지 모를 편리함이 느껴졌다. 처음 보기에만 어렵고 눈에 익히니 위젯 구조가 눈에 들어왔다. Widget이 순차적인 Code 형태로 한 눈에 보이니 Widget이 많아질수록 Kotlin은 기능 구현에 복잡함을 느꼈는데, Flutter는 Widget이 많아져도 머리가 복잡하지 않았다.

그러다가 신나게 Column이나 Row Widget을 작성하면서 가독성을 신경 쓰지 않고 무턱대고 Intent를 남발하게 되면 아래처럼 아도겐 코드가 되기도 했다...

아도겐 코드

---

개발한 앱의 모습

 이미 한 번 맨땅에 헤딩하듯이 만들었던 경험이 있기 때문에, 미약하지만 이번에는 이곳저곳 개선을 해보려고 시도했다. 어차피 디자인이나 기능은 이미 있는 걸 Flutter로 따라 하기만 된다고 생각했다. 물론 생각과 달리 구현이 어려운 것도 생겼다. 특히, xml과 같이 부드럽고 원하는 방향으로 애니메이션을 구현하는 것이 어려웠다.

 어쨌거나 새로 처음부터 개발하는 김에 신경을 쓴 부분은, 사용자가 원하는 색상으로 일정 매트릭스 커스텀이 가능하도록 만들고 싶었고 아래와 같이 구현했다.

왼쪽(기본 테마) / 중앙(커스텀 색 적용) / 오른쪽( 커스텀 색상 피커)

 

 아이젠하워 매트릭스가 익숙한 사람은 기본 색상으로 사용해도 크게 구별에 문제가 없지만, 사용자가 원하는 색상을 사용하면 한 눈에 매트릭스별 일정이 눈에 들어와서 좋은 것 같다. 기분이나 취향에 따라 변경하는 재미도 생겼다.

 

 일정을 추가할 때 ui도 전체적으로 바꿨다. 이전에는 버튼이나 공백이 일정하지 않은 느낌이라면, Flutter로 개발하면서 여백, 텍스트나 기능을 가진 버튼, 스위치등이 통일감을 가지도록 했다. 똑같이 Bottom Sheet로 구현했지만, 화면을 끝까지 키워서 시원시원하지만 알차게 Widget을 배치해봤다.

 

---

힘들었던 점

 역시나 Kotlin으로 개발하면서 발목을 잡았던 Home Widget 구현이 가장 힘들었다. 일정 관리 앱이라 아무래도 HomeWidget 수요가 높아서 꼭 구현을 해야 했는데, Home Widget은 네이티브에서 개발을 해야만 했다. 결정적으로 이때 Mac이 필요해진 것을 알았다...ㅎㅎ

 

 여태껏 취미로 앱 개발을 하면서 안드로이드 개발자 계정 등록에만 돈을 써봤는데, 더는 버티지 못하고 Mac을 지를 수밖에 없었다. 더 알아보니 어차피 ios 앱 빌드나 앱스토어에 출시하려면 Mac이 필수임을 알게 되었다.  Home Widget을 Flutter 앱에서 구현하려면 어떤 라이브러리가 필요한지 구글링 중, home_widget이라는 라이브러리가 android와 ios 모두 구현 가능하다는 것을 알게되었다.

 

// Flutter home_widget package

home_widget example | Flutter package

 

 라이브러리도 정했,고 Mac도 사서 Xcode도 깔았겠다 열심히 구현하려는데, Swift로 Widget을 구현해야 했기 때문에 또 열심히 유튜브에서 인도선생님이나, 블로그, 공식문서들을 돌아다녔다. 또 처음에는 앱과 데이터 공유가 안 되더니, 툭하면 앱 데이터가 위젯으로 전달되지 않거나 갑자기 연결이 끊기거나 하는 등의 문제가 있어서 또 며칠 밤을 새웠다.

 

 그래도 결국에는 아래처럼 잘 구현했다. 남은 할 일 숫자도 실시간으로 반영되고, 앱에서 할 일을 완료 처리하면, Home Widget도 같이 잘 바뀐다. 

Flutter ios 홈 위젯

 

그리고 역시 많은 블로그를 망령처럼 돌아다녔지만, 특히 아래 블로거님 글이 많은 도움이 되었다. 

[플러터 위젯] iOS widget에서 버튼 사용하기

 

 

그리고 아직 한 가지 해결하지 못한 과제가 있는데, 내 앱은 ReorderableListView 가 총 4개의 matrix로 이루어져 있는데, 각각의 ReorderableListView 안의 일정을 순서도 바꿀 수 있도록 하면서 동시에 두 개의 다른 ReorderableListView 끼리 아이템을 Drag & Drop으로 옮기는 기능은 계속 에러를 뱉어서, 끝내 구현하지 못했다.

 

 칸덴보드 코드도 참고하면서 열심히 머리를 굴려봤는데 각 리스트 순서를 바꿀 수 있게 하면서 리스트 간 이동까지 동시에 만족하는 방법은 아직 찾지 못했다 8ㅅ8...

슬프지만 현재는 일정 수정 화면에서 Tabbar 로 고를 수 있도록 하고, 각각의 리스트뷰에서는 순서를 바꿀 수 있도록 구현했다.

matrix 간 일정 이동 Tabbar

 

 마지막으로 역시 앱스토어에 앱을 제출을 준비하는 과정에서, Automatically manage signing 부분이 나를 힘들게 했다. 계속 프로비저닝, 디바이스 관련 에러가 떠서 Signing이 되지 않았고 이 때문에 며칠이 흘렀다. 역시 무한 구글링을 하며 StackoverFlow를 많이 참고했는데, 해결되지 않았고 결국에는 서랍에 묵혀있었던 아이폰7을 애플 개발자 계정에 등록하니 에러가 뜨지 않고 바로 해결되었다(...)

이 에러는 아니었다... 예시 사진임.

 

 이후 한 가지 웃긴 건 플레이스토어 앱 런치를 한 번 해봤다고, 나름 연관되는 부분이 있어서 유튜브나 블로그 글을 따라가면서 출시 과정을 준비하는 게 크게 어렵지는 않았다. 태블릿 전용 예시 이미지를 준비하지 않았다고 딱 한 번 리젝 당하고, 태블릿 사진 추가하니 이후 바로 승인되었다!! (감격의 눈물 8ㅅ8)

결국 앱스토어 출시 완료

---

앞으로도...

 취미로 계속 앱을 개발하려고 한다. 아직은 딱히 영리활동을 하는 것도 없지만, 앱을 구상하고 개발하고... 많은 문제를 해결하면서 결국 출시 승인을 받았을 때 재미를 느낀다. (리뷰는 덤)

 결국에는 내가 쓰고 싶은 앱을 만들고 나도 잘 쓰면 좋고 다른 사람도 나처럼 잘 써주면, 이런 것이 좋은 영향력이 아닐까 싶다.