A rewrite of Bloc tutorial: Flutter Weather Tutorial using freezed

Overview

freezed_weather

A rewrite of Bloc tutorial: Flutter Weather Tutorial using freezed.

  • Bloc was used instead of Cubit (Cubit vs Bloc)
    • Bloc provides better traceability of what's happening.
      • onTransition shows the event that triggers the new state
    • Bloc allows advanced event transformations
    • However, bloc requires more detailed implementation. freezed code generation could be used to reduce the amount of coding.
  • freezed was used instead of equatable to compare data models
    • A @freezed class comes with auto-generated copyWith implementation, which is not prone to human-made errors (e.g., forget to add a variable into prop list, which is the mistake I've made).

Notable changes from the original

@freezed data models

  • copyWith, == and toString implementation

  • Properties can be null

    Previously, Weather.empty is provided in initial WeatherState because equatable does not allow null in props. freezed handles null properly so we can just use null as weather in the state when weather is not available yet (e.g., in the initial state). Both work fine, it's only a matter of choice so empty is kept in lib/weather/models/weather.dart.

@freezed event & state for bloc

Persist only the loaded state

In the original tutorial, all states are cached. Imagine the scenario: When an error happens, the user terminates the app and reopens it. Guess what? The error state is served immediately!

The bloc is working properly but the user experience is not optimal. WeatherBloc.toJson is modified to only cache the successfully loaded state. When the user opens the app, it always shows that last loaded weather (or the initial state if nothing happens yet). Again, it's a matter of choice of when to cache the states.

You might also like...

Bloc Pattern based weather app.

flutter_weather_app A new Flutter project. Getting Started This project is a starting point for a Flutter application. A few resources to get you star

Dec 29, 2021

Flutter-nav-bottom-bar-tutorial - A flutter bottom navigation bar tutorial

Flutter-nav-bottom-bar-tutorial - A flutter bottom navigation bar tutorial

Flutter Bottom Navigation Bar Tutorial A tutorial with various Flutter bottom na

Oct 25, 2022

Flutter bloc cubit test knowdge - Flutter bloc cubit test knowdge

Flutter Bloc Simple Api This project is using weather api for featch data and di

Jan 3, 2022

Flutter bloc infinite list - A sample application to learn flutter bloc the correct way

flutter_bloc_infinite_list A sample application to learn flutter bloc the correc

Aug 22, 2022

Notes-bloc-flutter - Proyecto para administrar tareas implementando patrón bloc

notes_bloc A new Flutter project. Getting Started This project is a starting point for a Flutter application. A few resources to get you started if th

Jan 9, 2022

An extension to the bloc state management library which automatically persists and restores bloc states.

An extension to the bloc state management library which automatically persists and restores bloc states.

⚠️ Attention: This repository has been moved to https://github.com/felangel/bloc and is now read-only! An extension to the bloc state management libra

Nov 17, 2022

An example of "reactive/streaming repository" as a solution for BLoC to BLoC communication

An example of

Reactive Repositories An example of listening to a Stream from repository layer (instead of explicitly using get/fetch) as a solution for BLoC to BLoC

Jan 3, 2023

A News App in Flutter using the newsapi.org API and using Bloc.

A News App in Flutter using the newsapi.org API and using Bloc.

flutter_newsapp A News App using API from newsapi.org and using Bloc. Working ⚡ Screenshots == ⚡ video Before Running Replace the API_KEY in lib/r

Dec 9, 2022

Weather app created using Flutter and Dart

Weather app created using Flutter and Dart

FlutterWeather FlutterWeather A simple weather App created using Flutter and Dart and using API from OpenWeatherMap Features Automatically acquire use

Dec 30, 2022
Owner
Yu-Han Luo
Psychology and programming
Yu-Han Luo
Petrus Nguyễn Thái Học 193 Dec 29, 2022
Flutter Cryptocurrency App with Riverpod & Freezed + Dio for API REST

Flutter Crypto APP Complete Flutter Application with Riverpod & Freezed + Dio for API REST. Features API REST (CryptoWatch) Linear Graph View (Hour, D

Salvador Valverde 312 Jan 2, 2023
Complete Flutter Application with Riverpod & Freezed + Dio for API REST

Flutter Crypto APP Complete Flutter Application with Riverpod & Freezed + Dio fo

Xtenso 32 Dec 26, 2022
A Flutter Result type that feels like a Freezed union.

Freezed Result A Result<Success, Failure> that feels like a Freezed union. It represents the output of an action that can succeed or fail. It holds ei

Day Logger, Inc. 2 Nov 24, 2022
🎯 This library automatically generates object classes from JSON files that can be parsed by the freezed library.

The Most Powerful Way to Automatically Generate Model Objects from JSON Files ⚡ 1. Guide ?? 1.1. Features ?? 1.1.1. From 1.1.2. To 1.2. Getting Starte

KATO, Shinya / 加藤 真也 14 Nov 9, 2022
Weather app using Bloc architecture pattern & generic HTTP client with interface implementation and much more for more detail read Readme

weather Weather application for current weather, hourly forecast for 48 hours, Daily forecast for 7 days and national weather alerts. How to Run Insta

Jibran Ahmed SiddiQui 9 Oct 29, 2022
A weather app that allows the user to find out the live weather data of any city.

Clima ☁ My Goal My objective of completing this project was to learn about asynchronous programming in Dart, how to carry out time consuming tasks suc

Ginny (Khue) Dang 1 May 6, 2022
A weather application and the location is hard-coded to fetch weather data from London.

Weather Application This project is a weather application and the location is hard-coded to fetch weather data from London. Regarding the state manage

André Nogueira 2 Jun 21, 2022
Weatrio App An Weather App to check the weather around the world!

Weatrio App An Weather App to check the weather around the world! View Demo · Documentation · Report Bug · Request Feature ?? Table of Contents About

Liron Abutbul 2 Sep 12, 2022
Flutter bloc example - An app for State management using BLoC pattern in Flutter

Flutter BLoC My first app for State management using BLoC pattern in Flutter Col

Harshil Patel 1 Jun 16, 2022