#0. Background

Looi는 기록 비서 서비스이기에 보다 사용자들이 편리하게 접근할 수 있는 ‘앱’을 만드는 것이 목표였다. 후에 위젯, 푸시, 단축어 등의 기능을 추가하여 사용성을 높여보는 것도 계획되어 있었다.

초기에는 프론트엔드 개발은 혼자 맡아서 진행해야 했기에, Flutter나 React native를 이용한 하이브리드 앱으로 진행하고자 하였다. 하지만, 우리는 프로젝트 특성 상 기획이 무지막지하게 자주 (사실 일주일 안에도 여러번…ㅎ) 바뀌므로 매번 앱 배포를 할 수는 없었다.

여기에 더해서 UMC 해커톤에서 react native로 개발을 진행했던 적이 있었는데, 안드 에뮬레이터에서는 멀쩡하던 게 iOS 에뮬레이터에서는 오류를 내뿜고… 화면도 틀어지고 온갖 사소한 문제에 직면하는 게 정말 스트레스였던 경험이 있다.

그래서 결국 우리는 고전적인 방법이자 우리 회사에서 사용하던 방법인 **‘네이티브 앱에 웹뷰로 프론트를 띄우는 방식’**을 채택했다.

✅ 기획의 잦은 변화는 프론트 배포로 간편하게 해결

✅ 앱 배포는 초반 세팅 한 번만!

✅ 네이티브 앱이므로 후에 위젯, 푸시, 단축어 등의 기능 도입 가능

+) 나는 안드로이드 네이티브 앱 경험도 있고, 회사 코드를 통해 iOS 웹뷰 코드를 본 적도 있으니 (비록 Objective-C였지만 ㅎㅎ…) 연결도 어렵지 않을 것이라 판단했다.

#1. Android 웹뷰 세팅하기

대충 프로젝트 하나 만들고, 메인 액티비티에는 웹뷰만 하나 덜렁 넣었다.

*<!-- layout/activity_main.xml -->*
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="<http://schemas.android.com/apk/res/android>"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
<WebView
    android:id="@+id/webView"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

그 다음, 기본적인 웹뷰 세팅을 하고 실행해 보면 된다.