여태까지 안드로이드 컨퍼런스에서 플러터 뽕 실컷 맞아 왔는데, 회사 사람들이 최근 들어 플러터 언급을 자주 한다. 갑자기 너무 궁금하니까 설치해보기로 한다.

Flutter?

플러터, 플루터. 나는 플러터라고 읽혀서 플러터라고 읽는다. Google 에서 만든 앱 개발용 프레임워크이다. 크로스 플랫폼 개발을 위한 언어이기 때문에 한 언어로 Android/iOS 아웃풋을 둘 다 만들 수 있는 것이 매력이다. 그 외에 Flutter 공식 홈페이지 flutter.dev 를 방문하면 ‘Fast Development’ 라던가 ‘Beautiful UIs’ 등의 장점을 강조하고 있다. 참고로 다트의 공식 홈페이지 dart.dev 또한 비슷한 느낌을 준다.


Android Studio 에서 Flutter 시작하기

분명히 나는 안드로이드 스튜디오 플러그인에 Flutter가 있는 걸 보았는데, 공식 홈페이지에 가면 ‘플러터를 시작하려면 여기서 다운받으세요!’ 라고 한다. 그럴 필요 없다.

안드로이드 스튜디오 Configure -> Plugins 또는 프로젝트 내에서 Preferences -> Plugins 를 통해 플러그인 메뉴로 진입한다.



Marketplace에서 Flutter를 검색하여 설치한다. 플러터로 개발하기 위해서는 Dart 다트 언어가 필요한데, 위 방법으로 설치하면 Dart도 자동 설치된다.



설치가 다 되었다면 안드로이드 스튜디오를 재시작한다.



Start 메뉴에 Flutter Project를 생성하는 메뉴가 생긴다.



새 어플리케이션을 선택한다.



플러그인을 통해 설치해서 그런지, 내 컴퓨터에서만 그런지 Flutter SDK path가 제대로 잡혀있지 않았다. Install SDK를 통해 원하는 경로에 SDK를 설치해준다. 의외로 설치 시간이 꽤 걸린다. 체감 상 5분 정도 걸린 것 같다.



/flutter 하위 폴더명이 자동 생성되니 참조할 것. 그리고 습관적으로 프로젝트명을 카멜 케이스로 표기했는데, 그러지 말고 소문자와 밑줄로 이루어진 스네이크 케이스를 쓰라는 경고를 받았다. 프로젝트명은 스네이크 케이스로 표기할 것.



설치가 완료됐다면 새로운 Flutter 프로젝트가 만들어질 것이다.

Add Configuration - 구성 추가하기

당신이 성공한 사람이라면 새 프로젝트를 바로 빌드 & 실행할 수 있을 것이다. 나는 왜인지 디바이스 선택과 Run 버튼이 비활성화 되어있고, Add Configuration... 이라는 야속한 버튼만 덩그러니 활성화되어 있었다.

만약 Add Configuration 버튼이 보인다면 당신도 패배자!



절망적으로 구글링해보니, 이 경우에는 IDE에서 SDK의 위치를 제대로 찾지 못한 것일 수 있다고 한다. Preferences - Languages & Frameworks 에서 Flutter SDK 의 패스가 제대로 들어가 있는지 확인해보니 빈 값으로 되어 있었다. 설치할 때 지정했던 Flutter SDK의 경로를 선택해준다. 버전 정보를 볼 수 있으면 성공. Dart는 Flutter의 하위 디렉토리에 있기 때문에 자동 설정되었다.



그리고 USB로 연결된 & 개발자모드가 실행된 안드로이드 폰에서 앱을 빌드해보니 드디어 성공.



Hello World! 만 나오던 안드로이드 스튜디오 기본 프로젝트보다는 조금 더 세련된 느낌이다.

References

  • https://medium.com/flutterpub/installing-flutter-in-android-studio-ec135911ceea
  • https://stackoverflow.com/questions/48650831/dart-sdk-is-not-configured