네이버하면 녹색 검색창이 가장 먼저 떠오른다. 구글하면 텅빈 페이지에 검색창이 덩그러니 놓인게 생각난다. 그럼 배민하면 무엇이 떠오르나? 사람마다 다르겠지만 내 경우는 배민1, 배달, 포장이 써져있는 배민 앱이 먼저 떠오른다.
그럼에도 배민을 서비스하는 우아한형제들 채용 공고를 보면(2022년 11월 기준) 웹 프론트엔드 프로그래머 채용공가 8개나 올라가 있다. 사용자는 앱을 이용하는데 iOS나 Android 다루는 프로그래머 채용보다 프론트엔드 프로그래머 채용이 더 많이 열려있다. 그럼 배민에서 웹 프론트엔드 프로그래머는 무슨 일을 하는데 이렇게 채용이 활발할까?
모바일 퍼스트
무슨 일을 하는지 살펴보기 전에 먼저 그 배경을 살펴보자.
2010년대는 모바일로 뜨거웠다. 2010년 카카오톡이 iOS 어플리케이션으로 출시되었고 얼마 지나지 않아 통신사의 문자 메시지는 유명무실해졌다. 요즘은 국가에서 보내는 알림 메시지를 카카오톡 알림톡으로 수신하지 않나. 그리고 2012년에는 전국민이 for kakao 게임에 푹 빠져 지냈다. 밤 늦은 시간에도 애니팡 하트를 전해주는 메시지가 왔고, 공공장소에서 모바일 게임하는 모습 보는게 흔해졌다.
이런 흐름은 배달, 숙박, 모빌리티, 이커머스, 신선식품 등 다양한 분야로 이어졌다. 덕분에 공인인증서와 각종 보안 프로그램 까느라 전국민을 시험에 들게하는 연말정산도 모바일 어플리케이션으로 처리하는 시대가 되었다. 다시 말해 누구나 어떤 서비스를 떠올릴 때 데스크탑으로 웹 사이트를 방문하는게 아니라 모바일 어플리케이션이나 모바일 웹 서비스를 먼저 찾는다. 어떤 비지니스라도 모바일 어플리케이션을 끼고 돌아간다.
모바일 애플리케이션은 어떻게 사용자의 휴대전화까지 도달하나?
이렇게 비지니스에 중요한 모바일 어플리케이션은 어떻게 만들어질까? IT서비스 회사를 기준으로 설명해보겠다.
- 기능을 정의한다.
- 화면을 디자인한다.
- 코드로 기능을 구현한다.
- 출시 전에 기능 테스트를 한다.
- 각 스토어에 어플리케이션을 등록한 뒤 리뷰를 요청한다.
- 각 스토어의 리뷰를 거친다.
- 점진적 배포를 통해 늦은 밤 사용자 휴대전화에 자동 업데이트 되거나 사용자가 직접 업데이트를 눌러서 다운받는다.
기능를 제작하고 테스트하는 단계까지는 각 회사가 알아서 하겠지만 스토어의 리뷰를 거치는 단계는 아무리 시간 앞당기려고 해도 어느정도 시간이 필요하다. 초기 애플 앱스토어(Apple App Store)는 리뷰만 1주일씩 걸렸다. 여기서 문제가 발생한다.
아무리 기능 테스트를 열심히해도 결국 사람이 하는 일이보니 가끔 오류를 포함한 어플리케이션이 사용자에게 배포된다. 그럼 긴급히 수정해서 배포해도 꽤 시간이 걸린다. 각 스토어에 긴급 심사를 요청할 수 있지만 이것도 매번 가능한게 아니다.
이 외에 한가지 문제가 더 있다. 사용자가 사용하는 앱 버전별로 기능이 조금씩 다른데 이를 맞추는데 많은 자원(시간, 인력)이 들어간다. 자신은 항상 최신화해서 모바일 어플리케이션을 쓴다고 생각하겠지만 생각보다 많은 사용자들은 과거 버전 어플리케이션을 쓴다.
웹뷰를 이용하자
iOS, Android 운영체제 모두 웹 컨텐츠를 그려서 보여줄 수 있는 웹 렌더링 엔진인 웹뷰를 가지고 있다. 어느 순간부터인지 모르겠지만 모바일 어플리케이션들은 주요한 페이지를 제외하고 많은 부분 웹뷰를 이용해서 사용자에게 웹 페이지를 통해 제공한다.
예를 들어 토스를 떠올려보면 초기에는 송금 서비스 정도 있었지만 지금은 다양한 서비스를 토스 모바일 어플리케이션에서 제공한다. 이 중 다수는 웹뷰를 통해 서비스가 제공된다.
위 화면은 안드로이드에서 토스의 홈을 확인한 모습이다. 모바일 어플리케이션 코드를 이용해서 만든 경우 화면처럼 각 영역에 들어간 여백 등이 모두 확인된다.
그런데 주식 탭을 확인해보면 상하단 네비게이션 영역을 제외하고는 앞서본 표시가 전혀 없다. 이런 부분이 웹뷰를 통해 웹 페이지를 렌더링해서 사용자에게 노출되는 지면이다.
비바리퍼블리카에서 재직중이던 분이 2018년 게제한 구인 공고를 살펴보면 더욱 명확하다.
먼저, *토스 앱 내 많은 페이지가 웹뷰로 구현되어 있습니다*. 네이티브 앱은 높은 성능과 유려한 UX를 제공하지만, 상대적으로 배포가 자유롭지 않고 업데이트 비용이 높습니다. 저희는 가설을 세우고 그 가설을 검증하는 실험을 통해 얻은 배움을 제품에 반영하는 식으로 일합니다. 초기 제품일수록 이 주기를 빠르게 가져갈 필요성이 생기는데, 그 경우 웹이 좋은 선택지인 경우가 많습니다. — 출처: https://ahnheejong.name/articles/looking-for-ui-developer/
이렇게하면 모바일 어플리케이션 코드로 작성된 지면보다 사용자가 화면에 진입하는 시간이 오래걸리는 단점이 있지만 앞서 말한 단점 2가지를 모두 해결할 수 있다.
- 웹 페이지 배포는 스토어 리뷰가 필요없으니 원하는 시점에 배포할 수 있다. 긴급한 문제가 발생해도 빠르게 대응가능하다.
- 사용자의 어플리케이션 버전이 달라도 웹뷰로 보여주는 페이지의 경우 비슷한 경험을 제공할 수 있다.
웹 프론트엔드 프로그래머가 하는 일
이렇게 사용자가 사용하는 모바일 어플리케이션의 일부분을 웹 페이지로 제공하기 때문에 각 회사에서 웹 프론트엔드 프로그래머는 웹 어플리케이션을 만드는 일에 투입된다.
배민앱 안에서 구동하는 배민선물하기의 경우도 이렇게 만들어져서 사용자에게 제공한다. 이외에도 배민 내 다수 지면이 웹 어플리케이션이다.
이 외에도 서비스 회사마다 많은 대내외 운영 도구가 웹 어플리케이션으로 제공된다. 예를들어 외식업 사장님은 가게의 메뉴 등록, 쿠폰 발행, 리뷰 댓글 관리 등 다양한 일을 처리하면서 사용자에게 음식을 제공한다. 많은 일을 배민사장님 모바일 어플리케이션으로 직접 할 수 있지만 어떤 일은 데스크탑 웹 페이지를 통해서 처리하기도 해야한다.
다른 예로 소셜미디어에 광고를 게시한다고 생각해보자. A 업체에서 광고를 등록한다고 바로 게시되지 않는다. 해당 소셜미디어 업체에서 광고를 접수하고 광고 컨텐츠 내에 문제가 될만한 소재는 없는지 확인하는 과정을 거친다. 그러면 소셜미디어 직원이 등록된 광고를 확인하고 처리하는 프로그램도 필요하다. 이렇게 회사 내부에서 서비스 운영을 위해 사용하는 많은 부분이 웹 어플리케이션으로 제공된다. 일반 사용자에게는 노출되지 않는 이런 프로그램을 만드는 일도 웹 프론트엔드 프로그래머가 한다.
배민선물하기팀 프론트엔드 프로그래머 채용 공고를 살펴보면 이런 내용이 잘 나타난다.
[업무내용]
-배달의민족 선물하기 서비스의 프론트엔드 개발하고 운영합니다.
-선물하기 서비스 운영에 필요한 어드민 프론트엔드를 개발하고 운영합니다.
-모바일 디바이스 웹 환경을 고려해서 개발합니다.
-Internal API를 연동해서 서비스를 제공합니다.
맺음말
모바일 어플리케이션으로 주된 사업을 하는 회사에서 웹 프론트엔드 프로그래머가 무슨 일을 하는지 간단히 알아봤다. 누군가에게는 미래의 자신이 하게될 일이 어떤건지 이해하는데 조금의 도움이 되길 바란다. 그리고 취업이나 이직을 준비할 때 배민선물하기팀이 한번이라도 생각나길 바란다.
(글 작성자가 직접 추가한 광고)
아래 내용은 제 강의를 수강하고 있는 분이 남겨준 리뷰의 일부입니다. 일부러 이렇게 만든 강의인데 의도를 정확히 파악한 리뷰라서 많이 놀랐습니다.
스스로 탐색해가면서 학습하고 피드백을 통해 점검하고 싶다면 제 강의가 좋은 선택이 될거라고 생각합니다.
할인된 금액으로 시작해보세요(강의 작성 후기).
60,000원 할인 쿠폰코드: 7363–773b123e2aca
2022년 11월 30일까지 유효하며, 선착순 100명에게만 유효합니다.
