Flutter Shopping App With Provider and Hive

This is a Flutter Shopping app with Provider and Hive local storage for android and iOS. We will build a beautiful online store app for iOS and Android. It covers beautiful animation and scrolling. And at the end in part 2 we work with backend.

This tutorial covers awesome animation ui design with local storage. By the end of this tutorial you will master, how to use provider and hive.

Provider would be for state management and Hive would be local storage.

Navigation

For routing we have used flutter native navigation. We have extensively used the following

1. Navigator.of()
2. Navigator.push()

Provider

Providers Since this is a online shopping store app, we will use ChangeNotifierProvider with three classes to maintain our app state. These three classes would be wrapped in MultiProvider. So you will master how to add, remove and save data using ChangeNotifierProvider.

Since we have many providers, we used MultiProviders to inject them at the root of our widget tree.

Hive

Since this tutorial focuses on local storage using Hive, we have used Hive for the following features

1. add items cart
2. remove items from cart
3. favourite items add in cart
4. remove favourite items from cart

Get the complete code and assets from here (complete front end )

Get the complete code with restful api and stripe payment (complete restful api)

Restful api code features

custom login

authentication

search product

place order

Part 1 starter code to follow along

Part 2 assets to follow along

Installation guide

Opening json files in postman

Issues

# FavouritesNotifier

Some of the fans were not able to follow with FavouritesNotifier with Provider. The code was missing the tutorial. Let's take a look at the code.

import 'package:flutter/material.dart';

class FavoritesNotifier extends ChangeNotifier {
  List<dynamic> _ids = [];
  List<dynamic> _favorites = [];

  List<dynamic> get ids => _ids;

  set ids(List<dynamic> newIds) {
    _ids = newIds;
    notifyListeners();
  }


   List<dynamic> get favorites => _favorites;

  set favorites(List<dynamic> newFav) {
    _favorites = newFav;
    notifyListeners();
  }
}

# Postman API data posting

You might have this issue in part 2 for data posting. To solve this do the below

Okay, so basically you need to go to the back and open the product schema, get all the keys from the product schema and those keys determines how many key, how many values does you need in post and then you can post. You can just add the information and then make a post.