웹/앱 개발을 위한 크로스플랫폼 플러터(Flutter)-개발환경 설정(Setting)

플루터(Flutter) - 개발환경 설정

오늘은 멀티 크로스플랫폼 중에 하나인 구글 플러터 개발환경 설정 방법에 대해서 알아보겠습니다.

우선 플러터의 정의부터 설명드리겠습니다.

 

플러터 란

플러터는 구글이 개발한 오픈소스 프레임워크로, 네이티브로 컴파일되는 멀티플랫폼 애플리케이션을 하나의 코드로 제작이 가능합니다.

사용하는 언어로는 Dart 언어를 사용합니다.

 

멀티플랫폼이라는 말에서 짐작하셨겠지만, 

플러터는 안드로이드, iOS(플러터 ios), 윈도, 맥 OS, 리눅스, 웹 애플리케이션(플러터 웹)까지 다양한 플랫폼을 지원합니다.

 

정말 매력적인 언어입니다. 다음 포스팅에는 플러터 전망에 대해서 정리해 보겠습니다.

 

그럼 오늘은 플러터 설치 방법에 대해서 알아보겠습니다.

 

1) Flutter SDK 설치

• flutter 설치 위한 검색

구글(Google) 검색창에 flutter install이라고 넣고 검색한다.

첫 번째 검색 결과를 클릭(Click)해 Flutter 사이트로 이동한다.

 

Flutter Site 바로 가기

 

flutter sdk 설치 위한 검색

 

• 설치할 Flutter 선택, 다운로드 및 압축해제

자신의 OS에 맞는 Flutter SDK를 다운로드한다. 필자는 윈도 기반의 SDK를 다운로드하여 설치하겠다.

사용자 OS에 맞는 flutter SDK 다운로드

 

Flutter SDK 선택

 

'Get the Flutter SDK'를 선택한다.

 

Flutter window 버전 SDK zip 파일

 

flutter_windows_3.3.10-stable.zip 파일을 선택하여 다운로드한다.

파일은 적당한 위치에 다운로드하고 압축을 풀어준다.

필자는 flutter SDK파일을 C드라이브에 아래와 같이 풀어주었다.

 

flutter SDK 압축 해제

 

 

• 환경변수에 flutter 경로 설정

아래 그림과 같이 윈도 검색 창에 '시스템 환경 변수 편집'이라고 검색어를 넣어 검색하면 시스템 속성 윈도 창이 뜬다.

 

시스템 환경 변수 편집 검색

시스템 속성 창에서 '고급' 탭의 '환경 변수(N)..'을 클릭하면 '환경 변수' 창이 뜹니다.

환경 변수

환경 변수에서 Path을 선택 후 '편집(E)' 버튼을 클릭하면 '환경 변수 편집' 창이 뜹니다.

새로 만들기(N)을 클릭하여 flutter SDK를 설치한 경로의 bin 디렉터리 경로를 입력해 주고 확인버튼을 클릭하여 저장 후 나옵니다.

필자의 경우는 C:\flutter\bin와 같이 입력하였다.

 

flutter 경로 설정

flutter 환경 변수 설정이 완료되었다면, command 창 어느 위치에서나 flutter 실행이 가능하다.

그리고 설치 확인을 위해 Windows PowerShell을 열어 아래 명령어를 실행하여 환경 설정을 마무리한다.

 

명령어 : flutter doctor ( 엔터 )

그리고 모두 pass(체크)되고 나면 아래와 같은 안드로이드 개발에 필요한 라이선스에 동의해 주면 된다.

라이선스 동의는 아래 명령어를 실행해서 모두 동의(y)해주면 된다.

명령어 : flutter doctor --android-licenses ( 엔터 )

안드로이드 라이선스 동의

 

2) Android studio 설치 및 Flutter Plugin

안드로이드 스튜디오 개발자 사이트를 방문하여 안드로이드 스튜디오(Android studio)를 다운로드한다.

Android studio를 다운로드하기 위해선 라이선스 동의를 체크해 준다.

 

안드로이드 스튜디어 다운로드

 

다운로드한 안드로이드 스튜디오 실행파일을 더블클릭하여 설치를 진행한다.

 

안드로이드 스튜디어 설치

설치 완료 후 안드로이드 스튜디오를 실행하여 Flutter를 Plugin 한다.

File > Settings > Plugins를 선택한다.

flutter라고 검색어를 입력하여 검색 후 Flutter를 Install 해준다.

 

안드로이드 스튜디오에 Flutter를 Plugin

 

그리고 상단 메뉴 중 SDK Manager를 실행하여 아래와 같이 Android SDK Command-line Tools를 체크하여 설치를 마무리한다.

 

3) Flutter Project 실행해 보기

Flutter 신규 프로젝트를 만들어보겠다.

File > New > New Flutter Project를 차례대로 선택한다.

신규 flutter 프로젝트 생성

Flutter 선택 후 Flutter SDK path에 flutter SDK가 설치된 경로를 입력(선택) 후 Next 

 

Project name : 에 생성할 프로젝트 이름을 적어준다.

Project location : 에는 생성할 프로젝트가 저장될 위치를 선택해 준다.

Android language, iOS language를 선택해 주고, 배포할 Platforms을 선택해 준다.

 

그리고 Finish 해주면 아래와 같이 신규 Flutter 프로젝트가 생성된다.

기본적으로 lib> main.dart 파일에 소스코드를 작성하면 된다.

첫 flutter 프로젝트를 실행해 보겠다.

flutter 신규 프로젝트

상단에 Chrome(web) 선택 > 실행 파일 선택(main.dart) > 실행(▶) 버튼 클릭해 실행한다.

 

flutter 실행 결과