Skip to content

tech-ramakant/counter_app_with_riverpod

Repository files navigation

Riverpod Counter App 🚀

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

Table of Contents

Introduction

Welcome to the Riverpod Counter App! This is a simple Flutter application demonstrating state management using Riverpod, an alternative to the popular Provider package for managing state in Flutter apps.

Features

  • 🛠 Built with Flutter and Riverpod.
  • 🚀 Simple counter functionality to demonstrate state management.
  • 👀 Clean separation of logic and UI using StateProvider and ConsumerWidget.

Getting Started

  1. Clone this repository:

    git clone https://github.com/tech-ramakant/counter_app_with_riverpod.git
    cd counter_app_with_riverpod
  2. Install the required dependencies:

    flutter pub get
  3. Run the app:

    flutter run

Dependencies

This app uses the following packages:

  • flutter_riverpod: The state management solution powering this app.
  • flutter: The core framework for building natively compiled applications for mobile, web, and desktop.

To add these dependencies, ensure you have the following in your pubspec.yaml:

dependencies:
  flutter:
    sdk: flutter
  flutter_riverpod: ^2.0.0

Code Overview

State Management The state is managed by Riverpod's StateProvider. This ensures that the app remains performant and easy to manage, regardless of its size and complexity.

Here’s a quick breakdown of the main components:

  1. counterProvider:
final counterProvider = StateProvider<int>((ref) => 0);

A simple state provider that initializes the counter to 0 and can be updated.

  1. ConsumerWidget:
class CounterApp extends ConsumerWidget {

The ConsumerWidget allows the UI to listen for changes in the counterProvider and update accordingly.

  1. UI Updates:
   final count = ref.watch(counterProvider);

This line allows the widget to reactively display the current state of the counter.

  1. Updating State:
   ref.read(counterProvider.notifier).state++;

This method increments the counter by updating the provider's state.

License

This project is licensed under the MIT License. Feel free to use, modify, and distribute as needed.

For more details, check out the LICENSE file.

Contribution Guidelines

Contributions are always welcome! If you'd like to contribute, feel free to submit a pull request or open an issue.

Contact

Thank you for checking out the repository! 🎉

About

No description, website, or topics provided.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published