넘치게 채우기

1장. 플러터 프로젝트 생성하고 실행해보기 본문

개발/Flutter + Dart

1장. 플러터 프로젝트 생성하고 실행해보기

riveroverflow 2023. 6. 21. 22:43
728x90
반응형

Flutter와 Android Studio와 Android Simulator는 아래 링크를 참고하여 세팅해주세요 :

https://flutter.dev/get-started

https://developer.android.com/studio/index.html

 

플러터 프로젝트 생성하기

vscode에서 명령 팔레트에서 Flutter: New Project 명령을 이용하여 새로운 프로젝트를 만들 수 있습니다

또는, 터미널에서 앱을 만들려는 위치에서 앱을 생성할 수 있습니다

#cd를 이용하여 원하는 경로로 이동하세요
flutter create (원하는 프로젝트 이름)
cd (프로젝트 이름)
flutter pub get

 

플러터 프로젝트 구조

플러터의 프로젝트를 만들면 위와 같은 디렉터리가 생성됩니다.

  • .dart_tool : Dart2부터 생겼으며, 패키지 의존성 관리 도구인 pub 또는 패키지 관리 도구를 저장합니다. 도구에 의해 자동으로 생성되고 관리되어 직접 건드릴 필요는 없습니다.
  • .idea : JetBrains IDE에서 쓰이는 프로젝트 설정 파일들이 위치합니다. 이 역시 건드릴 필요는 없습니다.
  • android, ios, linux, macos, windows, web : 각 플랫폼에서 플러터가 네이티브 코드를 실행하고 생성할 수 있도록 합니다. 각 플랫폼에 특정한 기능이나 설정이 필요한 경우 건드릴 필요가 있습니다.
  • lib : Dart코드의 파일이 위치하는 폴더입니다. 대부분의 개발 작업이 이루어집니다.

       → main.dart : 프로젝트의 진입점입니다. 반드시 존재해야하는 파일이며, main()메서드를 포함해야합니다.

 

  • test : 테스트 코드 파일이 위치하는 폴더입니다. flutter test 명령을 통해 실행할 수 있습니다.
  • .gitignore : git 버전 관리 시스템에서 무시해야 하는 파일 및 폴더를 정의할 수 있습니다. (버전 관리가 필요없는 파일을 제외 가능)
  • .metadata : 프로젝트의 메타데이터와 관련된 정보를 저장합니다. 프레임워크가 자동으로 관리해서, 건드릴 필요 없는 파일입니다.
  • analysis_options.yaml : 코드 스타일, 경고 및 오류, 분석 규칙 등을 정의할 수 있습니다. 건드리지 않는 편이 좋습니다.
  • (프로젝트명).iml : JetBrains IDE에 필요한 설정 관리 파일입니다.
  • pubspec.yaml : 프로젝트의 의존성과 리소스를 정의하는 파일입니다.
  • pubspec.lock : 프로젝트 의존성 충돌을 막기 위해 자동 생성되는 파일입니다.

 

 

처음으로 앱 실행해보기

우선, vscode의 맨 아래에서 시뮬레이터를 선택할 수 있습니다.

원하는 시뮬레이터를 고르시면 됩니다. Android Simulator에서도 기기를 고르실 수 있습니다.

 

터미널에 flutter run을 통해, 또는 vscode나 android simulator에서 실행버튼을 통해서 앱을 실행할 수 있습니다.

 

아래는 앱을 실행한 모습입니다. 플러터에서 프로젝트를 새로 생성할 때, 기본적으로 제공하는

‘Counter App’ 입니다. 우측 하단에 +버튼을 누르면, 가운데의 숫자가 올라갑니다.

플러터의 ‘Hello World!’와 같은 앱이라고 할 수 있습니다.

 
728x90
반응형