본문 바로가기
Dart&Flutter

[Flutter] windows에서 Flutter 설치 방법 & 프로젝트 생성까지 비전공자도 쉽게 가능하게 상세한 설명

by 알기 쉬운 코딩 사전 2023. 8. 20.
반응형

Flutter을 사용하기 위해서는 다음과 같은 프로그램들이 필요합니다.

 

Flutter 사용을 위한 프로그램

  • Flutter SDK 설치
SDK란?
Software Development Kit의 약자로 개발자들이 개발을 하기 위해 필요한 문서, 라이브러리, 코드 등이 들어가 있는 개발 도구입니다.
  • Android Studio 설치
  • Visual Studio Code 설치
  • Visual Studio develop C++ 설치

 

Flutter SDK 설치

 

저는 Flutter 공식 홈페이지에서 설치하는 방법이 아닌 Chocolatey를 사용해 설치하겠습니다.

 

Chocolatey란?
SDK 파일을 다운로드하는 웹 사이트입니다. zip 파일을 직접 다운로드해 압축 해제하거나, path 등 환경 변수 설정을 해줄 필요가 없어 SDK 파일을 보다 편리하게 다운로드할 수 있습니다.

 

https://chocolatey.org/install#individual

 

Installing Chocolatey

Chocolatey is software management automation for Windows that wraps installers, executables, zips, and scripts into compiled packages. Chocolatey integrates w/SCCM, Puppet, Chef, etc. Chocolatey is trusted by businesses to manage software deployments.

chocolatey.org

 

1. 시작 메뉴에서 powershell을 관리자 권한으로 실행해 주세요.

 

 

2. Get-ExecutionPolicy 명령어를 입력해 주세요. 사진과 같은 안내문이 나타나지 않으면 Set-ExecutionPolicy AllSigned 혹은 Set-ExecutionPolicy Bypass -Scope Process 명령어를 입력해 주세요.

 

Get-ExecutionPolicy

Set-ExecutionPolicy AllSigned
 or 
Set-ExecutionPolicy Bypass -Scope Process

 

3. https://chocolatey.org/install#individual 에 접속해 해당 부분을 클릭해 주세요.

 

4. powershell에서 ctrl + v (붙여넣기)를 해주세요.

 

 

5. 다운로드가 완료되면 choco 명령어를 입력합니다.

 

choco

위 사진과 같이 나타나면 choco가 정상적으로 설치되었습니다.

 

6. choco install flutter 명령어를 입력합니다.

 

choco install flutter

 

7. y를 입력합니다.

 

 

8. choco list 명령어를 통해 확인해 봅니다.

 

choco list

 

Flutter SDK는 설치가 완료되었습니다.

 

Android Studio 설치

 

1. https://developer.android.com/studio 에 접속해 해당 부분을 클릭해 주세요.

 

 

2. 체크 박스 클릭 후 다운로드합니다.

 

3. 해당 파일 더블 클릭으로 실행합니다.

 

4. 해당 버튼 클릭합니다.

 

Next 클릭

 

Next 클릭

 

Next 클릭

Android Studio의 설치 파일 경로입니다. 직접 설정해 주어도 되고 기존 경로에 설치하여도 됩니다.

 

Install 클릭

 

설치 완료 후 Next 클릭

 

Finish 클릭

 

Android Studio 설치가 완료되었습니다.

 

Flutter 설치 중간 확인

 

설치 과정이 길다 보니 중간중간 CMD 창에서 해당 명령어를 통해 Flutter가 잘 설치되고 있는지를 확인해 보는 것이 좋습니다.

 

flutter doctor

 

X 표시 부분을 확인해 보면 Android SDK Tools 설치와 라이센스 등록을 해주라고 나와있습니다.

그리고 Visual Studio develop C++을 설치를 해야 한다고 나와있습니다.

차근차근 나머지를 진행해 보겠습니다.

 

Android Studio SDK tools 설치

 

1. New Project 버튼 클릭

 

2. No activity 클릭

 

3. Finish 버튼 클릭

 

4. 다운로드 완료 후 Finnish 버튼 클릭

 

5. 메뉴바 상단의 톱니바퀴 모양을 클릭해 줍니다. 그리고 Settings.. 버튼을 클릭해 줍니다.

 

6. SDK Tools 메뉴를 클릭 후 해당 부부의 네모 부분을 클릭합니다.

 

7. 다운로드 모양의 아이콘이 나타나면 클릭해 줍니다.

 

8. 설치가 완료되면 Finish 버튼을 누릅니다.

 

9. CMD 창으로 가서 해당 명령어를 입력해 줍니다.

flutter doctor --android-licenses
y

 

flutter doctor 명령어로 중간 확인을 해줍니다.

Android 관련 에러 메시지는 나타나지 않는 걸 확인할 수 있습니다.

 

Visual Studio Code 설치

1. 해당 홈페이지를 들어갑니다.

https://code.visualstudio.com/

 

Visual Studio Code - Code Editing. Redefined

Visual Studio Code is a code editor redefined and optimized for building and debugging modern web and cloud applications.  Visual Studio Code is free and available on your favorite platform - Linux, macOS, and Windows.

code.visualstudio.com

 

2. 해당 버튼을 클릭합니다.

 

3. 해당 프로그램이 다운로드 되면 실행시켜서 설치를 진행시켜줍니다.

 

4. 다음 버튼 클릭

 

5. 다음 버튼 클릭

 

6. 다음 버튼 클릭

 

7. 다음 버튼 클릭

 

8. 설치 버튼 클릭

 

9. 다운로드 완료 후 종료 버튼 클릭

 

 

visual studio code 설치가 완료되었습니다.

 

flutter doctor 명령어로 중간 확인을 해줍니다.

X 표시 부분을 확인해 보면 Visual Studio develop C++을 설치 해야 한다고 나와있습니다.

 

Visual Studio develop C++ 설치

 

1. 해당 홈페이지를 들어갑니다.

https://visualstudio.microsoft.com/ko/downloads/

 

Visual Studio Tools 다운로드 - Windows, Mac, Linux용 무료 설치

Visual Studio IDE 또는 VS Code를 무료로 다운로드하세요. Windows 또는 Mac에서 Visual Studio Professional 또는 Enterprise Edition을 사용해 보세요.

visualstudio.microsoft.com

 

2. 해당 버튼을 클릭합니다.

 

3. 해당 프로그램이 다운로드 되면 실행시켜서 설치를 진행시켜줍니다.

 

4. 해당 버튼 클릭합니다.

 

계속 버튼 클릭

 

5. c++를 사용한 데스크톱 개발 부분을 선택해 주시고 설치 버튼을 눌러줍니다.

 

6. 설치가 완료될 때까지 기다립니다.

 

Visual Studio develop C++ 설치가 완료되었습니다.

 

flutter doctor 명령어로 중간 확인을 해줍니다.

No issues found! 라고 나오는 걸 확인하면 설치가 완료되었습니다.

 

플러터를 위한 모든 프로그램은 설치가 완료되었습니다. 그러면 Flutter 프로젝트를 하나 생성해 보겠습니다.

 

Visual Studio Code Dart & Flutter extension 설치

 

1. 해당 버튼을 클릭합니다.

 

2. 빨간 박스 안에 dart와 flutter을 검색 후 해당 파일을 install 해줍니다.

Visual Studio Code Dart & Flutter extension 설치는 완료되었습니다.

 

Flutter 프로젝트 생성

 

1. 메뉴에 view > Command Palette 클릭

 

2. flutter 입력 후 해당 버튼 클릭

 

3. 해당 버튼 클릭

 

4. 해당 프로젝트 경로를 지정해 줍니다.

 

5. 해당 프로젝트 이름을 설정해 줍니다. 바로 엔터를 치셔도 됩니다.

 

6. 프로젝트가 정상적으로 생성되는 것을 확인할 수 있습니다.

 

마무리

설치 과정이 조금은 복잡하지만 생략하는 부분 없이 최대한 자세히 설명해두었습니다. 혹시 설치하다가 설치가 제대로 되지 않는다거나 모르시는 부분이 있으시면 댓글 남겨주시면 제가 최대한 모든 댓글 답변해 드리겠습니다. 감사합니다.

반응형

댓글