🎯

flutter-init

🎯Skill

from bear2u/my-skills

VibeIndex|
What it does

flutter-init skill from bear2u/my-skills

flutter-init

Installation

Install skill:
npx skills add https://github.com/bear2u/my-skills --skill flutter-init
10
Last UpdatedJan 9, 2026

Skill Details

SKILL.md

Use when user wants to create a new Flutter project (Todo/Habit/Note/Expense/Custom domain) with Clean Architecture, Riverpod 3.0, Drift, and modern Flutter stack

Overview

# Flutter Init Skill

도메인 기반 Flutter ν”„λ‘œμ νŠΈλ₯Ό μƒμ„±ν•˜κ³  ν˜„λŒ€μ μΈ μ•„ν‚€ν…μ²˜λ‘œ μžλ™ μ„€μ •ν•©λ‹ˆλ‹€.

Todo, Habit, Note, Expense λ˜λŠ” Custom 도메인을 μ„ νƒν•˜μ—¬ Clean Architecture 기반의 μ™„μ „ν•œ CRUD 앱을 μ¦‰μ‹œ 생성할 수 μžˆμŠ΅λ‹ˆλ‹€.

Quick Start

μŠ€ν‚¬ μ‹€ν–‰ μ‹œ λ‹€μŒ 정보λ₯Ό μž…λ ₯λ°›μŠ΅λ‹ˆλ‹€:

  • 폴더λͺ… (예: my_habit_app)
  • ν”„λ‘œμ νŠΈλͺ…/νŒ¨ν‚€μ§€λͺ… (예: habit_app)
  • 도메인 선택 (Todo/Habit/Note/Expense/Custom)
  • μŠ€νƒ 프리셋 (Minimal/Essential/Full Stack/Custom)

κ·Έ ν›„ μžλ™μœΌλ‘œ λ‹€μŒ 단계가 μ‹€ν–‰λ©λ‹ˆλ‹€:

```bash

# 1. ν”„λ‘œμ νŠΈ 생성 (Android/Kotlin, iOS/Swift)

flutter create --platforms android,ios --android-language kotlin --org com.example [폴더λͺ…]

# 2. νŒ¨ν‚€μ§€ μ„€μΉ˜

flutter pub get

# 3. 도메인별 Clean Architecture μ½”λ“œ μžλ™ 생성

# - domain/entities/[domain].dart (Freezed μ—”ν‹°ν‹°)

# - data/datasources/local/app_database.dart (Drift ν…Œμ΄λΈ”)

# - data/repositories/[domain]_repository_impl.dart (Repository κ΅¬ν˜„)

# - presentation/providers/[domain]_providers.dart (Riverpod 3.0)

# - presentation/screens/* (List/Detail/Form ν™”λ©΄)

# 4. μ½”λ“œ 생성 (Freezed, Drift, JSON Serializable)

dart run build_runner build --delete-conflicting-outputs

# 5. μ½”λ“œ 검증 및 였λ₯˜ μžλ™ μˆ˜μ • (ν•„μˆ˜)

flutter analyze

# 6. μ•± μ‹€ν–‰

flutter run

```

Task Instructions

IMPORTANT: 이 μŠ€ν‚¬μ€ λŒ€ν™”ν˜•μœΌλ‘œ μ§„ν–‰λ©λ‹ˆλ‹€.

Step 1: 도메인 및 ν”„λ‘œμ νŠΈ μ„€μ • 질문

λ¨Όμ € μ‚¬μš©μžμ—κ²Œ μ΄λ ‡κ²Œ λ¬Όμ–΄λ³΄μ„Έμš”:

"Flutter 앱을 μƒμ„±ν•©λ‹ˆλ‹€. λ‹€μŒ 정보λ₯Ό μ•Œλ €μ£Όμ„Έμš”:

1. 도메인(μ—”ν‹°ν‹°) 선택

μ–΄λ–€ λ„λ©”μΈμ˜ 앱을 λ§Œλ“œμ‹œκ² μŠ΅λ‹ˆκΉŒ?

A) Todo (ν•  일 관리)

  • ν•„λ“œ: title, description, isCompleted, createdAt, completedAt
  • κΈ°λŠ₯: CRUD, 필터링(전체/진행쀑/μ™„λ£Œ), μ²΄ν¬λ°•μŠ€ ν† κΈ€

B) Habit (μŠ΅κ΄€ 트래컀)

  • ν•„λ“œ: name, description, frequency(daily/weekly/monthly), streak, lastCompletedAt, goal, isActive
  • κΈ°λŠ₯: CRUD, 연속 기둝 좔적, λͺ©ν‘œ 달성λ₯ , μ™„λ£Œ 체크

C) Note (λ©”λͺ¨)

  • ν•„λ“œ: title, content, tags, isPinned, createdAt, updatedAt
  • κΈ°λŠ₯: CRUD, νƒœκ·Έ 필터링, κ³ μ • λ©”λͺ¨, 검색

D) Expense (μ§€μΆœ 관리)

  • ν•„λ“œ: amount, category, description, date, paymentMethod
  • κΈ°λŠ₯: CRUD, μΉ΄ν…Œκ³ λ¦¬λ³„ 집계, 월별 톡계, 필터링

E) Custom (직접 μ •μ˜)

  • μ—”ν‹°ν‹°λͺ…κ³Ό ν•„λ“œλ₯Ό 직접 μž…λ ₯

2. ν”„λ‘œμ νŠΈ 정보

  • 폴더λͺ…: ν”„λ‘œμ νŠΈλ₯Ό 생성할 폴더 이름 (κΈ°λ³Έκ°’: [도메인]_app, 예: habit_app)

- 이 폴더에 Flutter ν”„λ‘œμ νŠΈκ°€ μƒμ„±λ©λ‹ˆλ‹€

  • ν”„λ‘œμ νŠΈλͺ… (νŒ¨ν‚€μ§€λͺ…): Flutter νŒ¨ν‚€μ§€ 이름 (κΈ°λ³Έκ°’: 폴더λͺ…κ³Ό 동일)

- pubspec.yaml의 name ν•„λ“œμ— μ‚¬μš©λ©λ‹ˆλ‹€

- import 문에 μ‚¬μš©λ©λ‹ˆλ‹€ (예: package:habit_app/...)

  • 쑰직λͺ…: (κΈ°λ³Έκ°’: com.example)

- Android/iOS νŒ¨ν‚€μ§€ μ‹λ³„μžμ— μ‚¬μš©λ©λ‹ˆλ‹€ (예: com.example.habit_app)

3. μŠ€νƒ 프리셋 선택

λ‹€μŒ 쀑 ν•˜λ‚˜λ₯Ό μ„ νƒν•΄μ£Όμ„Έμš”:

A) Essential (ꢌμž₯)

  • βœ… GoRouter (νƒ€μž… μ•ˆμ „ν•œ λΌμš°νŒ…)
  • βœ… SharedPreferences (둜컬 μ„€μ • μ €μž₯)
  • βœ… FPDart (ν•¨μˆ˜ν˜• μ—λŸ¬ 핸듀링)
  • βœ… Google Fonts
  • βœ… FluentUI Icons
  • ❌ Auth μ‹œμŠ€ν…œ μ œμ™Έ
  • ❌ Responsive Utils μ œμ™Έ

B) Minimal (κ°€μž₯ λ‹¨μˆœ)

  • ❌ GoRouter (κΈ°λ³Έ Navigator μ‚¬μš©)
  • βœ… SharedPreferences
  • ❌ FPDart μ œμ™Έ
  • ❌ Google Fonts μ œμ™Έ
  • βœ… κΈ°λ³Έ FluentUI Icons
  • ❌ Auth μ‹œμŠ€ν…œ μ œμ™Έ
  • ❌ Responsive Utils μ œμ™Έ

C) Full Stack (λͺ¨λ“  κΈ°λŠ₯)

  • βœ… GoRouter
  • βœ… SharedPreferences
  • βœ… FPDart (ν•¨μˆ˜ν˜• μ—λŸ¬ 핸듀링)
  • βœ… Google Fonts
  • βœ… Responsive Utils
  • βœ… FluentUI Icons
  • βœ… Auth μ‹œμŠ€ν…œ (Login/Register) - 선택 도메인에 따라

D) Custom (직접 선택)

  • 각 κΈ°λŠ₯을 κ°œλ³„μ μœΌλ‘œ 선택

μ–΄λ–€ 도메인과 프리셋을 μ„ νƒν•˜μ‹œκ² μŠ΅λ‹ˆκΉŒ? (도메인: A/B/C/D/E, 프리셋: A/B/C/D)"

Step 2: Custom 선택 μ‹œ μΆ”κ°€ 질문

#### 2-1. Custom 도메인 (E) 선택 μ‹œ:

  1. μ—”ν‹°ν‹°λͺ…: μ—”ν‹°ν‹° 이름을 μž…λ ₯ν•˜μ„Έμš” (예: Task, Event, Book)
  2. ν•„λ“œ μ •μ˜: 각 ν•„λ“œλ₯Ό μž…λ ₯ν•˜μ„Έμš” (ν˜•μ‹: ν•„λ“œλͺ…:νƒ€μž…, 예: title:String, amount:double, isActive:bool)

- 지원 νƒ€μž…: String, int, double, bool, DateTime

- createdAt, updatedAt은 μžλ™ 좔가됨

  1. μ£Όμš” κΈ°λŠ₯: 필터링/μ •λ ¬ 기쀀이 될 ν•„λ“œλ₯Ό μ„ νƒν•˜μ„Έμš”

#### 2-2. Custom μŠ€νƒ 프리셋 (D) 선택 μ‹œ:

λ‹€μŒ μ§ˆλ¬Έλ“€μ„ 순차적으둜 ν•˜μ„Έμš”:

  1. λ„€λΉ„κ²Œμ΄μ…˜: GoRouterλ₯Ό μ‚¬μš©ν•˜μ‹œκ² μŠ΅λ‹ˆκΉŒ? (예/μ•„λ‹ˆμ˜€)
  2. μ—λŸ¬ 핸듀링: FPDartλ₯Ό μ‚¬μš©ν•˜μ‹œκ² μŠ΅λ‹ˆκΉŒ? (예/μ•„λ‹ˆμ˜€)
  3. UI: Google Fontsλ₯Ό μ‚¬μš©ν•˜μ‹œκ² μŠ΅λ‹ˆκΉŒ? (예/μ•„λ‹ˆμ˜€)
  4. λ°˜μ‘ν˜•: Responsive Utilsλ₯Ό ν¬ν•¨ν•˜μ‹œκ² μŠ΅λ‹ˆκΉŒ? (예/μ•„λ‹ˆμ˜€)
  5. 인증 μ‹œμŠ€ν…œ: Auth μ‹œμŠ€ν…œμ„ ν¬ν•¨ν•˜μ‹œκ² μŠ΅λ‹ˆκΉŒ? (예/μ•„λ‹ˆμ˜€)

Step 3: μ„ νƒλœ 도메인과 μŠ€νƒμ— 따라 ν”„λ‘œμ νŠΈ 생성

  1. Flutter ν”„λ‘œμ νŠΈ 생성:

- μ‚¬μš©μžκ°€ μ§€μ •ν•œ 폴더λͺ…μœΌλ‘œ ν”„λ‘œμ νŠΈ 생성

- λͺ…λ Ήμ–΄: flutter create --platforms android,ios --android-language kotlin --org [쑰직λͺ…] [폴더λͺ…]

- 예: flutter create --platforms android,ios --android-language kotlin --org com.example my_habit_app

- 폴더λͺ…κ³Ό ν”„λ‘œμ νŠΈλͺ…(νŒ¨ν‚€μ§€λͺ…)이 λ‹€λ₯Έ 경우, 생성 ν›„ pubspec.yaml의 name ν•„λ“œλ₯Ό μˆ˜μ •

  1. Kotlin DSL 확인 (μ΅œμ‹  FlutterλŠ” μžλ™μœΌλ‘œ Kotlin DSL μ‚¬μš©)
  2. μ„ νƒλœ νŒ¨ν‚€μ§€ μ„€μΉ˜: pubspec.yaml μ—…λ°μ΄νŠΈ ν›„ flutter pub get
  3. 폴더 ꡬ쑰 생성: Clean Architecture (core, data, domain, presentation)
  4. 도메인별 λ³΄μΌλŸ¬ν”Œλ ˆμ΄νŠΈ 생성:

A) Todo: title, description, isCompleted, createdAt, completedAt

- Repository: getTodos, createTodo, updateTodo, toggleCompletion, deleteTodo

- Providers: filteredTodosProvider (all/pending/completed)

- UI: TodoListScreen (필터링), TodoDetailScreen, TodoFormDialog

B) Habit: name, description, frequency, streak, lastCompletedAt, goal, isActive

- Repository: getHabits, createHabit, updateHabit, completeHabit, deleteHabit

- Providers: filteredHabitsProvider (active/inactive), habitStatsProvider

- UI: HabitListScreen (톡계), HabitDetailScreen, HabitFormDialog

C) Note: title, content, tags, isPinned, createdAt, updatedAt

- Repository: getNotes, createNote, updateNote, togglePin, deleteNote

- Providers: filteredNotesProvider (pinned/all/byTag), searchProvider

- UI: NoteListScreen (검색/νƒœκ·Έ), NoteDetailScreen, NoteFormDialog

D) Expense: amount, category, description, date, paymentMethod

- Repository: getExpenses, createExpense, updateExpense, deleteExpense

- Providers: expensesByCategory, monthlyStats, filteredExpenses

- UI: ExpenseListScreen (톡계), ExpenseDetailScreen, ExpenseFormDialog

E) Custom: μ‚¬μš©μž μ •μ˜ ν•„λ“œ

- Repository: κΈ°λ³Έ CRUD λ©”μ„œλ“œ

- Providers: κΈ°λ³Έ list provider

- UI: κΈ°λ³Έ List/Detail/Form ν™”λ©΄

  1. μ„€μ • 파일 생성 (λΌμš°νŒ…, μŠ€ν† λ¦¬μ§€, λ‹€κ΅­μ–΄ λ“±)
  2. μ½”λ“œ 생성: dart run build_runner build --delete-conflicting-outputs
  3. μ½”λ“œ 검증 및 였λ₯˜ μˆ˜μ •:

a. flutter analyze μ‹€ν–‰

b. 발견된 였λ₯˜ μˆ˜μ •:

- import 경둜 μˆ˜μ •: λͺ¨λ“  μƒλŒ€ 경둜λ₯Ό package: ν˜•μ‹μœΌλ‘œ λ³€κ²½

- 예: import '../../domain/entities/todo.dart'; β†’ import 'package:todo_app/domain/entities/todo.dart';

- νŒ¨ν‚€μ§€ μ˜μ‘΄μ„± 확인: λˆ„λ½λœ νŒ¨ν‚€μ§€ μΆ”κ°€ (예: shared_preferences)

- Riverpod 3.0 ν˜Έν™˜μ„±: StateNotifier β†’ Notifier, StateProvider β†’ NotifierProvider

- FluentUI μ•„μ΄μ½˜ 이름 확인: μ‘΄μž¬ν•˜μ§€ μ•ŠλŠ” μ•„μ΄μ½˜μ€ λŒ€μ²΄

- νƒ€μž… μ•ˆμ „μ„±: switch expression μ‚¬μš©, null safety μ€€μˆ˜

c. μž¬κ²€μ¦: λͺ¨λ“  error 레벨 였λ₯˜κ°€ 없을 λ•ŒκΉŒμ§€ 반볡

d. λͺ©ν‘œ: flutter analyze κ²°κ³Όκ°€ "0-1 issues found" (info 레벨만 ν—ˆμš©)

βœ… CRITICAL: 이 λ‹¨κ³„λŠ” ν•„μˆ˜μž…λ‹ˆλ‹€. λͺ¨λ“  errorλ₯Ό μ œκ±°ν•΄μ•Ό λ‹€μŒ λ‹¨κ³„λ‘œ μ§„ν–‰ν•  수 μžˆμŠ΅λ‹ˆλ‹€.

Step 4: μ΅œμ’… 검증 및 μ•ˆλ‚΄

βœ… CRITICAL: 이 λ‹¨κ³„λŠ” ν”„λ‘œμ νŠΈ μ™„λ£Œμ˜ ν•„μˆ˜ μ‘°κ±΄μž…λ‹ˆλ‹€.

  1. μ΅œμ’… 뢄석 μ‹€ν–‰:

```bash

flutter analyze

```

  1. 성곡 κΈ°μ€€:

- βœ… 성곡 μ˜ˆμ‹œ:

```

Analyzing todo_app...

No issues found!

```

λ˜λŠ”

```

Analyzing todo_app...

1 issue found. (ran in 2.3s)

info β€’ Prefer using lowerCamelCase for constant names β€’ lib/core/constants.dart:5:7 β€’ constant_identifier_names

```

- ❌ μ‹€νŒ¨ μ˜ˆμ‹œ (errorκ°€ 있으면 λ°˜λ“œμ‹œ μˆ˜μ •):

```

error β€’ Target of URI doesn't exist: 'package:...' β€’ lib/main.dart:5:8 β€’ uri_does_not_exist

error β€’ The getter 'xyz' isn't defined for the type 'ABC' β€’ lib/presentation/screens/home.dart:42:15

```

  1. 검증 κ²°κ³Ό μš”μ•½ (성곡 μ‹œ):

```

βœ… Flutter ν”„λ‘œμ νŠΈ 생성 μ™„λ£Œ!

βœ… μ½”λ“œ 생성 μ™„λ£Œ (Freezed, Drift, JSON Serializable)

βœ… Flutter analyze 톡과 (0-1 issues found, info 레벨만)

βœ… λͺ¨λ“  νŒ¨ν‚€μ§€ μ„€μΉ˜ μ™„λ£Œ

```

  1. ν”„λ‘œμ νŠΈ 정보 제곡:

- 폴더λͺ…: [μ‚¬μš©μž μž…λ ₯κ°’] (예: my_habit_app)

- ν”„λ‘œμ νŠΈλͺ… (νŒ¨ν‚€μ§€λͺ…): [μ‚¬μš©μž μž…λ ₯κ°’] (예: habit_app)

- 쑰직λͺ…: [μ‚¬μš©μž μž…λ ₯κ°’] (예: com.example)

- 도메인: [μ„ νƒλœ 도메인] (Todo/Habit/Note/Expense/Custom)

- μ„ νƒλœ μŠ€νƒ: [프리셋λͺ…] (GoRouter, Drift, FPDart λ“±)

- μ£Όμš” κΈ°λŠ₯: [도메인] CRUD, λ‹€κ΅­μ–΄ 지원, 둜컬 μ €μž₯μ†Œ λ“±

- μƒμ„±λœ 파일: XX개 Dart 파일 (core, data, domain, presentation)

  1. μ‹€ν–‰ 방법 μ•ˆλ‚΄:

```bash

cd [폴더λͺ…]

flutter run

```

  1. λ‹€μŒ 단계 μ œμ•ˆ (선택사항, 도메인별):

- Todo: ν•­λͺ© μΆ”κ°€/μˆ˜μ •/μ‚­μ œ, 필터링(전체/진행쀑/μ™„λ£Œ), μ™„λ£Œ ν† κΈ€

- Habit: μŠ΅κ΄€ 기둝, 연속 기둝 확인, λͺ©ν‘œ 달성λ₯ , 톡계 확인

- Note: λ©”λͺ¨ μž‘μ„±/νŽΈμ§‘, νƒœκ·Έ μΆ”κ°€, κ³ μ • λ©”λͺ¨, 검색

- Expense: μ§€μΆœ 기둝, μΉ΄ν…Œκ³ λ¦¬λ³„ 톡계, 월별 집계, 필터링

- 곡톡: μ–Έμ–΄ μ „ν™˜ (μ˜μ–΄ ↔ ν•œκ΅­μ–΄), 닀크/라이트 ν…Œλ§ˆ μ „ν™˜

Core Principles

  • Repository νŒ¨ν„΄: 데이터 λ ˆμ΄μ–΄μ™€ 도메인 λ ˆμ΄μ–΄ 뢄리
  • μ˜μ‘΄μ„± μ£Όμž…: Riverpod 3.xλ₯Ό ν†΅ν•œ μ˜μ‘΄μ„± 관리
  • λΆˆλ³€μ„±: Freezed둜 λΆˆλ³€ λͺ¨λΈ 생성
  • λ‹€κ΅­μ–΄ 지원: Easy Localization으둜 i18n
  • λͺ¨λ˜ UI: FluentUI Icons μ‚¬μš©

Reference Files

[references/setup-guide.md](references/setup-guide.md) - μ™„μ „ν•œ κ°€μ΄λ“œ

  • κΈ°λ³Έ μ…‹μ—… (도메인별 CRUD, λ‹€κ΅­μ–΄, FluentUI Icons)
  • 선택 μ˜΅μ…˜: GoRouter, Auth, FPDart, Google Fonts, Responsive Utils, νŒ¨ν‚€μ§€ μ—…λ°μ΄νŠΈ

Notes

  • λŒ€ν™”ν˜• μŠ€ν‚¬: μ‚¬μš©μžμ—κ²Œ 도메인과 프리셋 선택을 톡해 λ§žμΆ€ν˜• μ•± ꡬ성
  • 도메인 지원: Todo, Habit, Note, Expense, Custom (μ‚¬μš©μž μ •μ˜)
  • 프리셋 제곡: Full Stack, Essential, Minimal, Custom
  • 선택 κ°€λŠ₯ κΈ°λŠ₯: GoRouter, Auth, FPDart, Google Fonts, Responsive Utils
  • κΈ°λ³Έ 포함: Riverpod 3.x, Easy Localization, FluentUI Icons, Drift, Dio, SharedPreferences
  • λ‹€κ΅­μ–΄: μ˜μ–΄/ν•œκ΅­μ–΄ (ν™•μž₯ κ°€λŠ₯)
  • ν”Œλž«νΌ: Android/Kotlin, iOS/Swift (μ›Ή/μœˆλ„μš°/λ¦¬λˆ…μŠ€ μ œμ™Έ)
  • ν’ˆμ§ˆ 보증:

- λͺ¨λ“  ν”„λ‘œμ νŠΈλŠ” flutter analyze 톡과 ν•„μˆ˜

- package: imports μŠ€νƒ€μΌ μ€€μˆ˜

- νƒ€μž… μ•ˆμ „μ„± 보μž₯

- μ½”λ“œ 생성 μžλ™ν™”

- 도메인별 μ΅œμ ν™”λœ UI/UX

More from this repository10

🎯
메타-ν”„λ‘¬ν”„νŠΈ-μƒμ„±κΈ°πŸŽ―Skill

Generates structured, customizable slash commands for Claude Code, enabling quick and precise AI interactions tailored to specific project needs.

🎯
landing-page-guide-v2🎯Skill

Generates high-converting landing pages with exceptional design using Next.js 14+, ShadCN UI, and a proven 11-element conversion framework that creates memorable brand experiences.

🎯
code-changelog🎯Skill

Automatically documents AI code changes and provides real-time web-based visualization of code modifications.

🎯
prompt-enhancer🎯Skill

Analyzes project context to automatically expand simple user requests into detailed, comprehensive requirements for more precise AI interactions.

🎯
card-news-generator-v2🎯Skill

Generates Instagram-style card news series by creating visually appealing 600x600 cards with user-specified topic, colors, and optional background images.

🎯
gemini-logo-remover🎯Skill

Removes Gemini logos, watermarks, and AI-generated image markers using precise OpenCV inpainting techniques.

🎯
landing-page-guide🎯Skill

Generates comprehensive, conversion-optimized landing page design and content strategies with actionable recommendations for creating visually appealing and high-performing web pages.

🎯
design-prompt-generator-v2🎯Skill

Generates structured, high-quality design prompts for AI image generation by analyzing project context and design requirements.

🎯
nextjs15-init🎯Skill

Generates a fully configured Next.js 15 project with App Router, modern stack, and domain-specific structure in one interactive command.

🎯
codex-claude-loop🎯Skill

Orchestrates a dual-AI engineering workflow where Claude Code plans and implements while Codex validates and reviews code iteratively.