[Flutter] 프로젝트 시작하기 (macOS)

---

<준비물 다운받기>

1. Flutter SDK 설치

아래 링크에 들어가서 Flutter SDK를 설치해줍니다. 

https://docs.flutter.dev/development/tools/sdk/releases?tab=macos

Flutter SDK releases

Stable channel (macOS) 에서 최신버전을 다운받았는데, 같은 버전이 2개(x64, arm64) 있어서 어떤걸 다운받아야 할지 모르겠을 때는 터미널에 다음과 같이 입력해주면 됩니다.

uname -p

 

 

이제 터미널에 Flutter SDK 경로를 입력해주어야 합니다. 아래 Update your path에 나온대로 수행하고, which flutter를 터미널에 입력했을 때 입력한 경로가 출력되면 됩니다.

https://docs.flutter.dev/get-started/install/macos#update-your-path

macOS install

---

2. XCode 설치

터미널에 다음과 같이 입력했을 때 시뮬레이터가 잘 뜨면 설치가 잘 된 것입니다.

open -a Simulator

---

3. Android Studio 다운받기

https://developer.android.com/studio

Download Android Studio & App Tools - Android Developers

 

플러그인에서 Flutter, Dart를 다운받아줍니다.

 

상단의 Android Studio 탭의 Preferences로 들어가서 Appearance&Behavior - SystemSettings - AndroidSDK - SDK Tools 에 다음 4가지를 체크하고 적용시켜줍니다.

 

4. 체크

터미널에 다음과 같이 입력하면 체크해야할 사항이 나옵니다.

flutter doctor

여기서 에러, 경고가 나올 수 있는데, Flutter, Android toolchain, Xcode, Android Studio 4가지만 초록색으로 체크표시되어 나오는지 확인해주면 됩니다.

---

<프로젝트 실행>

이제 안드로이드 스튜디오에서 새 Flutter 프로젝트를 생성해줍니다. 언어는 Kotlin, Swift로 해줍니다. 

여기서 Next 누르기

저는 모바일앱을 만들거라 이렇게 설정해주었습니다.

 

이제 ios/Runner/Info.plist 파일에 가보면 오른쪽 상단 위에 연동된 Xcode를 열 수 있는 버튼이 생깁니다. 눌러서 계정 연동해줍니다. 여기까지 해줘야 아이폰 기기에서 앱을 실행시켜볼 수 있습니다. 시뮬레이터에서만 테스트해볼거라면 이 과정이 필요하지 않습니다.

 

lib 폴더의 main.dart 파일에 들어가보면 기본적인 코드들이 적혀있습니다. 상단에서 iOS 시뮬레이터를 열고 기다리면 빌드가 됩니다. 

하단의 +버튼을 몇번 눌렀는지 표시해주는 간단한 앱이 나타납니다. 

 

코드에서 텍스트를 찾아 아무 글자(hello world)로나 변경해준 후 저장만 해주면 글자가 바로 바뀌는 것을 확인할 수 있습니다.

 

다시 처음부터 앱을 시작하고 싶을 경우, 빌드를 다시하기보다는 다음 아이콘을 눌러주면 됩니다.

---

이제 앞으로 플러터를 사용해서 어플을 만드는 방법을 하나씩 알아볼 예정입니다!