Flutter 개발 환경 구축 2 - 터미널과 Android Studio에서 데모 앱 돌려보기

플러터 앱은 터미널과 Android Studio 각각에서 실행할 수 있습니다. 단, 앱을 설치할 Android Emulator와 iOS Simulator 각각이 먼저 실행되고 있어야 합니다. 터미널과 Android Studio에서 안드로이드 에뮬레이터와 iOS 시뮬레이터를 띄운 후 데모 앱을 실행시켜 보겠습니다.

 

TL;DR  플러터 데모 앱을 실행시키기까지 전 과정은 다음 7가지 스텝으로 요약할 수 있습니다.

1. Android Studio 및 SDK 설치

2. Flutter SDK 설치

3. Android Studio SDK와 Flutter SDK 환경변수 설정

4. Flutter Doctor로 빠진 부분이 있는지 체크

5. 플러터 앱 프로젝트 생성

6. (Android와 iOS 가상 디바이스가 없다면 새로 생성 후) 가상 디바이스 실행

7. 터미널 혹은 Android Studio를 통해 플러터 앱 실행

터미널에서 iOS Simulator로 플러터 앱 실행시키기

플러터로 본격적인 개발을 시작하기 전에 데모 앱부터 실행해봅시다. 플러터 공식 개발 가이드를 따라서 다음 스텝으로 진행합니다.

 

1. 터미널에서 iOS 시뮬레이터 실행 open -a Simulator

2. 플러터 데모 앱 생성 flutter create my_app

3. 플러터로 데모 앱 실행 flutter run

 

다음과 같이 쉽게 실행할 수 있습니다!

터미널에서 Android Emulator로 플러터 앱 실행시키기

안드로이드의 경우 에뮬레이터 리스트를 확인해서 에뮬레이터 이름을 얻고 실행시킨 후, iOS와 동일하게 flutter run 명령어를 실행해주면 됩니다. iOS 테스트 시에 생성한 my_app을 그대로 띄워보겠습니다. 실행 순서는 다음과 같습니다.

 

1. 에뮬레이터 리스트 조회  emulator -list-avds

2. 특정 에뮬레이터 실행 emulator -avd 기기명

3. 플러터로 데모 앱 실행 flutter run

터미널에서 Pixel_3a_API_33_arm64-v8a 에뮬레이터 실행

Android Studio에서 플러터 앱 프로젝트 만들기

Flutter와 Dart 플러그인 설치

Android Studio를 실행한 직후에 New Flutter Project 아이콘이 안 보인다면, Android Studio용 플러터와 다트 플러그인 먼저 설치해 줍니다. Plugins에서 flutter를 검색해서 플러그인을 설치하는데 도중에 나오는 Dart 플러그인도 함께 설치합니다.

플러그인 설치 후에는 메뉴에 아래와 같이 New Flutter Project 아이콘과 문구가 보이게 됩니다.

New Flutter Project 클릭 시, Flutter SDK 경로를 확인하고 앱 이름을 설정하면 플러터 앱이 생성됩니다. Platforms에 디폴트로 Android와 iOS가 선택되어 있기 때문에, 별도로 수정할 필요가 없습니다.

Android Studio에서 플러터 앱 실행시키기

플러터 앱 프로젝트 실행 후 iOS Simuator나 Android Emulator가 돌고 있지 않다면 상단 device 선택 메뉴에서 실행시켜주면 됩니다. 먼저 iOS Simulator를 오픈한 뒤 초록색 Run 버튼을 눌러보겠습니다.

Android Emulator도 마찬가지 방법으로 device를 실행시킨다음 Run 버튼을 누르면 잘 동작합니다.

플러터 앱 프로젝트는 기본적으로 설치만 되면 데모 앱이 돌아가도록 구성되어 있기 때문에, 필요한 설치 파일 설치 후 가상 디바이스 설정만 잘 한다면 실제 기기가 없어도 문제없이 실행됩니다.