Flutter - 1. SDK 설치, Android Studio에 Flutter 플러그인 설치, 프로젝트 생성 및 구조

Flutter란, Google에서 내놓은 크로스 플랫폼 프레임워크다.

flutter.dev/?gclid=Cj0KCQiA88X_BRDUARIsACVMYD-33cpDt0iokbs1q5Ei3MSh9HmtZU9YBI8DdynM5etba6ISpwJBUl0aAnQtEALw_wcB&gclsrc=aw.ds

Flutter - Beautiful native apps in record time

공식 홈페이지를 보면 알겠지만, 하나의 코드로 모바일과 웹, 데스크톱 어플리케이션을 개발할 수 있다고 소개한다.
웹과 데스크톱은 제쳐두고, 하나의 코드로 Android, iOS 두 개의 모바일 플랫폼을 개발할 수 있다는 것은 매력적이다.

유사한 프레임워크로 React Native(리액트 네이티브)가 있고 현재 Flutter와 비교되고 있는 중이다.

이 글에서 두 프레임워크의 차이점을 다루지는 않을 것이나 기회가 된다면 다뤄보겠다.

---

1. SDK 설치

Flutter를 개발하기 위해선 SDK를 설치해야 한다.
개발환경이 Windows의 관계로, Windows 기준으로 진행하겠다.

flutter.dev/docs/get-started/install

Install

위 링크를 통해 본인에게 맞는 OS를 선택하여 SDK를 설치한다. 나는 Windows를 선택하였다.

위와 같은 화면을 볼 수 있을텐데, 간단하게 파란색 버튼을 통해 .zip 파일을 받아 압축을 풀어도 된다.
git을 통해 직접 설치하고 싶다면 커맨드라인 툴을 통해 설치할 수도 있다.

압축을 풀면 flutter 폴더 아래에 위와 같은 구성을 확인할 수 있다.
나는 git을 통해 직접 코드를 받아서 .github 폴더가 있다.

SDK 설치는 간단하게 끝났다. SDK 설치 경로를 잘 기억해 두자.

---

2. Flutter 플러그인 설치

Flutter는 Android Studio 혹은 IntelliJ IDE로 개발할 수 있다.
이 글에선 Android Studio를 활용할 것이다.

우선 Flutter, Dart 플러그인을 Android Stuido에 설치해야 한다. Android Studio를 실행하고, Plugins를 열고 Flutter, Dart를 검색하여 설치한다. 위 스크린샷은 이미 설치 된 상황이라 Installed가 표시된다. 

Dart는 Flutter를 개발하는 데 사용되는 프로그래밍 언어이다. Java와 비슷한 점이 많으니, Java를 안다면 어렵지 않게 적응할 수 있다.

---

3. Flutter 프로젝트 생성

설치가 완료되고 나서 Android Studio를 재실행하면, "Create New Flutter Project" 항목이 보일 것이다. 선택하여 프로젝트를 생성하자.

네 가지 항목이 있다. Flutter Application, Plugin, Package, Module 이다. 여기선 Application을 선택한다.

Proejct name, Proejct location, Description은 본인이 원하는 대로 입력하면 된다.
Flutter SDK path는 1번 단계에서 설치했던 SDK 경로를 찾아주어야 한다. 문제가 없다면 "Next"를 할 수 있다.

마지막으로 패키지 명을 입력하면 된다.

하단에 "Platform channel language"는 이 프로젝트가 Android, iOS 각각의 네이티브 플랫폼을 지원할 것인지에 대한 여부로 이해한다.
특별히 지원하지 않을 이유가 없고, Flutter는 하나의 코드로 두 플랫폼을 개발할 수 있다는 것이 큰 장점이므로 모두 체크하도록 한다.

물론 iOS를 빌드하기 위해선 MacOS 환경이 필요하다.

---

4. Flutter 프로젝트 구조는 어떻게 될까?

프로젝트를 생성하면 위와 같은 구조를 확인할 수 있다.
최상위인 "flutter_widgets" 는 앞서 설정한 프로젝트의 명이다.

모든 파일 혹은 폴더에 대해 이해할 필요까지는 없고(나도모름) 중요한 부분들만 짚고 넘어가겠다.

• android - Android 네이티브 플랫폼과 관련된 폴더
• ios - iOS 네이티브 플랫폼과 관련된 폴더
• lib - .dart 파일들로 구성된 Flutter 어플리케이션 폴더 (실제 개발이 이루어지는 곳)
• test - Flutter 어플리케이션의 테스트 코드를 위한 폴더
• pubspec.yaml - Flutter 프로젝트 명, 라이브러리 의존성, 등을 위한 프로젝트 설정 폴더

중점적으로 봐야 할 것은 lib 폴더와 pubspec.yaml 파일로 보면 된다.

---

다음 장부턴 Flutter 어플리케이션을 구성하는 Widget에 대하여 알아 볼 것이다.