[플러터 강좌] 플러터(Flutter) 시작하기 - 설치 하기

이 글을 읽고 계신 분이라면 아마도 1) 앱 개발을 하고 있는데 플러터터를 사용해 볼까 고민중인 분  2) 앱 개발에 관심을 갖고 있는 타 분야 개발자, 이도 아니면 3) 개인 아이디어를 가지고 앱을 만들어보고 싶지만 도무지 엄두가 나지 않고, 프로그래밍에는 관심이 있지만 안드로이드와 아이폰 양쪽을 다 공부하는것은 생각만 해도 너무 버거워하던 중 크로스 플랫폼이라는 것에 대해서 알게 되고, 자마린(Xamarin), 아이오닉(Ionic), 리액트 네이티브(React Native) 등에 대해서 조사하다가 구글이 만든 플러터(Flutter)라는 것이 괜찮다는 이야기를 듣고 검색 끝에 이 글을 발견하신게 아닐지. 그렇다면 잘 오셨습니다. 플러터를 이용하여 앱을 개발하고 안드로이드와 iOS에 론칭하면서 쌓은 노하우를 공유하기 위해서 시리즈를 시작하려던 참이었기에..

저 또한 앱 개발 경험이 전무한 상태에서, 만들어보고싶은 앱이 생겼고 조사를 시작했지만, 안전한 옵션인 리액트 네이티브를 두고 플러터를 선택하는게 정말 잘하는 짓일지 확신이 서지 않았습니다. 하지만 길다면 길고 짧다면 짧은 기간동안 양쪽 플랫폼에 앱을 론칭해보고, 성능에 민감한 부분이나 비동기 처리부분 그리고 인앱구매나 광고 등의 부가 기능들을 개발하는 과정에서 알게된 것들을 공유하고 한편으로는 수박 겉 핥기로 넘어갔던 부분들도 다시 한번 되짚어 보기 위해 시리즈 물이 될 수도, 단편적인 글이 될 수도 있는 글을 일단 시작합니다! :)

https://flutter.dev/

Flutter - Beautiful native apps in record time

플러터 설치하기

플러터는 문서화가 매우 잘 되어 있습니다. 플러터 공식 설치 페이지를 꼼꼼하게 따라하기만 해도 아주 쉽게 에뮬레이터에 앱을 하나 띄울 수 있습니다. 가능하시다면 공식 문서를 보고 설치하시기를 강력하게 추천 드립니다. 물론 저의 글을 보고 따라하시다가 공식 문서를 참조하시는 방식으로 하셔도 무방합니다. 플러터는 윈도우와 맥 모두 훌륭하게 지원합니다. 저는 맥을 사용하기 때문에 맥 기준으로 설명드리도록 하겠습니다. 천리길도 한걸음부터라는 말에서 한걸음은 개발환경 설정을 의미하죠. 첫 걸음을 내딛어 봅시다.

현재 플러터의 stable 버전은 1.12.13+hotfix5 입니다. 지금은 자세한 내용은 아실 필요 없고, 일단 설치를 합니다. 설치하는 방식은 두가지가 있는데, 첫번째는 릴리즈 파일을 직접 다운로드 받아서 설치하는 방법입니다. 설치하는 과정은 따로 없고, 그냥 압축 파일을 풀고, 그 경로를 환경값에 추가하면 됩니다.

cd ~/development
wget https://storage.googleapis.com/flutter_infra/releases/stable/macos/flutter_macos_v1.12.13+hotfix.5-stable.zip
unzip flutter_macos_v1.12.13+hotfix.5-stable.zip
export PATH="$PATH:`pwd`/flutter/bin"

장기적으로 추천하는 방법은, git repository를 clone 하는 방식인데, 결과적으로 큰 차이는 없으니 지금은 복잡하게 고민하기보다는 그냥 다운로드 받아서 설치하시길.

안드로이드 환경 설치하기

플러터 설치를 완료 하셨다면, 안드로이드 개발 환경을 설치합니다. 향후 어느 플랫폼에 론칭할지와는 별도로, 처음 시작할때는 안드로이드 환경으로 시작하시기를 강력 추천합니다. 그 이유는:

1. 안드로이드 환경이 개발 하기가 훨씬 편리합니다. 에뮬레이터도 더 쉽게 구동이 가능하고, 다양하게 제공되며 제약사항이 훨씬 적기 때문에 iPhone 에뮬레이터에서 개발하는 것보다 시간이 훨씬 절약됩니다.
2. 플러터도 iOS보다 안드로이드 개발 환경을 더 잘 지원합니다. 빌드 속도도 빠르고, 에뮬레이터 실행하는 속도나 로깅이나 모든 면에서 안드로이드 플랫폼을 활용하는것이 편리합니다. 문제가 발생하였을 때 iOS쪽 보다 안드로이드 쪽이 먼저 해결되는 경우가 많습니다.
3. 앱을 배포하기 위해 드는 시간, 노력, 비용, 절차 모든것이 안드로이드쪽을 활용할 경우 월등히 적게 듭니다.
4. 당연한 이야기지만 플러터는 크로스플랫폼이므로 안드로이드 환경으로 개발해도 iOS에서 대체로 잘 동작합니다. 물론 iOS에서 구동하기 위해서 초기에 많은 시행착오를 거칠 수 있고, 어차피 시행착오 거칠거라면 iOS 플랫폼에서 시작하는게 낫지 않나 생각할 수 있습니다. 하지만 그 절차가 너무 번거롭기 때문에 결과적으로 시간을 많이 낭비하게 됩니다.

위와 같은 이유로 안드로이드 개발 환경에서 개발을 시작하기를 추천하며, iOS 개발환경 설정에 시간을 쏟지 마시고 나중으로 미루시길. 안드로이드 개발 환경은 안드로이드 스튜디오(Android Studio)를 설치하는것 하나로 끝입니다.

https://developer.android.com/studio

Download Android Studio and SDK tools  |  Android Developers

안드로이드 스튜디오를 설치하시고 나면, flutter doctor 커맨드를 입력해서 문제가 없는지 확인합니다. 이때 iOS관련 에러 메시지는 일단 무시하셔도 됩니다.

Flutter doctor가 "Android Studio" 에 문제가 있다고 보여줄텐데, 이는 정상입니다.

✗ Android license status unknown.

이 에러를 해결하기 위해서는 flutter doctor --android-licenses 명령을 입력하면 됩니다. 만약 해결이 되지 않는다면, 임의로 안드로이드 프로젝트를 생성하셔야 합니다. 안드로이드 스튜디오를 실행하시고, 아무 설정이나 골라서 새로운 프로젝트를 만드세요. 그 과정에서 라이센스 수락 여부를 묻는데, 이에 답변하고 나서 flutter doctor 를 다시 수행해 보시면 이 에러 메시지가 사라져 있을겁니다.

✗ Flutter plugin not installed; this adds Flutter specific functionality.

✗ Dart plugin not installed; this adds Dart specific functionality.

위의 두 메시지는, 안드로이드 스투디오를 이용해서 플러터 개발을 하시려는 분들 외에는 무시하셔도 됩니다. 저는 개발환경 통일을 위해서  비주얼스튜디오 코드(VS Code)를 이용하고 있는데, 나쁘지 않습니다. 단 VS Code로는 네이티브단까지는 디버깅이 되지 않기 때문에 네이티브까지 만지실 분들은 안드로이드 스튜디오를 이용하는 것도 고려해 보세요.

개발 에디터 설치하기

이쯤 되셨으면 빨리 테스트 코드를 에뮬레이터에 구동해 보고 싶으실텐데요, 서두르실 것 없습니다. 우선 VS Code를 설치하시고 나서 해도 늦지 않아요. VS Code로 플러터 개발을 5개월째 하고 있는데, 상당히 만족스럽습니다. 네이티브 코드를 동시에 수정하고 디버깅하는것은 어렵지만 순수 플러터 코드와 프로젝트 관련 파일들을 관리하는데는 불편함이 없습니다. 아직 어떤 에디터를 사용할지 정하지 못했다면 저를 믿고 VS Code를 사용해 보세요. 속도도 빠르고 무료입니다.

https://code.visualstudio.com/

Visual Studio Code - Code Editing. Redefined

VS Code를 설치하신 후에는, 플러터 개발에 매우 유용한 Extentions 을 설치하셔야 합니다. 이는 다음 글에서..

[다음글]

[플러터] 플러터(Flutter) 시작하기 - VS Code 필수 익스텐션

[플러터] 새로운 프로젝트 생성 및 에뮬레이터로 앱 실행하기

 

재미있게 읽으셨다면 "공감" 버튼과 댓글로 응원해주세요. 로그인 없이도 됩니다. 😀