Flutter 설치하는 방법 & 프로젝트 생성 방법

* Window 기준으로 글을 작성하였습니다.

📌Flutter SDK 설치

Start building Flutter Android apps on Windows

 

Flutter 사이트에 접속 후 개발환경에 맞는 플랫폼을 클릭해서 접속한다. (위 링크는 Windows)

사이트에 무엇을 어떻게 설치해야하는지 설명되어있다.

 

스크롤을 내려서 최신 SDK를 다운받는다.

 

Flutter SDK archive

다른 버전을 설치하고 싶다면 SDK archive에 접속해서 원하는 버전을 다운받을 수 있다.

 

다운받은 SDK 파일을 우너하는 위치에 압축해제한다.

나는 C드라이브 아래에 flutter 폴더를 생성 후 압축 해제했다.

 

📌Windows Path Variable 설정

C:\flutter\bin\flutter.bat

이 파일을 윈도우 전역에서 사용하기 위해 시스템 환경변수 설정을 해줘야한다.

이 역시도 제일 위에 걸어둔 Flutter 링크에 들어가면 방법이 나와있다.

하나씩 해보자.

 

1번, 2번처럼 들어가거나, 시작창에 '시스템 환경 변수 편집'을 검색해서 '시스템 속성' 창을 띄운다

 

환경변수 → Path → 편집 → 새로만들기 → 'C:\flutter\bin' 추가

 

 

Window+R 키를 누른 후, 'cmd'를 입력해서 커맨드창을 연다.

 

flutter --version

명령어를 입력한다.

 

내가 다운받은 버전으로 설치된 것을 확인할 수 있다.

 

flutter doctor는 Flutter 개발 환경의 모든 구성 요소가 올바른지 확인하는 명령어다.

안드로이드 툴체인이 없으니 설치해야한다.

 

📌Android Studio

⭐안드로이드 스튜디오 설치

Android 스튜디오 및 앱 도구 다운로드 - Android 개발자  |  Android Studio  |  Android Developers

안드로이드 스튜디오 사이트에 들어가서 다운받는다.

설치할때 옵션은 따로 건드리지 않았다.

 

⭐Android toolchain 설치

More Action → SDK Manager → SDK Tools → Android SDK Command-line Tools 체크 → Apply → 설치 후 OK 버튼 클릭

 

flutter doctor 명령어를 다시 입력해보면, Some Android licenses not accepted 문구가 뜬다.

뒤에 해결법까지 적혀있다.

 

flutter doctor --android-licenses

명령어를 입력하고, 뒤에 나오는 모든 물음에 y를 입력해준다.

그러면 All SDK package licenses accepted 문구가 뜬다.

 

다시 flutter doctor 명령어를 입력하면, android toolchain 설치가 완료된 것을 확인할 수 있다.

 

이제 Visual Studio 설치를 하면 된다.

 

📌 Visual Studio

무료 개발자 소프트웨어 및 서비스 - Visual Studio

사이트 접속 후 Visual Studio Community를 다운받는다.

 

이미 설치가 되어있다면 Visual Studio Installer 파일을 실행시키고,

설치되어있는 버전 우측에 있는 수정 버튼을 누른다.

 

C++를 사용한 데스크톱 개발 클릭 후 수정 버튼을 눌러 설치한다.

나는 이미 설치가 되어있어서 언체크 후 다시 체크해서 설치해주었다.

 

설치 후 다시 확인해보면 모두 체크표시가 뜬 것을 볼 수 있다.

 

📌Flutter 프로젝트 생성

Android Studio 실행 → Plugins → Flutter, Dart 설치

Project 탭으로 들어갔더니 재시작 팝업창이 떠서, 재시작도 해줬다.

 

Projects → New Flutter Project

Flutter → ... 버튼 클릭 후 SDK 경로 설정 (나는 C:\flutter 경로를 입력했다.)

Next 버튼 클릭

 

프로젝트 이름 적어준 후 Create 버튼 클릭

 

좌측의 lib 폴더 안의 main.dart 파일에 코드를 작성해주면 된다.

상단에서 재생버튼을 누르면 실행해볼 수 있다.

 

📌VS Code 사용하는 방법

개인적으로 vs code를 좋아해서, 안드로이드스튜디오 대신 vscode를 사용할 수 있는 방법에 대해 알아봤다.

 

vscode로 위에서 생성한 프로젝트를 연다.

main.dart 파일을 우클릭한 후 Run Without Debugging 을 클릭하면 실행해볼 수 있다.

F5 키를 눌러 디버깅을 실행할 수도 있다.

⭐extension

필수 확장프로그램 : Flutter

유용한 확장프로그램 : (사용해보면서 추가할 예정)