Flutter vs. React Native

About Flutter and React Native

Flutter와 React Native는 현재 mobile에서 가장 많이 사용되는 cross platform 입니다.

	Flutter	Reactive Native
initial release	2017	2015
backed by	Google	Facebook
language	Dart	JavaScript
performance	close to native	fairly robust
open source	Y	Y
UI	proprietary customized widgets	native components
Documentation	extensive	extensive
community & support	limited, fast growing	extensive
60+fps support	Y	requires workarounds
code reusability	up to 90%	up to 90%
JIT, AOT compilation	Y	N
used by	Google, Tencent, Alibaba	Facebook, Uber

Flutter

  Flutter는 web, desktop, mobile 등 여러 platform에 걸쳐 한번의 개발로 cover 가능한 cross platform을 위한 UI toolkit 입니다. 위 table에서 살펴 볼 수 있듯이 2017년 Google에서 만들었으며 Dart라는 programming language로 개발되어 있습니다. 

 

Flutter 설치

Flutter의 설치는 다음의 site를 방문하여 자신의 환경에 맞는 executable을 download 합니다.

https://docs.flutter.dev/get-started/install

Install

Windows의 경우 아래 flutter_windows_2.8.1-stable.zip을 download 합니다.

설치한 path를 환경 변수에 추가합니다. 

 

Flutter docker 실행

 

Run Flutter docker

~> flutter doctor

 

환경을 검사합니다. 이후 설치가 필요한 software에 대해서 알려줍니다. 

ex.

[-] Android toolchain - develop for Android devices
    • Android SDK at D:\Android\sdk
    ✗ Android SDK is missing command line tools; download from https://goo.gl/XxQghQ
    • Try re-installing or updating your Android SDK,
      visit https://docs.flutter.dev/setup/#android-setup for detailed instructions.

 

Android 설정

  Flutter는 Android 상에서 구동됩니다. 또한 Flutter는 Android에 의존적인 부분이 있습니다. 즉, Android Studio를 설치해야 합니다. 설치 이후 Android API level 16 이상을 지원(Android 4.1)하는 device가 필요합니다. 

 

Android Studio를 설치한 후, Android device를 개발자 모드로 설정합니다. 

Android Studio에서 AVD Manager를 실행한 후, virtual device를 생성합니다. 

(본 blog의 Android Studio 설치 글 참고)

 

 

Android License

Java 8이 install 되어 있어야 합니다. JAVA_HOME 환경 변수가 Java SDK에 대해 가리키고 있어야 합니다. 

 

이후 console window에서 다음과 같이 입력합니다.

$ flutter doctor --android-licenses

 

Flutter와 Dart plugin 설치

Android Studio에서 Preferences -> Plugins

이후 Marketplace 선택 후 Flutter plugin을 선택하고 설치