brunch

You can make anything
by writing

C.S.Lewis

by charian Nov 21. 2018

디자이너의 네이티브 앱 개발 도전기 #1

디자이너. 네이티브 앱 개발 도전기

오래도록 염원하던 일이다.

내가 앱을 만드는 일.


오래도록 상상하던 앱이 있었다.

두어 가지 정도 되는데 마침 관련 기술이 더욱 쉽게 사용할 수 있도록 발전되어 이제야 도전하게 되었다.

마침, 내가 사랑해 마지않는 니꼴라스 선생께서 관련 내용을 강의를 내어주셨다.

지체할 필요 없었다.

(최초의 생각으로부터 4년이 지났다. 최초에 생각하던 대부분의 기능은 이미 시장에 출시되었다.)


오래도록 꿈꾸던 일이고, 나를 보다 더 풍성하게 할 일이다.

지식으로 보나, 경험으로 보나, 주머니 사정으로 보나 말이다.

필요한 건 근성과 시간일 뿐이다.


목표는 18년 말일이다.

18년 12월 31일에 앱을 완성하여 스토어에 검수를 올리기까지가 1차 목표다.

물론 1차 목표 내에 수많은 작은 목표들이 존재할 것이다.


지금의 글은 나를 좀 더 다독여 중간에 포기하지 않게 하기 위함이다.

이미 앱 개발은 2주 전에 시작하였다.

즉, 2달간의 프로젝트 진행 기간을 산정한 것이다.

이는 해당 앱의 기획과 디자인은 이미 머릿속에 대부분 그려져 있기에 가능한 것이다.


경력사항으로 말할 것 같으면, 브런치의 다른 게시물을 읽어보신 분이나 제목을 보아 유추할 수 있듯 나는 디자이너 출신이다.

광고회사 출신으로 웹 에이전시를 거쳐 솔루션 회사까지 직장생활을 지내왔다. 총 9년이다.

마지막 솔루션 회사에서 7년 동안 HTML과 CSS 그리고 UX/UI와 기획력을 연마하였다.

언급한 기간 중 많은 기간 동안 개발자와 코웍을 하였고 Javascript에 대한 토막 지식은 갖고 있는 상태이다.

게시판 정도는 어떠한 개념으로 설계되어 만들어지는지 알고 있는 수준이고, 대형 개발 프로젝트를 진행하는데 개발자와 커뮤니케이션 하여 타협하는데 큰 지장이 없을 수준의 지식은 있다.


내가 갖고 있지 않는 스킬은 개발에 대한 모든 것이다.

if와 for를 활용한 기본 기능 구현은 하질 못한다. 하지만 어떤 원리로 설계되는지는 알고 있다.

DB에 쿼리를 넣어 값을 불러와 화면에 뿌려지는 것은 개념은 알지만 구현하질 못한다.

node나 npm 등은 무수히 들어봤으나 설명하라면 하질 못한다.

xml과 json이 데이터를 관리하는 개념까진 알고 있으나 차이점이나 장단점을 서술하지 못한다.


하지만 많은 노하우를 활용하여 웹 표준에 근거한 HTML, CSS코딩은 꽤 빠르고 능숙하게 진행할 수 있고, 내가 원하는 수준의 레이아웃은 디자인 해 낼 수 있다.


사실 이 정도 지식으로는 네이티브 앱 제작을 시도할 수 없다.

개발에 대한 지식이 너무 부족하기 때문이다.

개발 학원 3개월 다닌 사람보다 알고 있는 것이 더욱 적다.

그럼에도 불구하고 도전하고 싶었다.


언젠가 내가 만들고 싶어 하던 날씨 앱의 샘플 코드가 스위프트 버전으로 인터넷에서 볼 수 있다는 걸 알게 되었다. 친절하게 유튜브로 강의까지 진행되는 것을 알게 되었다.

어라? 해볼 수 있겠는데?


마음을 먹고 현재까지 3주가 지났다.

다음 글부터 현재로부터 진행되는 과정을 적어 나갈 것이므로 어디까지 진행되었는지 대략 적어놓고 글을 마치는 것이 좋을 것 같다.


일단 스위프트가 아닌 React Native를 이용해 네이티브 앱을 제작하고 있다.

스위프트보다 훨씬 더 많은 정보가 React Native진영에서 공유되고 있다.

컴포넌트가 풍부하고 노하우가 많이 공유되고 있으며 iOS와 Android를 동시에 대응할 수 있다.

무엇보다 HTML과 CSS의 지식이 꽤 쓸모 있게 작용될 수 있으며 상대적으로 경험을 많이 해본 Javascript를 기반으로 한다는 것이 스위프트보다 React Native를 선택한 결정적 이유다.


https://academy.nomadcoders.co/courses/enrolled/216885

강의는 대략 3번을 돌려보았고 대략 #5 전까지 개발 진행되었다.


내가 원하는 수준의 앱과는 차이가 있으므로, 강의에서 사용한 OpenWeathermap 이 아니라 AccuWeather로 날씨 API를 변경하였다.

API 사용하는 방식은 같지만 Current Location을 가져오는 방법이 조금 더 복잡하므로 거기에서 2~3일 머리 썩어가며 진행하였다.

그리고 미세먼지 데이터를 연동하기 위해 openapi.airkorea의 API를 사용하였다.

해외와는 다른 위치 값을 요구하여 삽질을 이틀 동안 하여 성공하였다.


그리고 자잘하게 React Native에서 Modal를 띄우는 데 성공하였고 fontFamily를 적용하여보았다.


어제는 slide menu by hamburger 기능을 사용하기 위해 관련 컴포넌트를 설치하다가 프로젝트의 패키지들이 엉망으로 꼬여 하루의 모든 시간을 디버깅하는 데 사용하였다.

관련 에러 메시지를 구글링 하여 결국 원래대로 돌려놓는 데 성공하였다.


언젠가 개발 진행 중인 앱의 프로토타입을 공유하면 이러한 설명들이 꽤 쉽게 다가갈 수 있지 않을까.

보안이라면 보안일 수 있는, 허접한 디자인을 공유하는 것이 쉽진 않은 일이기도 하다.

앞으로 이런 일기 형식의 글을 아주아주 자주 작성할 계획이다.


정보 공유 차원이기도 하지만, 이번 앱 제작을 진행하며 한국의 대기질 관련 데이터가 꽤 느슨하다는 것을 알게 되었다.

이런 내용들은 꼭 공유하고 싶다.

그리고 나를 채찍질하고 싶기도 하고.



브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari