플러터는 개발자가 단일 코드베이스로 모바일, 웹 및 데스크톱용으로 네이티브 컴파일된 애플리케이션을 만들 수 있게 해주는 구글이 개발한 오픈소스 UI 소프트웨어 개발 툴킷입니다. 이는 앱을 한 번 작성하면 여러 플랫폼에서 실행할 수 있어 iOS 및 Android용 개별 코드베이스를 유지 관리할 필요가 없다는 것을 의미합니다.

플러터의 특징 중 하나는 사용자 인터페이스를 구축하기 위한 위젯 기반 접근 방식입니다. 플러터에서는 모든 것이 위젯입니다. 버튼이든, 텍스트 필드든, 전체 화면이든 모두 위젯입니다. 이러한 위젯 중심 철학은 개발 프로세스를 단순화하고 매우 유연하게 만듭니다.

위젯은 단순한 빌딩 블록이 아니라 매우 조합 가능하고 사용자 정의가 가능합니다. 위젯을 복잡한 구조를 만들기 위해 조립할 수 있는 레고 블록이라고 생각할 수 있습니다. 이러한 조합 가능성 덕분에 시각적으로 매력적일 뿐만 아니라 매우 효율적이고 재사용 가능한 UI를 구축할 수 있습니다.

위젯 트리

플러터의 위젯 기반 접근 방식을 더 잘 이해하기 위해 위젯 트리 개념을 살펴보겠습니다. 플러터에서 앱의 UI는 위젯 트리로 표현됩니다. 이 트리의 루트에는 앱의 진입점 역할을 하는 MaterialApp 위젯이 있습니다. 거기서부터 위젯을 서로 안에 중첩하여 원하는 UI 계층 구조를 만들 수 있습니다.

트리의 각 위젯은 특정 목적과 동작 및 모양을 정의하는 속성을 가지고 있습니다. 예를 들어, Text 위젯은 텍스트를 표시하고, Container 위젯은 레이아웃 및 스타일링을 제공하며, Image 위젯은 이미지를 표시합니다. 이러한 위젯을 계층적으로 구성하여 복잡한 UI를 만들 수 있습니다.

핫 리로드: 개발자의 꿈

플러터의 가장 사랑받는 기능 중 하나는 “핫 리로드” 기능입니다. 코드를 변경하고 그 변경 사항이 앱에 거의 즉시 반영되는 것을 상상해 보세요. 그것이 바로 핫 리로드의 마법입니다.

핫 리로드를 통해 개발자는 UI 디자인 및 기능을 빠르게 반복하고 실험할 수 있습니다. 이는 코드 변경 사항이 앱에 전파될 때까지 기다리는 시간을 크게 줄여 생산성을 높이는 게임 체인저입니다. 핫 리로드를 사용하면 UI를 미세 조정하고 결과를 실시간으로 볼 수 있어 개발 프로세스가 놀랍도록 효율적입니다.

Dart 프로그래밍 언어

플러터의 힘을 활용하려면 Dart 프로그래밍 언어에 익숙해져야 합니다. Dart는 플러터 개발을 위한 선택 언어이며, 프레임워크의 성공에 중추적인 역할을 합니다.

Dart는 단순성과 가독성으로 잘 알려져 있습니다. 다른 프로그래밍 배경을 가지고 있더라도 쉽게 배울 수 있는 언어입니다. Dart의 문법은 깔끔하고 간결하여 작업하기에 즐겁습니다.

또한 Dart는 정적 타입 언어로, 컴파일 시 오류를 감지할 수 있어 코드를 작성할 때 안전망을 제공합니다. 이는 런타임 오류를 방지하여 앱을 더 견고하고 안정적으로 만드는 데 도움이 됩니다.

플러터를 선택해야 하는 이유?

플러터의 몇 가지 기본 측면을 다루었으므로 앱 개발 프로젝트에 플러터를 선택해야 하는 이유가 궁금할 것입니다. 몇 가지 설득력 있는 이유를 살펴보겠습니다.

단일 코드베이스, 여러 플랫폼: 플러터의 “한 번 작성하고 어디서든 실행” 철학은 코드 재사용을 극대화하여 더 빠른 개발과 쉬운 유지 관리를 가능하게 합니다.
아름답고 사용자 정의 가능한 UI: 플러터의 위젯 기반 접근 방식은 경쟁 앱과 차별화될 수 있는 멋지고 고도로 맞춤화된 사용자 인터페이스를 만들 수 있도록 지원합니다.
핫 리로드로 생산성 향상: 핫 리로드를 통해 실시간으로 변경 사항을 볼 수 있어 개발 속도를 크게 높여 생산성을 향상시킵니다.
강력한 커뮤니티 및 생태계: 플러터는 끊임없이 확장되는 패키지 및 플러그인 생태계에 기여하는 활발한 개발자 커뮤니티를 가지고 있습니다.
성능 및 속도: 플러터 앱은 높은 성능과 부드러운 애니메이션으로 잘 알려져 있어 사용자에게 즐거운 경험을 제공합니다.
빠르게 성장하는 채택: 구글, 알리바바, 텐센트 등 많은 유명 기업들이 앱에 플러터를 채택하여 업계 전반의 수용을 입증하고 있습니다.
오픈소스 및 무료: 플러터는 오픈소스이며 무료로 사용할 수 있어 모든 배경의 개발자가 접근할 수 있습니다.

개발 환경 설정

Flutter는 Windows, macOS 및 Linux와 호환됩니다. 최소 2GB의 여유 공간을 권장합니다. 최소 8GB의 RAM을 사용하는 것이 좋습니다.

Flutter 설치

이제 시스템에 Flutter를 설치하는 과정을 진행해 보겠습니다. 다음 단계를 따라 시작하십시오.

Flutter 다운로드: 공식 Flutter 웹사이트(https://flutter.dev)를 방문하여 “시작하기(Get Started)” 섹션으로 이동하십시오. 여기에서 다양한 운영 체제용 다운로드 링크를 찾을 수 있습니다. 플랫폼에 맞는 Flutter SDK를 다운로드하십시오.
ZIP 아카이브 압축 해제: 다운로드가 완료되면 ZIP 아카이브를 시스템의 한 위치에 압축 해제하십시오. 이곳이 Flutter 설치 디렉토리가 됩니다.
Flutter를 PATH에 추가: 터미널에서 Flutter 명령을 실행하려면 Flutter 바이너리 디렉토리를 시스템의 PATH에 추가해야 합니다. 터미널을 열고 다음 명령을 실행하십시오. 여기서 [FLUTTER_DIRECTORY]를 Flutter 설치 디렉토리의 실제 경로로 바꾸십시오.

export PATH="$PATH:[FLUTTER_DIRECTORY]/flutter/bin"

1
2

export PATH="$PATH:[FLUTTER_DIRECTORY]/flutter/bin"

이 줄을 셸 구성 파일(예: .bashrc 또는 .zshrc)에 추가하여 변경 사항을 영구적으로 만들 수도 있습니다.
flutter doctor 실행: 터미널에서 flutter doctor 명령을 실행하십시오. 이 명령은 시스템에서 누락된 종속성이나 해결해야 할 문제를 확인합니다.

flutter doctor

1
2

flutter doctor

누락된 구성 요소나 종속성을 설치하려면 프롬프트에 따라 진행하십시오. Flutter가 과정을 안내할 것입니다.
Android Studio (선택 사항): Flutter로 Android 앱을 개발할 계획이라면 Android Studio 설치를 고려하십시오. Android 앱 개발을 위한 편리한 통합 개발 환경(IDE)을 제공합니다.

편집기 설정

올바른 코드 편집기 또는 통합 개발 환경(IDE)을 선택하는 것은 Flutter 여정에서 중요한 결정입니다. Flutter는 편집기에 구애받지 않으며 다양한 편집기와 함께 사용할 수 있지만, 두 가지 인기 있는 선택은 Visual Studio Code와 Android Studio입니다.

Visual Studio Code

Visual Studio Code(VS Code)는 Flutter 개발자들 사이에서 매우 인기 있는 가볍고 오픈소스 코드 편집기입니다. 설정 방법은 다음과 같습니다.

Visual Studio Code 설치: 아직 설치하지 않았다면 공식 웹사이트(https://code.visualstudio.com/)에서 Visual Studio Code를 다운로드하여 설치하십시오.
Flutter 및 Dart 확장 설치: VS Code를 열고 확장(Extensions) 마켓플레이스로 이동하십시오. Dart Code 팀에서 제공하는 “Flutter” 및 “Dart” 확장을 검색하십시오. Flutter 개발 경험을 향상시키기 위해 두 확장을 모두 설치하십시오.
새 Flutter 프로젝트 생성: VS Code와 확장이 설치된 상태에서 통합 터미널을 사용하여 새 Flutter 프로젝트를 쉽게 만들 수 있습니다. flutter create 명령 다음에 프로젝트 이름을 사용하여 시작하십시오.

Android Studio (선택 사항)

더 통합된 개발 환경을 선호한다면 Flutter 개발용으로 Android Studio를 선택할 수 있습니다. 설정 방법은 다음과 같습니다.

Android Studio 설치: 공식 웹사이트(https://developer.android.com/studio)에서 Android Studio를 다운로드하여 설치하십시오.
Flutter 및 Dart 플러그인 설치: Android Studio를 열고 “환경설정(Preferences)”(macOS) 또는 “설정(Settings)”(Windows/Linux)으로 이동하십시오. “플러그인(Plugins)” 섹션에서 “Flutter” 및 “Dart” 플러그인을 검색하십시오. 두 플러그인을 모두 설치하십시오.
새 Flutter 프로젝트 생성: Android Studio는 새 Flutter 프로젝트를 쉽게 만들 수 있도록 합니다. “새 프로젝트(New Project)” 마법사를 사용하고 프로젝트 유형으로 “Flutter”를 선택한 다음 프롬프트에 따라 프로젝트를 생성하십시오.