통합 개발 지식/Mac 환경 셋팅

[Flutter] 개발 환경 구축(Mac)

개발자킹콩 2023. 2. 26. 21:20

처음 flutter를 개발하기 위해 세팅을 구축하는 방법에 대한 포스팅이다.

 

 

 

 

1. 해당 사이트에서 Flutter SDK(Software Development Kit)를 다운 받는다.

SDK(Software Development Kit)는 flutter를 개발하기 위한 개발바구니이다. 이 SDK가 있어야 우리가 Dart 언어로 Flutter를 개발할 수 있다. Flutter SDK가 이를 컴파일하고 합하는 빌드라는 작업을 하게 되고 우리에게 앱이라는 프로그램을 제공 해주는 것이다.

 

https://docs.flutter.dev/get-started/install

 

Install

Install Flutter and get started. Downloads available for Windows, macOS, Linux, and Chrome OS operating systems.

docs.flutter.dev

 

 


 

2. 우선 설치된 Flutter SDK를 Downloads에 두면 삭제할 수 있으니 적당히 안전한 공간으로 이동하여 압출을 푼다.

cd ~  // Home 으로 이동
mkdir Developer  // 새로운 폴더 생성
cd Developer  // 폴더 안으로 들어가기
unzip ~/Downloads/flutter_macos_3.7.5-stable.zip  // 본인이 설치한 파일을 Developer에 압출풀기

 


 

 

3. 다운 받은 Flutter SDK가 어디있는지 내 컴퓨터에게 알리는 작업을 해야한다. 정확히는 운영체제에게 알려야 한다.

Mac OS는 기본적으로 2가지 종류의 Shell을 사용한다. (bash, zsh)

 

Shell이란 운영체제의 핵심인 커널과 사용자를 이어주는 인터페이스 프로그램이다. 사용자가 Command Line Interface에 명령어를 치면 Shell은 운영체제의 핵심은 커널이 해석할 수 있도록 이 명령어를 기계어로 변화시킨다. 커널에서는 이 기계어에 의해 하드웨어를 동작시킨다. 


 

참고로 기존에는 리눅스에서도 가장 많이 사용되는 bash shell이 기본 shell이었으나, Mac OS Catalina 부터는 기본 shell이 zsh로 바뀌었다. 즉, 요즘 사용하는 Mac이면 zsh를 사용할 것이다.

 

 

그래서 Catalina 이후의 OS가 설치된 Mac에서 terminal을 실행하면 다음과 같은 메세지를 볼 때가 있습니다.

The default interactive shell is now zsh.
To update your account to use zsh, please run `chsh -s /bin/zsh`
For more details, please visit https://support.apple.com/kb/HT208050.

위 메세지가 에러를 의미하는건 아니지만 결국 기본 shell이 zsh니까 bash보단 zsh를 사용해라 라는 의미입니다.

 

 

위 메세지에 나온 URL로 들어가면 관련된 Apple에서 제공하는 관련 설명이 있습니다.

https://support.apple.com/kb/HT208050

 

Mac에서 zsh를 기본 셸로 사용하기

macOS Catalina부터는 Mac에서 zsh를 기본 로그인 셸 및 대화형 셸로 사용합니다. 이전 버전의 macOS에서도 zsh를 기본 셸로 설정할 수 있습니다.

support.apple.com

 

개발에서 Shell이 중요한 이유는 환경 변수를 설정할 때이다.

https://ko.wikipedia.org/wiki/환경_변수

 

환경 변수 - 위키백과, 우리 모두의 백과사전

위키백과, 우리 모두의 백과사전. 환경 변수(環境 變數, 영어: environment variable)는 프로세스가 컴퓨터에서 동작하는 방식에 영향을 미치는, 동적인 값들의 모임이다. 환경 변수 보기/설정[편집] 변

ko.wikipedia.org

 


 

// 다음 명령어를 실행하면 자신 mac이 사용하는 shell 종류를 알 수 있다.
echo $SHELL

 

/bin/bash : Bash를 사용 중

// 다음 두 명령어 중 하나를 실행해주세요
vi ~/.bash_profile
vi ~/.bashrc

 

/bin/zsh : Z Shell 을 사용 중

// Z Shell을 사용 중일대 다음 명령어를 실행 해주세요.
vi ~/.zshrc

 

그럼 파일이 열리는데 맥북에서 사용하면 Terminal을 스크롤로 내려는 것이 가능하다. 안 된다면 j를 눌러 커서를 가장 아래로 내려 i를 눌러 insert 모드로 변경한 후 아래의 코드를 추가해라.

// export PATH="$PATH:{압축을 푼 플러터 폴더 위치}/bin"
// 주의: export PATH = "" 처럼 등호 양 옆으로 공백이 있으면 안 된다.
export PATH="$PATH:/Users/joyeong-u/Developer/flutter/bin"

 

완료 했으면 esc를 누르고 :wq 를 눌러 저장 후 종료를 누른다.

 

 


 

 

4. IDE(Integrated Development Environment, 통합 개발 환경) 설치

 

IDE는 소프트웨어 프로그램을 만들때 생산성을 올려주는 프로그램을 의미합니다. 원하는 프로그램에 맞는 최적화된 IDE가 각각 존재합니다. 아이폰 어플을 만들기 위해서는 Xcode, 안드로이드 어플을 만들기 위해서는 Android Studio를 사용합니다.

 

https://aws.amazon.com/ko/what-is/ide/

 

IDE란 무엇인가요? - 통합 개발 환경 설명 - AWS

AWS Cloud9은 브라우저에서 직접 코드를 작성, 실행 및 디버그하는 데 사용할 수 있는 클라우드 통합 개발 환경입니다. JavaScript, Python, PHP, Ruby, Go, C++ 등 40여 개의 언어를 지원하는 다국어 IDE입니다.

aws.amazon.com

https://namu.wiki/w/통합%20개발%20환경

 

통합 개발 환경 - 나무위키

이 저작물은 CC BY-NC-SA 2.0 KR에 따라 이용할 수 있습니다. (단, 라이선스가 명시된 일부 문서 및 삽화 제외) 기여하신 문서의 저작권은 각 기여자에게 있으며, 각 기여자는 기여하신 부분의 저작권

namu.wiki

 


 

 

Xcode는 앱스토어에서 설치 가능합니다.

 

그전에 Homebrew와 Cocoapod 설치가 필요하다.

Cocoapod의 설치는 Firebase 설정 이전까지만 진행하면 설치를 완료할 수 있다.

 

https://yeongwoo-cho.tistory.com/entry/2-How-to-install-Homebrew

 

2. How to install Homebrew?

MacOS용 패키지 관리자 Homebrew를 설치하자 맥에서 개발을 하게되면 결국엔 homebrew를 설치하게 된다. 그만큼 강력한 놈이다. https://brew.sh/ Homebrew The Missing Package Manager for macOS (or Linux). brew.sh 위 링크

yeongwoo-cho.tistory.com

https://yeongwoo-cho.tistory.com/entry/asdf-6

 

3. Firebase 연결하기 (iOS Swift by CocoaPods)

우리는 iOS 어플과 Firebase를 연결시키기 위해서 CocoaPods 라는 것을 사용할 것이다. 우선 아래의 링크를 참고해서 CocoaPods를 설치해보자 https://cocoapods.org/ CocoaPods.org CocoaPods is built with Ruby and is install

yeongwoo-cho.tistory.com

 

 

// 설치가 완료되면 설치한 Xcode 버전을 시스템에서 사용할 Xcode 버전으로 설정해야 한다. 
// 다음 명령어를 CLI에서 실행한다.
sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
sudo xcodebuild -runFirstLaunch

 


 

Android Studio 는 아래 링크에서 설치 가능합니다.

 

https://developer.android.com/studio

 

Download Android Studio & App Tools - Android Developers

Android Studio provides app builders with an integrated development environment (IDE) optimized for Android apps. Download Android Studio today.

developer.android.com

 

 

 


 

 

5. Dart/Flutter Plugin 설치

 

콘센트에 플러그를 꼽는 것처럼 어떤 프로그램에 없던 새 기능을 추가하기 위해 더해넣는(Add-in) 부가적인 프로그램. 자체적으로는 실행 능력은 없지만 특정한 프로그램 속에서 함께 실행되어 기능을 발휘한다. 원래는 하드웨어 분야에서 컴퓨터가 기본적으로 제공하지 않거나 부족한 기능을 보강하기 위한 장치란 뜻으로 사용되었으나 요즘에는 부가 소프트웨어라는 뜻으로 주로 사용된다. 즉, 기본 소프트웨어를 지원해서 특수한 기능을 확장할 수 있도록 설계된 부속 프로그램을 의미한다.

 

https://ko.wikipedia.org/wiki/플러그인

 

플러그인 - 위키백과, 우리 모두의 백과사전

위키백과, 우리 모두의 백과사전. 플러그인(plugin) 또는 추가 기능(애드인;add-in, 애드온;add-on)은 호스트 응용 프로그램과 서로 응답하는 컴퓨터 프로그램이며, 특정한 "주문식" 기능을 제공한다.

ko.wikipedia.org

 

원래 안드로이드 스튜디오에서는 flutter를 개발할 수 없지만 google에서 이를 가능하게 하기 위해 flutter plugin을 제공하며 이를 설치할 수 있다.

 

 

 

 


 

 

 

6. 설치 문제 해결하기

 

Terminal에 다음 명령어를 실행하여 모두 정상적으로 체크 표시가 나오도록 설정한다.

(사용하지 않는 IDE에서는 error이 발생해도 상관없다. 하지만 Android Studio와 Android toolchain, Xcode, Flutter은 정확하게 체크되어 있어야 한다.)

 

flutter doctor

 


 

error 1: cmdline-tools component is missing

Android SDK Command Line Tools가 설치되지 않아 생긴 문제입니다.

 

 


 

error 2: Android license status unknown

 

안드로이드 스튜디오를 사용하려면 라이센스 동의를 해야한다.

// 다음 명령어를 터미널에서 실행한다.
flutter doctor --android-licenses

 

java.lang.UnsupportedClassVersionError 에러발생

 

높은 버전의 JDK에서 컴파일한 class 파일을 낮은 버전의 JDK에서 실행을 해서 발생하는 에러이다.

 

 

 


 

 

error 3: Android Studio - Unable to find bundled Java version.

 

2023년 1월 23일 안드로이드 스튜디오 Electric Eel 버전이 정식 출시되었다. 여기서 약간의 변화가 생겼다. 기존의 자바 개발 도구 였던 jre가 사라지고 OpenJDK를 기반으로 한 자바 런타임 jbr(JetBrains Runtime)로 대체되었다. 기존의 JRE가 하던 역할을 완전히 대체하므로 환경변수 내 경로만 변경하면 이를 해결할 수 있다. 경로 내 jre jbr로 바꿔줍니다.

export JAVA_HOME="/Applications/Android Studio.app/Contents/jre/Contents/Home"
 export JAVA_HOME="/Applications/Android Studio.app/Contents/jbr/Contents/Home"

 

 

 

혹은

 

jbr 폴더를 복제하여 jre라는 이름의 폴더를 생성하면 해결된다.

 

 

 

 

 

 


 

 

 

추가 자료

 

https://velog.io/@oen/새로운-맥에-안드로이드-스튜디오-플러터-설치하기

 

새로운 맥에 플러터 개발 환경 세팅 - 안드로이드 스튜디오, 플러터 설치하기

새로운 맥으로 바꾸게 되면서 플러터를 사용해서 개발을 하기 위한 세팅을 해보았어요.ide로는 기존에 플러터로 개발할 땐 주로 안드로이드 스튜디오로 개발했어서, 안드로이드 스튜디오도 설

velog.io

 

https://velog.io/@oen/flutter-doctor-에러

 

flutter doctor 실행시 각종 에러 해결

 

velog.io

 

https://llighter.github.io/install-java-on-mac/

 

맥에서 Brew로 자바 설치하기(feat. 자바버전 바꾸기)

 

llighter.github.io

 

https://www.androidhuman.com/2023-01-28-fix-jre-path-android-studiio-ee

 

안드로이드 스튜디오 Electric Eel 로 업데이트 후 발생하는 JAVA_HOME 환경 변수 문제 해결하기

#Android, #Kotlin, and #Tesla

www.androidhuman.com