[flutter]1. flutter SDK 설치하기(Windows) with VScode

 

이번 시간에는  윈도우에서 플러터를 설치해보려 합니다 !

저는 안드로이드 스튜디오가 아닌 Visual Studio Code 를 사용하여 설치하려 합니다 :) 

안드로이드 스튜디오 버전은 다음 포스팅에 하겠습니다 !

 

 

 

1. Flutter SDK 다운로드

아래 링크에서 자신에게 맞는 OS로 다운로드해서 적당한 위치에 압축을 풀어줍니다 :)
저흰 윈도우에서 진행하니까 Windows 버전으로 받아야겠죠?

https://flutter.dev/docs/get-started/install

Install

 

 저는 이 경로에 받아놨습니다.  C:\src\flutter

 

2. Flutter 환경 변수 설정하기

이제 flutter를 자신의 컴퓨터 어디서든 실행할 수 있도록 환경 변수를 지정해주어야 합니다

시작에서 시스템 찾기  -> 고급 시스템 설정  -> 환경 변수 클릭 !

[Tip : 시스템 정보창 단축키 : Windows 키 + Pause]

 

환경 변수 창에서 Path를 더블 클릭하거나 편집을 눌러서 

아까 설치한 위치의 flutter/bin 폴더를 변수로 지정해줍니다!

 

3. VSCode 설치 하기

 이제 저희가 쓸 VScode를 받아줍니다!

 설치는 아래를 눌러주세요! 

Visual Studio Code - Code Editing. Redefined

 

4. Android Studiod 설치 

안드로이드 스튜디오를 설치해야 가상 Emulator를 돌릴 수 있습니다.

설치 안 하고 VSCode에서 디버깅을 진행하면 Chrome으로도 할 순 있지만, 앱 개발을 위해 받아줍니다!

Download Android Studio and SDK tools  |  Android Developers

 

5. Flutter Extensions 설치하기 - Plugin

이제 VSCode에서 Flutter를 사용할 수 있도록 세팅해줍니다.

VScode 실행 후 아래 빨간 표시에서 Flutter를 검색 후 설치해줍니다.

그 후 이제 command Palette 를 실행하여 flutter를 진단해봅니다.

Command Palette는 View -> Command Palette 클릭 
or 

Ctrl + Shift + P

명령어가 나타나면 flutter 라고 검색해볼까요 ?

그럼 여러 개의 명령어가 나올 텐데 거기서 Run Flutter Doctor를 눌러줍니다!

 

그러면...!!!

짜잔!!! 여러 항목의 V자 표시가 되어있다면 완료된 겁니다 :)

허

나 여러분은 저처럼 안 나올 겁니다. 저는 미리 세팅을 해놓은 거라서,,

자여기서부터 차근차근 하나씩 다시 확인해봅니다. 

 

1. Flutter Ok <- 설치되었으므로 통과

2. Android toolchain <- 안드로이드 SDK 사용 동의가 되지 않은 경우,

   이경우에는 flutter doctor --android-license 명령어를 실행해주시면 됩니다. 

   위 사진의 TEMINAL을 눌러서 쳐주시면 됩니다 :)

3. Chrome - OK

4. Android Studio OK <- 설치하였으므로

5. VS Code OK <- 지금 사용 중이니..

6. Connected device : 이건 연결하면 되므로 PASS

 

 

이로써 모든 준비는 끝났습니다!
이제 VSCODE에서 프로젝트를 생성하고  코딩하면 완벽...!

혹시 Doctor 중 문제가 있거나 해결이 안 된다면 댓글을 남겨주시면

해결방법을 최대한 알려드릴게요 :)