Flutter로 첫 앱 만들기: 프로젝트 생성부터 실행까지

안녕하세요. 지난 포스트에서는 IntelliJ 환경에서 Flutter와 Dart를 위한 플러그인 설치 및 Flutter SDK 설정을 통해 Flutter 개발 환경을 준비하는 방법에 대해 알아보았습니다. 이번 포스트에서는 이어서 첫 Flutter 프로젝트를 생성하고 실행하는 방법을 설명하겠습니다.

Flutter 프로젝트 생성하기

첫 번째 단계는 IntelliJ 환경에서 새로운 Flutter 프로젝트를 만드는 것입니다. 이 과정은 간단하니 아래 단계를 따라서 해봅시다.

1. IntelliJ IDEA를 실행한 후 상단 메뉴에서 'File' > 'New' > 'Project'를 선택합니다.
2. 새 프로젝트 화면에서 왼쪽에 있는 패널에서 'Flutter'를 선택합니다.
3. 'Flutter SDK path'란에 Flutter SDK가 설치된 경로를 입력합니다. 만약 이 경로를 모르신다면, 지난 포스트에서 Flutter SDK 설치 및 설정 방법을 확인하실 수 있습니다.

4. 프로젝트에 필요한 각 항목의 내용을 작성하고 선택합니다.

• Project name : 프로젝트의 이름을 입력합니다. 이 이름은 나중에 생성되는 폴더 이름과 앱의 이름으로 사용됩니다. Flutter 프로젝트의 이름은 모두 소문자로 이루어져야 하며, 단어 간에는 밑줄(_)을 사용해야 합니다. 예를 들어, 'flutter_start'와 같이 작성할 수 있습니다.
• Project location : 프로젝트 파일을 저장할 디렉토리를 선택합니다.
• Description : 프로젝트에 대한 간단한 설명을 입력합니다. 이 설명은 프로젝트를 관리하거나 다른 개발자와 협업할 때 유용하게 사용됩니다.
• Project type : 프로젝트의 유형을 선택합니다. 여기에서는 'Application'을 선택합니다. 이 옵션은 Flutter에서 제공하는 기본적인 앱 구조를 자동으로 생성해 줍니다.
• Language : 각 플랫폼(iOS, Android)에서 사용할 언어를 선택합니다. 기본적으로 iOS는 Swift, Android는 Kotlin을 사용하도록 설정되어 있습니다.
• Platforms : 프로젝트에서 지원할 플랫폼을 선택합니다. iOS, Android, Web, Linux, MacOS, Windows 등 다양한 플랫폼을 선택할 수 있습니다.
• Create project offline : 이 옵션은 인터넷 연결이 불안정하거나 없는 환경에서도 프로젝트를 생성하고 실행할 수 있도록 해줍니다. 단, 이 옵션을 선택하면 일부 Flutter 패키지를 사용할 수 없을 수 있습니다.

이렇게 모든 항목을 설정하였다면 'Create'를 클릭하여 프로젝트를 생성합니다. 이제 Flutter 프로젝트가 준비되었습니다!

반응형

Flutter 프로젝트 실행하기

Flutter 프로젝트를 실행하는 것은 간단합니다. 기본적으로 Flutter 프로젝트를 생성하면 샘플 앱인 '카운터 앱'이 생성됩니다. 이 앱은 버튼을 누를 때마다 숫자가 1씩 증가하는 매우 간단한 앱입니다. 이제 이 카운터 앱을 실행하고 어떻게 동작하는지 확인해 봅시다.

1. IntelliJ IDEA에서 방금 생성한 프로젝트를 열어봅니다.
2. 프로젝트 트리에서 'lib/main.dart' 파일을 찾습니다. 이 파일은 Flutter 앱의 시작점입니다.
3. 'main.dart' 파일을 열고, 상단 메뉴의 'Tools' > 'Android' > 'Device Manager'로 이동합니다. Device Manager에서는 이미 생성된 가상 디바이스를 선택하거나 새로운 가상 디바이스를 생성할 수 있습니다.

※ Android Emulator 가상화 오류 해결: 인텔 CPU VT 기술 활성화 방법

4. 이제 상단 메뉴에서 'Run' 버튼을 클릭하면 선택한 디바이스에서 Flutter 앱이 실행됩니다. 기본 앱이 실행되면, 화면 중앙에 "You have pushed the button this many times:"라는 텍스트와 '0'이라는 숫자, 그리고 하단 우측에 '+' 버튼이 나타납니다.

5. '+' 버튼을 누를 때마다 화면 중앙의 숫자가 1씩 증가하는 것을 확인할 수 있습니다. 이것이 바로 Flutter에서 제공하는 기본 카운터 앱의 기능입니다. 이를 통해 Flutter 앱이 어떻게 동작하는지 대략적으로 이해할 수 있습니다.

 

이렇게 Flutter 프로젝트를 생성하고 기본 카운터 앱을 실행해 보는 과정을 살펴보았습니다. 다음 포스트에서는 실제로 간단한 앱을 만들어 보며, Flutter 앱이 소스 코드 레벨에서 어떻게 동작하는지 자세히 알아보도록 하겠습니다.