Home/移动开发/flutter-development
F

flutter-development

by @aj-geddesv
4.8(11)

Builds beautiful cross-platform mobile applications using the Flutter framework, achieving efficient development and a consistent experience.

FlutterDart LanguageMobile UI/UXCross-Platform DevelopmentState Management (Flutter)GitHub
Installation
npx skills add aj-geddes/useful-ai-prompts --skill flutter-development
compare_arrows

Before / After Comparison

1
Before

Traditional native app development is costly, difficult to adapt to multiple platforms, and has long development cycles. UI interfaces are hard to unify, user experience is fragmented, and maintenance costs are high.

After

With Flutter and Dart, build multi-platform applications with a single codebase, achieving beautiful and consistent UI. Development efficiency is significantly improved, costs are reduced, and an excellent user experience is provided.

description SKILL.md


name: flutter-development description: > Build beautiful cross-platform mobile apps with Flutter and Dart. Covers widgets, state management with Provider/BLoC, navigation, API integration, and material design.

Flutter Development

Table of Contents

Overview

Create high-performance, visually stunning mobile applications using Flutter with Dart language. Master widget composition, state management patterns, navigation, and API integration.

When to Use

  • Building iOS and Android apps with native performance
  • Designing custom UIs with Flutter's widget system
  • Implementing complex animations and visual effects
  • Rapid app development with hot reload
  • Creating consistent UX across platforms

Quick Start

Minimal working example:

// pubspec.yaml
name: my_flutter_app
version: 1.0.0

dependencies:
  flutter:
    sdk: flutter
  provider: ^6.0.0
  http: ^1.1.0
  go_router: ^12.0.0

// main.dart with GoRouter navigation
import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp.router(
// ... (see reference guides for full implementation)

Reference Guides

Detailed implementations in the references/ directory:

GuideContents
Project Structure & NavigationProject Structure & Navigation
State Management with ProviderState Management with Provider
Screens with Provider IntegrationScreens with Provider Integration

Best Practices

✅ DO

  • Use widgets for every UI element
  • Implement proper state management
  • Use const constructors where possible
  • Dispose resources in state lifecycle
  • Test on multiple device sizes
  • Use meaningful widget names
  • Implement error handling
  • Use responsive design patterns
  • Test on both iOS and Android
  • Document custom widgets

❌ DON'T

  • Build entire screens in build() method
  • Use setState for complex state logic
  • Make network calls in build()
  • Ignore platform differences
  • Create overly nested widget trees
  • Hardcode strings
  • Ignore performance warnings
  • Skip testing
  • Forget to handle edge cases
  • Deploy without thorough testing

forumUser Reviews (0)

Write a Review

Effect
Usability
Docs
Compatibility

No reviews yet

Statistics

Installs316
Rating4.8 / 5.0
Version
Updated2026年3月16日
Comparisons1

User Rating

4.8(11)
5
0%
4
0%
3
0%
2
0%
1
0%

Rate this Skill

0.0

Compatible Platforms

🔧Claude Code
🔧OpenClaw
🔧OpenCode
🔧Codex
🔧Gemini CLI
🔧GitHub Copilot
🔧Amp
🔧Kimi CLI

Timeline

Created2026年3月16日
Last Updated2026年3月16日