flutter-scalable-app

Scaffold Flutter apps with clean architecture, BLoC, and Firebase integration.

Updated Aug 27, 2026
One-click install
npx skills add https://github.com/GomezFabricio/ChangaYa --skill flutter-scalable-app
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: flutter-scalable-app
Source: https://github.com/GomezFabricio/ChangaYa/tree/main/skills/flutter-scalable-app
Command: npx skills add https://github.com/GomezFabricio/ChangaYa --skill flutter-scalable-app

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill provides a framework for building production-grade Flutter apps using clean architecture, flutter_bloc, auto_route, get_it + injectable, and Firebase integration. It enables translating Stitch design tokens into Flutter UI, scaffolding robust project structure, and implementing scalable state management.

Core Features & Use Cases

  • Scaffolding a new Flutter project with clean architecture
  • Translating Stitch / Figma designs into production Flutter screens
  • Implementing BLoC or Cubit state management
  • Setting up auto_route navigation with guards and deep links
  • Wiring dependency injection with get_it + injectable
  • Integrating Firebase (Auth, Firestore, Storage, Functions)
  • Managing environment variables with flutter_dotenv
  • Optimizing Flutter performance (jank, rebuild audits, memory)

Quick Start

Create a production Flutter screen from a Stitch design, wiring DI, navigation, and Firebase services to production-ready code.

Frequently Asked Questions about flutter-scalable-app

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I structure a Flutter app with clean architecture for scalability?

Structure a scalable Flutter app by applying clean architecture with flutter_bloc for state management, get_it and injectable for dependency injection, and auto_route for navigation. This separation ensures maintainable, production-grade code across mobile and web.

How do I wire Firebase services into a Flutter app using BLoC?

Wire Firebase services into a Flutter app using BLoC by integrating Auth, Firestore, Storage, and Functions through dependency injection. This approach routes data safely while enforcing scalable state management and clean architectural boundaries.

What's the best way to set up navigation and dependency injection in Flutter?

The best way to set up navigation and dependency injection in Flutter is using auto_route for route management with guards, combined with get_it and injectable. This enforces route-based data passing and ensures maintainable project scaffolding.

Can I translate Stitch or Figma design tokens into Flutter UI components?

Yes, you can translate Stitch or Figma design tokens directly into production-ready Flutter UI components. This process generates consistent screens while maintaining the structural integrity required by clean architecture.

How do I manage environment variables and optimize Flutter performance?

Manage environment variables in Flutter using flutter_dotenv to handle configurations. Optimize Flutter performance by conducting jank analysis, rebuild audits, and memory management to maintain smooth execution across mobile and web platforms.

Does this clean architecture approach require @freezed events and const constructors?

Yes, this clean architecture approach strictly enforces using @freezed for BLoC events and states alongside const constructors. These constraints guarantee immutability and compile-time safety for scalable Flutter applications.