Skip to content
| Marketplace
Sign in
Visual Studio Code>Other>flutter-archichitectureNew to Visual Studio Code? Get it now.
flutter-archichitecture

flutter-archichitecture

Jam Ali Hassan

|
128 installs
| (3) | Free
flutter clean structure include mvvm, mvc and NextWays archichitecture
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info


Flutter Architecture Generator

A Powerful VS Code Extension for Clean Flutter Architecture

📌 Overview

Flutter Architecture Generator is a VS Code extension that helps developers quickly scaffold Flutter projects with clean architecture patterns. It supports both NextWay Architecture and MVC patterns, providing pre-configured templates and essential dependencies.

🚀 Features

NextWay Architecture

Generate a complete Flutter project structure with:

lib/
  ├── main.dart
  ├── src/
  │   ├── common/
  │   │   ├── constants/
  │   │   ├── services/
  │   │   ├── utils/
  │   │   └── widgets/
  │   ├── core/
  │   ├── features/
  │   ├── router/
  │   └── theme/

MVVM Architecture

Create a modern MVVM structure with:

lib/
  ├── models/
  │   └── data_models/
  ├── views/
  │   ├── screens/
  │   └── widgets/
  ├── viewmodels/
  ├── services/
  │   ├── api/
  │   └── local/
  ├── utils/
  └── core/
      ├── constants/
      ├── theme/
      └── routes/

MVC Architecture

Create a clean MVC structure with:

lib/
  ├── controllers/
  ├── models/
  ├── views/
  ├── core/
  │   ├── constants/
  │   ├── theme/
  │   └── routes/
  └── data/
      ├── network/
      └── app_exceptions/

Feature Generator

Quickly scaffold new features with all necessary files:

lib/src/features/your_feature/
  ├── controllers/
  │   ├── your_feature_controller.dart
  │   └── your_feature_state.dart
  ├── models/
  ├── pages/
  └── repository/
      └── your_feature_repository.dart

🛠️ Tech Stack

Flutter Dart VS Code TypeScript

📦 Installation

  1. Open VS Code
  2. Go to Extensions (Ctrl+Shift+X)
  3. Search for "flutter-archichitecture" Or "NextWay Architecture"
  4. Click Install

Or install from VS Code Marketplace

🎯 Usage

  1. Open Command Palette (Ctrl+Shift+P)
  2. Choose your architecture or feature:
    • Type "Create NextWay's Architecture" for NextWay pattern
    • Type "Create MVVM Architecture" for MVVM pattern
    • Type "Create MVC Architecture" for MVC pattern
    • Type "Create Feature" to generate a new feature structure
  3. For feature generation:
    • Enter the feature name when prompted
    • The extension will create all necessary files with boilerplate code
  4. The extension will:
    • Create the folder structure
    • Generate boilerplate files
    • Add required dependencies
    • Set up state management
    • Configure routing (if applicable)

📚 Included Dependencies

dependencies:
  # UI & Styling
  google_fonts: ^6.2.1
  flutter_svg: ^2.0.10+1

  # State Management
  provider: ^6.1.2
  flutter_riverpod: ^2.0.0
  get: ^4.6.6

  # Navigation
  go_router: ^14.2.2

  # Networking
  dio: ^5.4.0

  # Utils
  device_preview: ^1.2.0
  image_picker: ^1.1.2
  loader_overlay: ^4.0.1
  fpdart: ^1.1.0

  # Storage
  shared_preferences: ^2.3.2

  # Firebase
  firebase_core: ^3.3.0

🤝 Contributing

Contributions are welcome! Feel free to:

  1. Fork the repository
  2. Create your feature branch
  3. Commit your changes
  4. Push to the branch
  5. Open a Pull Request

Made with ❤️ by Jam ali Hassan

💡 Key Benefits

  • Multiple Architecture Patterns: Choose between NextWay, MVVM, or MVC based on your project needs
  • Feature-First Development: Quickly scaffold new features with proper structure
  • Clean Architecture: Promotes separation of concerns and maintainable code
  • Boilerplate Reduction: Save time with pre-configured templates
  • Best Practices: Follows Flutter/Dart coding standards
  • State Management: Integrated solutions with Provider, Riverpod, and GetX
  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2025 Microsoft