Flutter 튜토리얼 2편: 개발 환경 설치

Why#

NOTE

Flutter SDK를 설치하기 전에 운영체제별로 필요한 도구가 있습니다.
이 도구들이 없으면 설치 과정에서 오류가 발생합니다.

운영체제마다 필요한 것이 다릅니다:

• Windows: Git for Windows
• macOS: Xcode 명령줄 도구
• Linux: curl, git, unzip 등 패키지

왜 이런 도구들이 필요할까요?
Flutter SDK는 Git으로 관리되기 때문입니다.
또한 파일 압축 해제, 다운로드 등에 이 도구들을 사용합니다.

What#

NOTE

각 운영체제에서 Flutter가 의존하는 기본 도구들입니다.

운영체제	필수 도구	왜 필요한가?
Windows	Git for Windows	SDK 다운로드와 업데이트
macOS	Xcode CLI Tools	iOS 개발 도구
Linux	curl, git, unzip	다운로드와 압축 해제

How#

TIP

Windows 사용자

Git for Windows를 설치합니다.
Git 공식 사이트에서 다운로드하세요.
설치 시 기본 옵션을 그대로 유지하면 됩니다.

macOS 사용자

터미널을 열고 아래 명령어를 입력합니다:

1
xcode-select --install

팝업이 나타나면 “설치”를 클릭하세요.
몇 분 정도 걸립니다.

Linux 사용자

터미널에서 필수 패키지를 설치합니다:

1
sudo apt-get update
2
sudo apt-get install -y curl git unzip

Watch out#

WARNING

Windows 사용자 주의사항

Flutter를 C:\Program Files\ 같은 폴더에 설치하지 마세요.
이 폴더는 관리자 권한이 필요해서 문제가 생깁니다.

1
❌ C:\Program Files\flutter  → 문제 발생
2
✅ C:\src\flutter           → 권장
3
✅ C:\Users\사용자명\flutter  → 권장

왜 문제가 될까요?
Flutter는 파일을 자주 수정하는데, 관리자 권한 폴더에서는 매번 권한을 요청해야 합니다.

결론: 운영체제별 사전 요구사항을 먼저 설치해야 Flutter SDK 설치가 원활합니다.

Why#

NOTE

SDK를 직접 다운로드하고 환경 변수를 설정하는 것은 번거롭습니다.
초보자가 가장 많이 막히는 부분이 바로 환경 변수 설정입니다.

VS Code Flutter 확장을 사용하면 이 과정이 자동화됩니다.
버튼 몇 번 클릭으로 끝납니다.

What#

NOTE

VS Code의 Flutter 확장이 해주는 일:

1. Flutter SDK 다운로드
2. PATH 환경 변수 설정
3. 프로젝트 생성 도구 제공
4. 코드 자동완성과 디버깅 지원

이 모든 것이 자동으로 처리됩니다.

How#

TIP

1단계: VS Code 설치

VS Code 공식 사이트에서 다운로드합니다.
설치 파일을 실행하고 기본 옵션으로 설치합니다.

2단계: Flutter 확장 설치

1. VS Code를 실행합니다.
2. 왼쪽 사이드바에서 확장(네모 4개 아이콘)을 클릭합니다.
3. 검색창에 “Flutter”를 입력합니다.
4. “Flutter” 확장(Dart-Code 제작)을 설치합니다.

3단계: Flutter SDK 설치

1. Ctrl+Shift+P (macOS: Cmd+Shift+P)를 누릅니다.
2. “flutter”를 입력합니다.
3. Flutter: New Project를 선택합니다.
4. Download SDK를 선택합니다.
5. SDK를 설치할 폴더를 선택합니다.
6. 다운로드가 완료되면 Add SDK to PATH를 클릭합니다.

4단계: 확인

새 터미널을 열고 아래 명령어를 입력합니다:

1
flutter doctor

체크 표시가 나타나면 성공입니다!

Watch out#

WARNING

가장 흔한 실수: 터미널을 새로 열지 않는 것

SDK 설치 후에는 반드시 터미널을 새로 열어야 합니다.
기존 터미널은 새로 추가된 PATH를 모릅니다.

1
# 기존 터미널에서 실행
2
flutter: command not found  # 오류!
3

4
# 새 터미널에서 실행
5
Flutter 3.38.1  # 성공!

VS Code에서 터미널을 새로 열려면:
Ctrl+Shift+ (백틱) 또는 메뉴에서 “터미널 > 새 터미널”을 선택합니다.

결론: VS Code 확장을 사용하면 5분 내에 Flutter 개발 환경을 구축할 수 있습니다.

Why#

NOTE

VS Code를 사용하지 않거나 특정 Flutter 버전이 필요할 때 수동 설치를 합니다.

수동 설치가 필요한 경우:

• IntelliJ, Android Studio 등 다른 에디터 사용
• 특정 Flutter 버전 고정 필요
• CI/CD 환경에서 자동화 스크립트 작성

What#

NOTE

수동 설치 과정:

1
1. SDK 파일 다운로드
2
2. 압축 해제
3
3. PATH 환경 변수에 추가
4
4. 설치 확인

이 과정을 직접 해야 합니다.

How#

TIP

1단계: SDK 다운로드

Flutter SDK 아카이브에서 운영체제에 맞는 파일을 다운로드합니다.

2단계: 압축 해제

Windows (PowerShell)

1
# 다운로드한 파일을 develop 폴더에 압축 해제
2
Expand-Archive -Path flutter_windows.zip -Destination C:\src\

macOS

1
unzip flutter_macos.zip -d ~/develop/

Linux

1
tar -xf flutter_linux.tar.xz -C ~/develop/

3단계: PATH 환경 변수 설정

이 단계가 가장 중요합니다.

macOS/Linux

~/.zprofile (macOS) 또는 ~/.bashrc (Linux) 파일을 열고 아래 줄을 추가합니다:

1
export PATH="$HOME/develop/flutter/bin:$PATH"

변경사항을 적용합니다:

1
source ~/.zprofile   # macOS
2
source ~/.bashrc     # Linux

Windows

1. 시작 메뉴에서 “환경 변수” 검색
2. “시스템 환경 변수 편집” 클릭
3. “환경 변수” 버튼 클릭
4. “Path” 선택 → “편집” 클릭
5. “새로 만들기” → C:\src\flutter\bin 추가
6. 확인 클릭

4단계: 확인

새 터미널을 열고:

1
flutter --version

Watch out#

WARNING

흔한 실수: flutter/bin이 아닌 flutter만 추가하는 것

1
# ❌ 잘못된 설정
2
export PATH="$HOME/develop/flutter:$PATH"
3

4
# ✅ 올바른 설정 - bin 폴더까지 포함
5
export PATH="$HOME/develop/flutter/bin:$PATH"

bin 폴더 안에 실행 파일이 있기 때문입니다.

결론: 수동 설치는 더 많은 제어권을 제공하지만 PATH 설정에 주의가 필요합니다.

Why#

NOTE

Flutter는 정기적으로 새 버전을 출시합니다.
새 버전에는 버그 수정, 성능 개선, 새로운 기능이 포함됩니다.

업그레이드를 하지 않으면:

• 새로운 기능을 사용할 수 없습니다.
• 알려진 버그가 그대로 남아 있습니다.
• 보안 패치를 받지 못합니다.

What#

NOTE

Flutter에는 세 가지 채널이 있습니다:

채널	업데이트 주기	안정성	누가 사용?
stable	3개월	높음	프로덕션 앱 개발자
beta	1개월	중간	새 기능 테스트
main	매일	낮음	Flutter 기여자

대부분의 개발자는 stable 채널을 사용합니다.

How#

TIP

현재 버전 확인

1
flutter --version

SDK 업그레이드

1
flutter upgrade

이 명령어 하나로 현재 채널의 최신 버전으로 업데이트됩니다.

채널 변경 (필요한 경우만)

1
# 현재 채널 확인
2
flutter channel
3

4
# 채널 변경
5
flutter channel stable
6
flutter upgrade

Watch out#

WARNING

업그레이드 전 확인사항

메이저 버전 업그레이드(예: 3.0 → 4.0)에는 Breaking Changes²가 있을 수 있습니다.
기존 코드가 동작하지 않을 수 있다는 뜻입니다.

업그레이드 전에:

1. 현재 코드가 잘 동작하는지 확인
2. Flutter 릴리스 노트 확인
3. 업그레이드 후 테스트 실행

1
# 업그레이드 전
2
flutter test
3

4
# 업그레이드
5
flutter upgrade
6

7
# 업그레이드 후
8
flutter test

결론: 정기적인 업그레이드로 최신 기능과 보안 패치를 적용합니다.

Why#

NOTE

설치 과정에서 다양한 오류가 발생할 수 있습니다.
오류 메시지를 보고 당황하지 마세요.
대부분의 문제는 flutter doctor로 진단하고 해결할 수 있습니다.

What#

NOTE

flutter doctor는 Flutter 설치 상태를 점검합니다.

1
$ flutter doctor
2

3
Doctor summary:
4
[✓] Flutter (Channel stable, 3.38.1)
5
[✗] Android toolchain - develop for Android devices
6
[✓] Xcode - develop for iOS and macOS
7
[✓] Chrome - develop for the web
8
[✓] VS Code

• ✓ 체크 표시: 정상
• ✗ X 표시: 문제 있음 (해결 필요)
• ! 느낌표: 경고 (선택적 해결)

How#

TIP

상세 진단

1
flutter doctor -v

-v 옵션은 자세한 정보를 보여줍니다.
어디서 문제가 생겼는지 파악하기 좋습니다.

자주 발생하는 문제와 해결 방법

오류 메시지	원인	해결 방법
flutter: command not found	PATH 설정 안 됨	PATH에 flutter/bin 추가
cmdline-tools component is missing	Android 도구 누락	Android Studio SDK Manager에서 설치
Android 라이선스 문제	라이선스 미수락	flutter doctor --android-licenses 실행

Android 라이선스 수락

1
flutter doctor --android-licenses

모든 질문에 y를 입력합니다.

Watch out#

WARNING

macOS에서 네트워크 오류가 발생한다면?

SocketException: Send failed 같은 오류가 나타날 수 있습니다.

해결 방법:

1. 시스템 설정 열기
2. 개인 정보 보호 및 보안 → 로컬 네트워크
3. VS Code, 터미널에 권한 허용
4. 앱 재시작

Windows PowerShell 스크립트 오류가 발생한다면?

1
Set-ExecutionPolicy -ExecutionPolicy RemoteSigned -Scope CurrentUser

이 명령어로 스크립트 실행을 허용합니다.

결론: flutter doctor로 문제를 진단하고 단계별로 해결합니다.