Flutter 초기 설정하기 - macOS

Flutter

소마 기간 중 앱을 어떤 것(React Native, native(kotlin))으로 구현할 까 고민 중 생활 코딩이나 페이스북 글 중에 flutter가 많이 나오길래 팀원과 상의하여 flutter로 구현해보기로 결정했다. 사실은 팀원이 web을 싫어해서 RN은 패스 kotlin은 자주 하던거라서 새로운 도전을 해보기로 하여 Flutter를 선택하게 되었다. 

 

우선 필자는 컴퓨터가 macOs 밖에 없기 때문에 macOs에 맞추어서 설치해보겠다. 실제로 flutter 홈페이지에 들어가보면 window, mac, Linux에 맞추어 설치 방법이 있으니 어려움 없이 따라할 수 있다고 생각이든다. 

 

Flutter 설치 위치로 이동

Install

 

위 링크를 통해 이동해서 필자는 macOs로 이동했다. 

 

시스템 요구사항

제일먼저 시스템 요구사항이 보이는데 아래의 사항에 다 맞춰야한다. 개발자라면 아래의 것이 없을리가 없을 것이다.

Flutter SDK 설치

설치 

압축풀기

설치된 폴더로 이동한 후 아래의 명령어를 사용하여 압축을 풀어주었습니다. 

unzip ~/Downloads/flutter_macos_v1.5.4-hotfix.2-stable.zip

 

flutter 경로 추가하기

export PATH="$PATH:`pwd`/flutter/bin"

이 명령어는 현재 터미널의 경로만 추가했기 때문에 밑에서 영구적으로 추가해보겠습니다. 

 

flutter 개별 바이너리 설치

flutter precache

이 명령어를 통해 설치할 수 있다. flutter에서는 사전에 미리 다운받기를 권장한다고 합니다. 

 

flutter precache

flutter doctor

flutter doctor는 flutter를 설치하기 위해 설치해야할 종속성을 확인하기 위해서 사용합니다. 

여기서 느낌표 + 빨간색 표시가 있는 것은 추가적으로 설치가 필요합니다. 필자는 이 과정에서 Xcode update가 필요하고 각종 설치가 필요했습니다. 

 

우선 Android toolChain, iOS toolChain은 단순히 명령어만 따라 쳐주면 됩니다. 

 

Android Studio, IntelliJ 에서는 두 ide다 같은 회사에서 만든 것이기 때문에 설치 방법은 비슷합니다. 

위에서 Preferences로 이동해서 아래와 같이 Plugins에 이동 후 Flutter를 설치해주면 됩니다. 그리고 Restart 해주면 됩니다. 

설치되면 체크 표시가 됩니다. (물론 필자는 안드로이드 스튜디오를 통한 코딩을 싫어하기 때문에 !느낌표가 나와도 무시했다. 

 

영구적으로 경로 업데이트 

제일 위에서 압축을 풀었던 파일을 필자는 귀찮아서 Desktop에 넣어두었다. 일단 cd만을 쳐주어 ~이동한다. 

cd
vi .bash_profile
export PATH="$HOME/Desktop/flutter/bin:$PATH"
:wq로 저장 후 
source .bash_profile을 사용하여 적용시켜준다.

 

프로젝트 생성

flutter create my_app
cv my_app
flutter run

아래와 같이 파일이 만들어집니다.

lib폴더안에 main.dart가 있다.

결론

오늘은 Flutter 초기설정을 해보고 프로젝트를 만드는 과정을 해보았습니다. 다음 글에는 vsCode로 실행하여 ios Simulator를 실행해보겠습니다. (X code나 Android Studio로 개발할 수 있는 것으로 보이나 둘다 싫다) 가벼운 vsCode 짱짱맨 !!!