Flutter 설치 (in Window)

Flutter를 설치하고 실행하기 위해서는 크게 4가지를 하면 된다.

1. Flutter SDK 다운로드
2. Android Studio 설치
3. 환경변수 등록
4. 나머지 설정

---

Flutter 다운로드

https://flutter-ko.dev/get-started/install/windows

Choose your first type of app

여기로 들어가서 아래 스크린샷같이 최신 버전.zip 파일을 다운로드 받는다(window 운영체제가 아니면 다른 방식으로)

zip 파일을 원하는 위치에 압축 해제한다. 이때, D 드라이브 이런데 넣지말고 꼭 C 드라이브 안에 넣어야 한다. (D드라이브에 넣으면 에러나서 다시 설치함..)

그리고, 이 flutter를 압축 해제한 폴더 위치는 나중에 설정할 때 쓰이므로 꼭 기억해 놓는다.

Android Studio 설치

https://developer.android.com/studio/?hl=ko

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

여기로 들어가서 왼쪽에 보면 있는 "Android 스튜디오 Koala 다운로드" 클릭, 쭉 내려서 동의하고 다운로드 받으면 된다.

 

다운로드 받은 install 파일을 쭉 실행해서 설치를 완료하면 다음과 같은 창이 뜬다. 여기서, 왼쪽 메뉴의 Plugins에 들어가서 dart와 flutter를 입력해서 찾고 둘 다 install 하여 설치한다. (아래 그림의 체크되어 있는 부분 각 1개씩)

 

설치를 완료하면 왼쪽의 Project 탭을 눌러서 다시 맨 처음으로 돌아간다. 그 후 사진과 같이  "More Actions"를 클릭하거나 오른쪽 위의 점 3개로 되어 있는 버튼을 눌러서 SDK Manager를 실행시킨다. 그 후 SDK Tools를 누르고, Android SDK Command-line Tools(latest)를 체크하고 왼쪽 아래로 가서 apply를 누른다. 그 후 설치가 완료되면 나간다.

 

환경변수 설정

1. 왼쪽 하단의 검색 창에서 "스스템 환경 변수 편집"을 검색하여 실행시킨다.
2. 그 뒤 "고급" 탭에서 맨 밑에 있는 "환경 변수(N)..." 버튼을 클릭한다.
3. 환경 변수 창에서 Path를 클릭한 뒤 "편집(E)" 버튼을 누른다.
4. 환경 변수 편집창에서 오른쪽 맨 위에 있는 "새로 만들기(N)" 버튼을 눌러 새로 만들고, 해당 칸에 이전에 Flutter를 압축 해제 했던 폴더에서 바로 안에 있는 bin 폴더의 경로를 적는다. (나는 C에 바로 설치하여서 bin 폴더의 경로가 C:\flutter\bin 이다)
5. 저장하고 나온다.

 

나머지 설정

일단 대부분 있겠지만 크롬이 깔려 있어야 한다.

그리고, 위 환경 설정이 바로 반영이 안되는 경우가 있다. 그럴 때는 컴터를 껐다 키면 되는데, 뉴비들은 에러가 뜨면 환경설정이 안된 것인지 모르므로 걍 환경 설정하고 컴터 껐다 키자.

 

크롬이 깔려 있다는 전제 하에 윈도우 왼쪽 밑에 검색 창에서 PowerShell을 검색하여 실행한다.

그 뒤 바로 flutter doctor를 쳐서 실행시켜 본다. 문제가 없으면 다 초록색 체크 표시가 뜬다. 노란색 경고 표시는 상관 없다. 그런데 빨간색 에러가 뜨면 제대로 설치가 안된 것이니 해결을 해야한다.  

---

설치 확인용 실행

설치 확인을 위해서 flutter project를 실행해보고 text 하나를 띄워볼 것이다.

 

1. Android Studio 맨 처음 화면에 가서 new flutter project 버튼을 누른다.

2. 왼쪽 탭에서 Flutter를 누르고, 위의 Flutter SDK path 칸에 아까 전에 압축을 푼 flutter 경로를 넣는다. (밑의 사진이 아니라, 꼭 자신이 압축 풀어서 flutter 폴더가 있는 경로여야 함)

 

3. 만든 project가 실제로 존재할 위치를 지정해주고, project 이름을 설정해준다. 그리고, 딴건 다 건드릴 필요 없고, Platforms 칸에서 자신이 만든 project가 실행됬으면 하는 platform들을 다 체크해준다.(나는 그냥 안드로이드랑 iOS만)

 

4. 그러면 project가 생성될 것인데, 왼쪽에서 아래 화살표 모양으로 된 것을 클릭하고(아마 기본이 Andoid) Project로 바꿔주면 아래 사진의 왼쪽과 같은 것들이 보여진다. 이때, 우리가 실행할 main.dart는 lib 폴더 안에 있다.

 

5. main.dart 파일을 다 지우고 아래 코드 그대로 복사 붙여넣기 한다.

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}
class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Text('안녕')
    );
  }
}

 

6. 중앙 상단에서 휴대폰 모양으로 된 것을 클릭하고 Chrome(web)으로 바꿔준다.

 

7. 중앙에서 초록색 화살표 모양을 눌러서 실행시키면 크롬이 켜지고 아래 스크린샷같이 빨간 글씨가 나오면 잘 설치된 것

실행 결과