[Flutter] Flutter 맥북 개발환경 세팅하기

ㅁ 들어가며

  나에게는 IOS 앱과 안드로이드 앱이 각각 하나씩 있다. 예전에는 하이브리드로 웹앱을 출시하기도 하였는데, 지인과 만나면서 앱을 만들어 봐야겠다는 생각이 들었다. Flutter 개발환경 세팅을 하고 그 과정을 정리하였다.

 

ㅁ Flutter 설치 방법

 ㅇ Flutter 공식 페이지에 설치 방법에 대해서 나와있다. 

 ㅇ 이곳을 따라 맥 개발 환경을 구성하였다.

 

ㅁ Flutter SDK 설치

 ㅇ 플러터 설치 공식 페이지로 이동하여 macOS를 선택한다. 

 ㅇ 첫번째 app으로 안드로이드를 선택하였다.

 

 ㅇ SDK 다운로드 페이지에서 CPU 칩에 따라 다운을 받는다.

 

$ unzip flutter_macos_3.16.8-stable.zip

 ㅇ 개발 공간인 development에 SDK zip을 옮겨 압축해제하였다.

 ㅇ  ~/development/flutter에 SDK 파일이 확인된다면, SDK 설치는 완료되었다.

 

---

안드로이드 개발환경 세팅

---

ㅁ 환경설정

$ vi ~/.zshrc
.......................
# flutter path setting
export PATH=~/development/flutter/bin:$PATH
.......................

 

ㅁ Android Studio 설치

 ㅇ 설치는 이곳에서 다운받아서 설치한다.

 

 ㅇ Plugins에서 Flutter plugin을 설치한다.

 ㅇ 설치 후 재기동 한다.

 

 ㅇ 필수 component 설치

• Android SDK Platform, API 33.0.0
• Android SDK Command-line Tools
• Android SDK Build-Tools
• Android SDK Platform-Tools
• Android Emulator

 

ㅁ Android device 세팅

ㅇ Shift 키를 두번 누르고 Device Manager 입력

 

 ㅇ Create Virtual Device 클릭

 

 ㅇ device를 선택한다.

 

 ㅇ 안드로이드 14, System Image를 선택하였다.

 ㅇ 안드로이드 14 다운로드 중.

 

 ㅇ 장치 이름을 적는고, finish.

 

 ㅇdevice가 생성되었다.

 

ㅁ 개발환경 설치 확인

$ flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 3.16.8, on macOS 13.6.1 22G313 darwin-x64, locale ko-KR)
[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
[!] Xcode - develop for iOS and macOS (Xcode 15.2)
    ✗ Unable to get list of installed Simulator runtimes.
    ✗ CocoaPods not installed.
        CocoaPods is used to retrieve the iOS and macOS platform side's plugin code that responds to your plugin usage on the Dart side.
        Without CocoaPods, plugins will not work on iOS or macOS.
        For more info, see https://flutter.dev/platform-plugins
      To install see https://guides.cocoapods.org/using/getting-started.html#installation for instructions.
[✓] Chrome - develop for the web
[✓] Android Studio (version 2023.1)
[✓] IntelliJ IDEA Ultimate Edition (version 2023.3.2)
[✓] VS Code (version 1.77.3)
[✓] Connected device (3 available)
[✓] Network resources

! Doctor found issues in 1 category.

 ㅇ 안드로이드 개발환경 설치는 완료 되었다.

 

---

iOS 개발환경 세팅

---

ㅁ iOS 개발환경 세팅

flutter iOS 개발환경 가이드

macOS용 Flutter 앱을 개발하려면 Xcode를 설치하여 네이티브 바이트코드로 컴파일하세요.

 

 ㅇ 설치된 Xcode 버전을 사용하도록 명령줄 도구를 구성

sudo sh -c 'xcode-select -s /Applications/Xcode.app/Contents/Developer && xcodebuild -runFirstLaunch'

 

 

 ㅇ iOS 시뮬레이터를 설치

xcodebuild -downloadPlatform iOS

 

ㅇ Xcode 라이센스 설정

sudo xcodebuild -license

 

 

 

ㅇCocoaPods 설치

앱이 기본 macOS 코드가 포함된 Flutter 플러그인 에 의존하는 경우 CocoaPods를 설치해야한다. 이 프로그램은 Flutter와 macOS 코드 전반에 걸쳐 다양한 종속성을 번들로 제공한다.

$ sudo gem install cocoapods
sudo gem install cocoapods
Ignoring eventmachine-1.2.7 because its extensions are not built. Try: gem pristine eventmachine --version 1.2.7
Ignoring ffi-1.15.5 because its extensions are not built. Try: gem pristine ffi --version 1.15.5
Ignoring ffi-1.14.2 because its extensions are not built. Try: gem pristine ffi --version 1.14.2
Ignoring http_parser.rb-0.8.0 because its extensions are not built. Try: gem pristine http_parser.rb --version 0.8.0
ERROR:  Error installing cocoapods:
	ERROR: Failed to build gem native extension.

    current directory: /Library/Ruby/Gems/2.6.0/gems/ffi-1.15.5/ext/ffi_c
/System/Library/Frameworks/Ruby.framework/Versions/2.6/usr/bin/ruby -I /Library/Ruby/Site/2.6.0 -r ./siteconf20240124-17380-16zl24o.rb extconf.rb
/System/Library/Frameworks/Ruby.framework/Versions/2.6/usr/lib/ruby/2.6.0/mkmf.rb:467:in `try_do': The compiler failed to generate an executable file. (RuntimeError)
You have to install development tools first.
	from /System/Library/Frameworks/Ruby.framework/Versions/2.6/usr/lib/ruby/2.6.0/mkmf.rb:546:in `block in try_link0'
	from /System/Library/Frameworks/Ruby.framework/Versions/2.6/usr/lib/ruby/2.6.0/tmpdir.rb:93:in `mktmpdir'
	from /System/Library/Frameworks/Ruby.framework/Versions/2.6/usr/lib/ruby/2.6.0/mkmf.rb:543:in `try_link0'
	from /System/Library/Frameworks/Ruby.framework/Versions/2.6/usr/lib/ruby/2.6.0/mkmf.rb:570:in `try_link'
	from /System/Library/Frameworks/Ruby.framework/Versions/2.6/usr/lib/ruby/2.6.0/mkmf.rb:672:in `try_ldflags'
	from /System/Library/Frameworks/Ruby.framework/Versions/2.6/usr/lib/ruby/2.6.0/mkmf.rb:1832:in `pkg_config'
	from extconf.rb:9:in `system_libffi_usable?'
	from extconf.rb:42:in `<main>'

To see why this extension failed to compile, please check the mkmf.log which can be found here:

  /Library/Ruby/Gems/2.6.0/extensions/universal-darwin-22/2.6.0/ffi-1.15.5/mkmf.log

extconf failed, exit code 1

Gem files will remain installed in /Library/Ruby/Gems/2.6.0/gems/ffi-1.15.5 for inspection.
Results logged to /Library/Ruby/Gems/2.6.0/extensions/universal-darwin-22/2.6.0/ffi-1.15.5/gem_make.out

 ㅇ 에러가 발생하였다. 

 ㅇ cocoapods 설치 오류와 해결 방법을 따라 해결하였다.

 

$ brew install cocoapods

ㅇ homebrew로 설치 하였다.

 

 

ㅁ Flutter Doctor 실행

 ㅇ Flutter 환경세팅을 체크할 수 있다.

 ㅇ 모두 정상적으로 설치가 되었다.

 ㅇ 이제부터는 샘플코드를 다운 받아서 에뮬레이터를 실행해 보도록 하겠다.

 

 

ㅁ Sample code Download

 ㅇ Shift 키 두번, import sample 검색하여 import an Android Code sample를 선택

 ㅇ jetnew를 선택하여 프로젝트를 생성하였다.

 

 ㅇ Device Manager에서 Start 버튼을 클릭한다.

 

 ㅇ App을 실행한다.

 

 ㅇ 안드로이드 emulator까지 작동 확인하였다.

 

ㅁ 함께 보면 좋은 사이트

ㅇ Android Studio 설치 다운로드

ㅇ Start building Flutter Android apps on macOS