플러터(Flutter)로 모바일 앱 개발환경 구축하기
최근에 회사를 이직하면서 개발에 좀더 집중할 수 있는 시간이 늘어난거 같다. 또한 C++ 로 개발을 진행하기 때문에 자연스레 “객체지향”에 대한 개념도 머릿속에 정리가 되기 시작했다.
최근 소프트웨어 개발을 할때 언어 트랜드는 “객체지향” 이다. 클래스라는 코드 틀을 사용하여 코드를 재활용 하는 것이다. 신입때부터 주로 C 위주로 개발을 했던 내게는 객체지향의 개념을 익힌게 그리 오래 되지는 않았지만 C의 단점 중에 하나인 “코드 재활용”이 현재 많이 사용되는 언어인 파이썬, 자바, 자바스크립트 등이 자연스레 확산되게 된거 같다.
현재 소프트웨어는 워낙 성능이 좋은 하드웨어가 등장한 탓에 메모리 제어가 딱히 필요없는 언어들이 각광을 받고 있다. 그래서 좀더 개발이 수월해지고 편리해진 까닭에 코드 규모도 커지고 프로젝트의 크기도 현저하게 늘어나게 된 것이다. 파이썬, 자바 같은 객체지향적이면서 포인터 개념이 들어가 있지 않은 언어는 많은 소프트웨어 프로젝트에 사용이 되고 있는 중이다.
주로 C/C++ 을 사용했던 내게 어느순간 부터 고민이 생기기 시작했다. 그 이유는 C/C++ 을 사용하여 개발하는 소프트웨어는 여전히 존재하지만 진출할 수 있는 분야가 점점 한정적이기 때문이다. 얼마전까지 C++ 로 윈도우즈 어플리케이션을 개발했으나 이제는 C# 이나 심지어 파이썬으로 윈도우즈 어플리케이션을 개발할 수 있는 시대가 되었다. 굳이 C나 C++ 을 사용하지 않더라도 어플리케이션 개발이 가능해진 것이다.
그래서 현재는 C나 C++을 했던 프로그래머들이 진출할 수 있는 분야가 상대적으로 제한적이다. 그리고 빠른 업데이트와 개발 속도를 요구하는 클라이언트 어플리케이션에는 상대적으로 효율이 떨어진다. 굳이 컴파일을 하지 않아도 얼마든지 프로그램을 돌려 볼 수 있는 파이썬이나 자바스크립트가 굉장히 각광을 받는 이유이다.
본업은 C/C++ 을 사용하여 리눅스 어플리케이션이나 리눅스 시스템 개발을 하고 있지만 상대적으로 개발 기회를 더 얻으려면 아무래도 파이썬, 자바, 자바스크립트 같은 언어를 배워야 더 많은 기회가 생기는게 현실이다. 특히 모바일 앱쪽은 자바, 코틀린, 오브젝트-C 등을 다룰줄 알아야 개발이 가능하다.
프로그래머로써 자유롭게 사는 것을 꿈꾸고 있는 와중에… 시간과 장소에서 자유로운 개발 분야는 웹과 모바일 앱쪽이다. 이쪽 분야는 단순히 PC나 노트북만 있으면 언제 어디서든지 개발이 가능하고 수익을 창출할 수 있다.
소프트웨어 수익 모델에 대한 것을 정리한 글이다. 쭉 정리를 해보니 내가 아무래도 접근하기 편하고 해보고 싶은 분야가 “모바일 앱” 이다. 별도의 회사에 소속되지 않아도 1인 개발로 웹이나 앱은 충분히 수익화가 가능하기 때문이다. 그런데 웹과 모바일 앱 쪽에서 어느쪽을 먼저 해야 할지 고민이 되었다.
요즘 웹과 모바일 앱은 사실 연관성이 너무 많다고 볼 수 있다. 대다수의 플랫폼 기업들이 모바일앱과 웹 형태로 서비스를 제공한다. 웹으로 UI를 구성하고 그 UI를 그대로 모바일 앱으로 표시만 해주는 회사들도 있다(안드로이드의 경우 웹뷰를 사용해서..)
그런데 내 입장에서는 동시에 해보기에는 사실 시간이 많이 소요가 된다. 그래서 적절한 방법을 찾아보던 도중에… 모바일 앱도 개발하면서 동시에 웹도 개발할 수 있는 프레임웍이 있다는 것을 알아냈다. 심지어는 “크로스 컴파일” 이 가능해서 안드로이드와 아이폰 동시에 출시가 가능하다.
바로 “플러터(Flutter)” 다.
플러터(Flutter)란?
Flutter 는 2017년에 구글이 출시한 모바일, 웹, 데스크탑 앱을 크로스 컴파일 하여 동시에 출시가 가능한 프레임워크이다. 즉 한개의 소스를 가지고 안드로이드, 아이폰 앱, 웹, 데스크탑 앱을 동시에 출시가 가능한 것이다.
정말인가? 라고 눈을 비비면서 Flutter 공식 사이트에 접속해서 확인했더니 진짜다! 심지어는 구글에서 출시했으니 나름 인지도도 있는 셈이다. 안드로이드를 출시한 구글이라면 Flutter 로 안드로이드 앱을 개발하는게 수월할거라 생각된다. (필자는 주로 안드로이드폰만 사용했다.)
놀라운 점은 Flutter 로 안드로이드 앱과 아이폰 앱을 동시에 릴리즈가 가능하다는 것이다. 기존의 상식으로는 안드로이드 프로그래머가 자바나 코틀린으로 안드로이드 앱을 개발하고 아이폰 앱 프로그래머가 오브젝트C나 스위프트로 아이폰 앱을 개발하여야 했다. 즉 각 OS별로 개발 인력을 따로 둬야 했다는 뜻이다.
하지만 Flutter 를 이용하면 안드로이드 앱이나 아이폰 앱을 플러터 프레임워크로 동시에 개발하는게 가능해진다. 문제는 얼마나 호환이 잘 되느냐인데 알아본 결과 나름 성능도 괜찮고 앱을 출시하는데 큰 문제가 없다고 한다. 현재 유명 몇몇 앱들의 경우에는 플러터로 개발되어 출시가 되고 있다.
또한 플러터는 안드로이드와 iOS 앱 뿐만 아니라 웹, 데스크탑 앱 까지 크로스 컴파일이 가능하여 1석 2조가 아닌 1석 4조의 개발 효과를 누릴 수 있다. 앱을 출시하고 동일하게 웹 페이지까지 출시가 가능한 것이다. 이것은 웹까지 같이 출시하려는 프로그래머들에게 엄청난 장점이 될 수 있다.
플러터는 “Dart” 라는 언어로 앱을 개발한다. Dart 는 문법이 C나 자바 스크립트와 비슷하여 이들 언어를 사용했던 경험이 있는 프로그래머들은 좀더 쉽게 익힐 수 있다.
위 링크는 Dart 언어의 공식 가이드 문서이다. 플러터로 앱 개발을 위해 Dart 언어의 문법을 알고 싶다면 위 링크의 문서를 참고하면 된다.
현재 플러터는 3.03 버전이 공식적으로 릴리즈되어 있다.(2022년 7월 초 현재)
Flutter 개발 환경 구축 하기
그럼 플러터로 모바일 앱 개발 환경을 구축해보도록 하자. 플러터는 안드로이드 개발환경 같이 안드로이드 스튜디오를 IDE 로 사용할 수 있고 Visual Studio Code 를 통해 개발이 가능하다. 필자의 경우에는 아무래도 플러터가 구글에서 출시되었고 공식 지원하는 안드로이드 스튜디오를 통해 개발 환경을 구축하기로 했다.
먼저 플러터 SDK 를 다운로드 받아보자. 플러터 공식 사이트에 접속하여 우측 상단에 “Get started” 버튼을 클릭한다.
그럼 위와 같이 각 OS 별로 플러터를 다운로드 할수 있는 버튼이 나타난다. 필자의 경우에는 Windows 가 개발 환경이므로 Windows 를 선택했다.
그럼 위와 같이 플러터 SDK 를 다운로드 할 수 있는 버튼이 나타난다. 현재 출시된 버전은 3.03 이다. 버튼을 눌러 다운로드를 한 다음에 위 가이드대로 적절한 위치에 플러터 SDK의 압축을 해제하면 된다. 나같은 경우는 D:\src\flutter 에 압축을 해제하였다.
압축 해제가 끝났으면 플러터 SDK의 PATH 설정이 필요하다. “제어판 – 고급 시스템 설정” 을 클릭한다.
그 다음에 고급 탭에서 “환경 변수” 버튼을 클릭한다.
여기서 사용자 변수에서 좀전에 설치한 플러터 SDK 경로를 넣어주면 된다. “편집” 버튼을 누르고
“새로 만들기”를 눌러서 경로를 넣어준 다음에 “확인” 버튼을 누르면 설정이 끝이 난다.
Windows PowerShell 를 실행하여 현재 플러터 버전을 확인해본다. “flutter –version” 을 입력하면 위와 같이 출력이 되면 플러터 SDK 설치가 완료된 것이다.
다음으로 안드로이드 스튜디오 설치가 필요하다. 안드로이드 스튜디오 설치과정은 아래 링크를 참고한다.
안드로이드 스튜디오 설치를 완료하고 설정 절차가 완료되면 아래와 같이 라이브러리 설치가 진행된다.
안드로이드 스튜디오 최신 버전의 경우에는 아래와 같이 초기 화면이 나타난다.
여기서 플러터 사용을 위해 플러터 플러그인을 설치해야 한다. 위의 그림에서 보이듯이 “플러그인” 을 클릭한다.
플러그인에서 “flutter” 를 검색하면 위와 같이 플러그인이 나타날 것이다. 요걸 Install 버튼을 눌러서 설치해준다.
설치가 완료되면 Restart IDE 를 눌러서 안드로이드 스튜디오를 재시작 해준다. 그럼 안드로이드 스튜디오의 설치와 설정이 끝난 것이다.
설치가 끝났으면 몇가지 추가로 설정해야 할 것들이 있다. 먼저 Windows PowerShell 을 다시 실행시킨 후에 아래와 같이 실행을 시킨다.
flutter doctor
안드로이드 스튜디오를 새로 설치했다면 위와 같이 안드로이드 라이센스 관련하여 에러가 뜰것이다. 위 상태는 문제가 있으므로 추가적으로 안드로이드 스튜디오의 SDK Manager 에서 아래의 툴을 설치해준다.
그런 다음에 파워쉘에서 다시 안드로이드 라이센스 인증을 진행해준다.
그럼 위와 같이 라이센스 관련하여 인증이 진행된다. 그런 다음에 “flutter doctor” 로 확인해 보면
안드로이드 툴체인이 정상임을 알수 있다.
Flutter 프로젝트 생성
그럼 간단하게 Flutter 프로젝트를 생성하여 앱을 동작시켜 보도록 하자. 먼저 안드로이드 스튜디오를 실행한다.
“New Flutter Project” 를 실행한다.
플러터 SDK 가 설치되어 있는 경로를 선택해준다.
위의 그림에서 보이듯이 프로젝트 네임과 프로젝트 위치, 안드로이드 랭귀지, iOS 랭귀지, 플랫폼 등을 선택해준다. 그런 다음에 “Finish” 버튼을 누른다.
그럼 위와 같이 플러터 프로젝트를 생성하고 있다는 버튼이 나타난다. 조금만 기다린다.
조금 기다리면 위와 같이 새로 플러터 프로젝트가 생성이 된다. 앞으로 플러터로 모바일 앱을 개발할때 이 화면을 자주 보게 될 것이다.
여기서 앱을 실행해보려면 몇가지 방법이 있다.
- AVD(안드로이드 가상 머신)을 실행
- 자신의 안드로이드 폰을 연결
- 웹으로 확인
안드로이드 가상 머신은 편리하긴 하지만 자신의 노트북이나 PC의 시스템 리소스를 잡아먹는 경우가 많으므로 내가 가지고 있는 안드로이드 폰으로 확인해보는게 좋다. 일단 여기서는 안드로이드 폰을 연결하여 확인해 보자.
먼저 자신의 안드로이드 폰을 연결하려면 “개발자 모드” 를 활성화 해야 한다. 최신 안드로이드 11 버전 이상은 WiFi 로 연결하는게 가능하지만 그 이하 버전은 USB 케이블을 통해 PC와 연결을 해주면 된다.
자신의 폰에서 “설정 – 휴대전화 정보 – 소프트웨어 정보” 를 클릭한다.
소프트웨어 정보에서 “빌드번호” 를 계속 눌러주면 개발자 모드가 활성화 된다. 위의 그림같이 개발 설정 완료 단계가 점점 올라가면서 개발자 모드가 켜지게 된다.
그러면 위와 같이 “개발자 옵션” 이 활성화 된 것을 확인할 수 있다. 개발자 옵션 메뉴로 들어가서 “USB 디버깅” 을 활성화 시킨다. 그 다음에 자신의 폰과 PC 사이에 USB 케이블을 연결해 주면 오른쪽 그림과 같이 USB 디버깅을 허용하겠냐는 메시지가 뜬다. “이 컴퓨터에서 항상 허용” 을 체크하고 “확인” 을 누르면 이후부터 내 폰에서 플러터로 개발한 앱을 실행시킬 수 있다.
여기까지 준비가 되었으면 좀전에 생성한 플러터 프로젝트를 실행시켜 보자.
안드로이드 스튜디오에서 오른쪽 위의 녹색 재생 버튼을 누르면 프로젝트가 빌드 되면서 내 폰에서 실행이 되게 된다. 내 폰이 잘 연결되어 있는지도 확인을 하고 난 다음에 실행시킨다.
앱이 실행중일 때 안드로이드 스튜디오의 모습이다. 콘솔 창이 활성화 된 것을 확인할 수 있다. 그럼 내 폰에서 확인을 해보자.
좀 전에 생성했던 플러터 앱의 모습이다. 오른쪽 하단의 + 표시된 버튼을 누르면 가운데 숫자가 증가하는 간단한 데모 앱이다. 여기까지 했으면 이제 나와 여러분은 플러터로 앱을 개발하는 첫걸음을 시작한 셈이다.
이후에는 플러터 SDK 로 나만의 앱을 개발하는 일만 남았다. 나도 시간나는대로 플러터 앱을 개발해 봐야겠다.