Flutter로 Mobile App 개발 준비

본 포스팅은 MacBook Air M2 (Apple Silicon)를 기준으로 작성되었다.

Flutter SDK 설치

• Flutter 공식 홈페이지 접속: https://docs.flutter.dev/get-started/install
• macOS 선택

시스템 요구사항 확인

• M2의 경우 아직 Apple Silicon Chip에 대응 안된 소프트웨어를 위해 아래 명령을 이용해, rosetta를 설치해야 한다.

sudo softwareupdate --install-rosetta --agree-to-license

Flutter SDK 다운로드

• Apple Silicon을 위한 SDK를 다운로드 받는다.

• 다운로드 받은 파일을 압축 풀 경로로 이동 시킨 후 아래 명령으로 압축을 해제한다.
• ~/Dev/sdks 는 임의의 위치로, 본인만의 위치로 변경해도 된다.

cd ~/Dev/sdks
mv ~/Downloads/flutter_macos_arm64_3.3.8-stable.zip ./
unzip flutter_macos_3.3.8-stable.zip

• flutter 폴더가 생성되고, 그 안에 압축이 해제 된 것을 볼 수 있다.
• 전역에서 flutter 명령을 사용할 수 있도록 경로를 등록한다.

echo 'export PATH="$PATH:`pwd`/flutter/bin"' >> ~/.zshrc
source ~/.zshrc

• flutter 명령이 정상 실행되는지 확인한다.

flutter --version

Flutter Doctor로 현 상황 파악하기

• Flutter를 이용해 개발하기 위해 필요한 사항들을 체크해서 보여준다.
• 추가 설치가 필요한 부분은 하나씩 따라서 설치하면 된다.

Android 환경 세팅

• 아래 문서를 보고 순서대로 따라한다.
• https://flutter.dev/docs/get-started/install/macos#android-setup

Android Studio 설치

• 안드로이드 공식 홈페이지에서 Android Stuio를 다운받는다.
  https://developer.android.com/studio

• Mac with Apple chip을 선택하여 다운로드 받는다.

• 설치 후 실행하면 Android Studio Setup Wized가 실행된다.
• 기본 설정으로 Next를 누른다.

• 설치되는 항목 확인

• 라이센스 이용 동의

• 설치완료

Android SDK Command-line Tools 설치

• flutter doctor로 다음 진행해야 되는 과정을 확인한다.

• Android Studio 실행하고
  More Actions > SDK Manager > SDK Tools > Android SDK Command-line Tools (latest)
  선택 후 Apply

Android Licenses 동의하기

flutter docker --android-licenses

• 많은 이용 동의 내용이 나오는데, 모두 y 입력하고 넘긴다.

Android Emulator 설정

VM acceleration 활성화 확인

/Users/[계정이름]/Library/Android/sdk/emulator/emulator -accel-check

• 아래와 비슷한 결과가 나오면 활성화 상태

Virtual Device 생성

• Android Studio의 Virtual Device Manager 실행

• Create Virtual Device 선택

• Phone > 원하는 기종 선택 후 Next

• 시스템에 맞는 이미지가 추천되는데, 선택하고 Next

• Emulated Performance: Hardware - GLES 2.0 선택 후 Finish

Android Studio 플러그인 설치

• Android Studio > Preferences

• Plugins 메뉴에서 flutter 검색해서 설치 후 재시작

 

iOS 환경 세팅

XCode 설치

• 공식 홈페이지에서 다운로드 받거나, App Store에서 설치
  • 공식 홈페이지: https://developer.apple.com/xcode/download/
  • App Store 링크: https://apps.apple.com/kr/app/xcode/id497799835?mt=12
• App Store를 통해서 설치

• 설치 후 실행해서 이용 동의

• 기본 선택하고 설치

• 초기 설정

sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
sudo xcodebuild -runFirstLaunch

CocoaPods 설치

• flutter doctor에 마지막 남은 하나
  https://guides.cocoapods.org/using/getting-started.html#installation

• CocoaPods 설치

sudo gem install cocoapods

모든 설치 완료

flutter doctor

안드로이드 샘플 프로그램 실행

새로운 프로젝트 생성

• Android Studio > New Flutter Project

• Flutter 탭에서 SDK 설치 위치 지정 후 Next

• 프로젝트 정보 세팅 후 Finish
  • Platforms: Android, iOS만 선택

• 우측의 Device Manager 탭 선택 후 Emulator 실행

• 우측의 Emulator 탭에서 확인

• Run 버튼을 눌러 샘플 앱 실행

• 앱 실행 확인
  + 버튼을 누르면 숫자가 올라가는지 확인

 

참고

• Flutter 공식 홈페이지