counter_app_with_provider

State Management in Flutter with Provider!

Hello there, fellow Flutter adventurers! 👋

This repository contains the source code for the tutorial State Management in Flutter with Provider! published on Medium. This code demonstrates how to manage state effectively in Flutter apps using the Provider package, making complex state management a breeze.

Table of Contents

• Overview
• Features
• Installation
• Usage
• Contributing
• License
• Contact

Overview

Managing state in a growing Flutter app can get out of hand if you're only using setState(). In this project, we explore how to use Provider to better manage state, making your app more scalable and maintainable.

This is the accompanying code for my article that walks you through setting up Provider step by step, from beginner-friendly basics to advanced state management techniques.

Features

• Provider Package: The project implements Flutter's official state management solution.
• Easy to follow: Code is structured for easy understanding, with comments and documentation.
• Scalable: Example showcases how state management can scale for larger applications.

Installation

1. Clone the repository:

   git clone https://github.com/tech-ramakant/counter-app-with-provider.git

2. Navigate to the project directory:

   cd counter-app-with-provider

3. Install the dependencies:

   flutter pub get

4. Run the app:

   flutter run

Usage

Explore the code in the lib/ folder to see how the Provider package is used to manage state efficiently. You can follow along with the steps in the Medium tutorial.

Example of a state management pattern:

class CounterModel extends ChangeNotifier {
  int _counter = 0;

  int get counter => _counter;

  void increment() {
    _counter++;
    notifyListeners();
  }
}

class CounterScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return ChangeNotifierProvider(
      create: (_) => CounterModel(),
      child: Scaffold(
        appBar: AppBar(title: Text('Counter App')),
        body: Center(
          child: Consumer<CounterModel>(
            builder: (context, model, child) => Text('Counter: ${model.counter}'),
          ),
        ),
        floatingActionButton: FloatingActionButton(
          onPressed: () => context.read<CounterModel>().increment(),
          child: Icon(Icons.add),
        ),
      ),
    );
  }
}

Contributing

Feel free to open issues or make pull requests to improve this project. Contributions are always welcome!

Fork the repo

• Create your branch: git checkout -b my-new-feature
• Commit your changes: git commit -am 'Add some feature'
• Push to the branch: git push origin my-new-feature
• Submit a pull request

License

This project is licensed under the MIT License - see the LICENSE file for details.

Contact

For any inquiries, feel free to reach out to me via:

• Email: [email protected]
• Medium: @tech.ramakant
• LinkedIn: @tech-ramakant
• YouTube: @Tech.Ramakant