Flutter (플러터) 개발 환경 세팅

Photo by Fahim Muntashir on Unsplash

 Flutter로 개발을 하기 위해 MacOS에 세팅하는 방법을 정리해본다.

 

IDE 설치

 Android Studio와 XCode(iOS 앱도 빌드할 경우)는 설치되어 있는 상태라고 가정하고 글을 작성 중이다. 아직 설치하지 않았다면 먼저 설치하고 와서 글을 이어서 읽으면 된다. iOS 앱만 빌드하는 경우에도 Dart 사용을 위해 Android Studio는 설치해주어야 한다.

 

반응형

 

Flutter SDK 설치

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

 위의 사이트에 들어가서 Flutter SDK를 다운받고 압축을 풀어준다. 압축을 푼 폴더를 적당한 위치에 옮겨주면 되는데, 다음 경로에 옮겨주었다. 위치는 원하는 곳 어디에 지정하든 상관 없다.

  이제 path 지정을 위해 .zshrc 파일을 수정해줘야 한다. 터미널을 열고 open ~/.zshrc 커맨드를 통해 .zshrc 파일을 열어준다.

 

 파일의 내용 맨 하단에 위와 같이 지정해준 flutter SDK 하위의 /bin 경로까지 PATH에 추가해주고 저장한 후 닫는다. 그리고 터미널에서 source ~/.zshrc를 입력해서 바로 적용해준다.

 

 flutter SDK 경로 지정이 잘 되었는지 확인을 위해 터미널에서 flutter doctor 커맨드를 입력해본다. 여기에서 flutter SDK를 사용하는 툴 중 설치가 안 된 것이 있으면 빨간색으로 표시해준다. Android toolchain은 안드로이드 앱 개발을 하는 경우 설치해주면 되고 XCode는 iOS나 macOS 앱 개발을 하는 경우 설치해주면 된다. Chrome은 웹 개발을 하는 경우 설치해줘도 되고, 아니면 앱 개발을 할 때도 미리보기는 Chrome으로 해도 되니 그런 경우에 설치해주면 된다. Android Studio는 보통 Flutter를 개발할 때 IDE로 사용하기 때문에 설치해주면 된다. IntelliJ나 VS Code는 사용할 경우에 설치해주면 된다.

• Android Studio - 설치
• Xcode - iOS/macOS 개발할 경우 설치
• Android toolchain - Android 개발할 경우 설치
• Chrome - 웹 개발할 경우 설치

 Android Studio나 Chrome은 그냥 설치하면 되고, Android toolchain과 Xcode 설치 후 설정은 아래 섹터들에서 추가로 정리한다.

 

반응형

 

Android toolchain

 Android toolchain은 안드로이드 스튜디오의 SDK Manager의 SDK Tools 탭에서 쉽게 설치할 수 있다. 빨간색 표시해 둔 Android SDK Command-line Tools를 체크하여 설치해주면 된다.

 설치하고 나서 터미널에서 flutter doctor --android-licenses 커맨드를 입력하여 동의 내용들에 y를 입력하여 동의해주면 된다. flutter doctor 를 입력하여 Android toolchain이 제대로 설치되었는지를 다시 확인할 수 있다.

 

Xcode

 Xcode 최신 버전을 설치해주면 자동으로 된다. Xcode command-line tools를 설치할 거냐고 물어볼 때 설치하면 된다. 명령어를 통해 경로를 지정하고 Xcode 라이센스에 동의하는 과정을 수동으로 진행할 수도 있는데 다음처럼 하면 된다.

 만약에 이렇게 하고 나서 flutter doctor 를 실행했을 때 Xcode 쪽에 “CocoaPods not installed.”라는 문구가 나온다면 터미널에서 다음처럼 CocoaPods를 설치하면 된다.

 

 

 

반응형

 

Android Studio

 이제 안드로이드 스튜디오에서 Flutter 프로젝트를 생성하고 개발하기 위해 Plugin을 설치해주면 편하게 사용할 수 있다.

 Android Studio의 Preferences - Plugins에 들어가서 Marketplace에 Flutter를 검색하고 설치해주면 된다. 간단하다. 설치를 하려고 하면 Flutter 플러그인은 설치를 위해 Dart 플러그인이 필요하다고 설치할 거냐고 물어볼텐데 Install을 선택해서 같이 설치해주면 된다.

 설치가 완료되고 안드로이드 스튜디오를 재시작하고 나면 Create New Flutter Project 메뉴가 새로 생긴다. 이걸 사용하여 프로젝트를 생성하면 Android Studio에서 Flutter 프로젝트로 개발을 할 수 있다.

 

 

안드로이드 스튜디오에서 iOS Simulator를 타겟으로 앱을 실행해볼 수도 있다.