설치
이 문서는 flutter 개발환경을 설치하고 간단한 예제를 실행하는 과정을 설명합니다. 다음의 순서대로 진행합니다.
- Flutter SDK 설치
- Android Studio 설치
- Android SDK 설치
- AVD 생성
- Flutter 플러그인 설치
- 예제 프로젝트
이미 일부 환경을 갖추고 계신 분들은 상황에 맞게 필요한 것들을 설치해주세요.
Flutter SDK 설치
Flutter SDK는 releases 페이지에서 직접 다운로드 방법도 있지만 특정 버전을 정하여 사용하는 것을 원치 않는다면 github를 통해 다운받을 수 있습니다.
C:\flutter>git clone https://github.com/flutter/flutter.git sdk -b stable
위와같이 git clone 명령으로 flutter를 받습니다. 이 예제에서는 루트 디렉토리에 flutter 디렉토리를 만들고 그 안에서 sdk 디렉토리로 clone 되도록 명령하여 결과적으로 C:\flutter\sdk에 SDK가 설치되도록 했습니다.
환경변수에 FLUTTER_HOME을 추가합니다.
Path에 %FLUTTER_HOME%\bin을 추가합니다.
설정한 환경변가 적용되도록 새로운 콘솔창을 열어 flutter 명령을 실행합니다. 최초 실행에서는 뭔가를 다운로드 받고 설치가 진행됩니다.
명령이 실행되지 않는다면 환경변수가 제대로 설정되지 않은 것일 수 있습니다. SDK가 설치된 디렉토리 주소를 확인하고 앞의 과정을 진행해주세요.
콘솔 윈도는 남은 설치과정을 진행하면서 설치가 잘 됐는지 검사하는 용도로 계속 사용되므로 닫지 말아 주세요.
flutter doctor를 실행하여 설치 상태를 확인합니다. Android Studio 설치가 필요합니다.
Android Studio 설치
Android Studio를 설치합니다.
설치를 완료하고 flutter doctor를 실행해보면 Android Studio가 설치된 것으로 바뀝니다.
Android SDK 설치
Android Studio 설치 끝에 Android SDK가 없다는 설명이 나옵니다. 설치합니다.
기본 설정으로 설치했습니다.
설치...
Android SDK 설치 완료.
flutter doctor로 확인합니다. 설치상태가 바뀌었지만 license 동의가 필요하다고 합니다.
flutter doctor --android-licenses 명령을 실행하여 동의 여부를 밝힙니다.
동의 후 flutter doctor로 Android SDK 설치를 확인합니다.
AVD 생성
Android Studio의 메뉴 Tools > AVD Manager 에서 AVD(Android Virtual Device)를 설치할 수 있습니다.
AVD는 개발 PC에 가상의 스마트폰을 설치하여 flutter 프로젝트를 PC에서 설치하고 실행하는 용도로 사용됩니다.
이 문서에서는 기본으로 선택되어있는 환경으로 설치를 진행했습니다.
생성...
생성...
Virtual Device 실행 화면.
flutter doctor로 확인하니 모든 설치가 완료되었습니다. 콘솔창을 닫아도 좋습니다.
Flutter 플러그인 설치
Android Studio에서 flutter 플러그인을 설치합니다. 메뉴에서 File > Settings > Plugins 를 선택하여 플러그인을 설치할 수 있습니다.
flutter 플러그인을 설치하면 Dart 플러그인도 설치할 것인지를 묻는데 역시 설치합니다.
예제 프로젝트
Android Studio의 메뉴 File > New > New Flutter Project... 메뉴를 선택하면 flutter 프로젝트를 생성할 수 있습니다.
Flutter Application을 선택하여 만듭니다.
Flutter SDK path는 이 문서 처음에 sdk를 설치한 위치로 설정합니다.
Package name은 Android에서 패키지 이름으로 쓰이고 iOS에서는 번들 ID로 쓰입니다. 앱이 한 번 출시되면 바꿀 수 없으므로 잘 정합니다.
예제 프로젝트가 자동으로 생성됩니다.
Android Studio의 툴바에서 실행한 AVD를 선택하고 Run을 클릭하면 프로그램이 설치되고 실행됩니다.
Flutter는 hot reload를 지원합니다. 개발의 과정 중 대부분의 시간은 코드를 수정하고 결과를 확인하는 것에 사용됩니다. Flutter의 hot reload 기능을 사용하면 매번 프로그램을 재시작 할 필요 없이 변경을 확인할 수 있습니다. Android Studio에서 코드를 수정하고 저장하면 바로 변경사항이 반영되는 것을 확인할 수 있습니다. 텍스트 메세지 같은 단순한 코드를 변경하여 hot reload의 작동을 확인해보세요.