[Flutter] Visual Studio Code에 개발환경 구축하기

Android Studio 가 익숙하지 않으신 분들은 VSCode 툴을 이용해서 Flutter를 개발하실 수 있습니다. 

Visual Studio Code가 Android Studio 보다는 구동이 가볍기 때문에, 환경에 맞는 툴을 이용하셔서 개발하는 것을 추천 드립니다. 

 

---

1. Extension 설치

Visual Studio Code를 실행한 다음, 좌측에 보시면 아래 모양의 아이콘을 클릭하시면 각종 Extension 들을 설치 하실 수 있습니다. 

 

 

Flutter Extension 설치

Flutter를 검색하셔서 설치 하시면 되며, Dart 언어도 같이 설치가 되기 때문에 Flutter 만 검색 하셔서 설치 하시면 됩니다. 

 

 

Rainbow Brackets 설치

Dart 언어의 특성상 브라켓이 많아 가독성을 조금이라도 늘리고 싶으면 Rainbow Brackets 라는 플러그인을 추천 합니다.

 

 

---

2. 프로젝트 만들기

Windows 환경의 경우 Ctrl + Shift + P 혹은 / View -> Command Palette 를 입력하시면, 아래와 같은 입력 창이 나타납니다.

 

해당 입력 창에서 flutter를 입력하시면, 상단에 새로운 프로젝트를 만들 수 있는 명령어가 보여집니다.

해당 명령어를 입력하시면 새로운 프로젝트를 생성 하실 수 있습니다.

 

프로젝트 명을 입력하시면, 아래와 같이 기본 템플릿이 생성되어 집니다.

 

 

디바이스 선택

CMD+SHIFT+P 입력 후 Flutter: Launch Emulator 를 입력하면, 안드로이드 디바이스를 선택할 수 있습니다.

Android Studio 에서 만드신 Emulator가 보이실 겁니다.

아니면, 요즘 PC에 많이들 설치하시는 설치형 에뮬레이터를 키고 진행하셔도 됩니다.

 

빌드

Run 메뉴에 가서 Start Debugging을 선택하시거나, F5 키를 누르시면, 선택하신 에뮬레이터로 빌드가 되는 모습을 보실 수 있습니다.