A Flutter application that allows interacting with Pokemons, built using Clean Archtitecture structure and riverpod as state management.

Related tags

Templates pokedex
Overview

pokedex

Welcome to the Pokedex project!

Screenshot 2022-09-19 at 4 57 26 PM

Getting Started

Instructions to run:

  1. This project uses flutter version 3.0.3, Make sure you have that version installed or do flutter upgrade
  2. First do flutter pub get and then flutter run
  3. Since this project uses build_runner to generate mock files for test cases, you have to run flutter pub run build_runner build --delete-conflicting-outputs this first to run test cases
  4. To run test cases use flutter test

Designs:

You can access to the designs of the application from this link(https://www.figma.com/file/vP3TT058xIqpOv5zv7cUg9/Pokedex-Assessment?node-id=32%3A83).

Project Highlights:

  1. The project is structured using clean architecture
  2. Riverpod is user as state management
  3. Uni Test Cases are written
  4. Local database is used to store offline data
  5. Infinite scroll pagination is handled

Packages used:

  • State Management - flutter_riverpod: ^2.0.0-dev.9
  • To compare object - equatable: ^2.0.3
  • network - http: ^0.13.4
  • loader with shimmer effect - shimmer: ^2.0.0
  • for infinite scroll in all pokemons - infinite_scroll_pagination: ^3.2.0
  • To store values in local storage - shared_preferences: ^2.0.15

Project/ Screen flow:

  1. Splash Screen is shown while application is starting.

  2. All Pokemons Screen

  • All pokemons fetched from this API: https://pokeapi.co. Pagination is used since there are lots of Pokemons to be listed coming from API.
  • For Pokemon #001 -> id Bulbasaur -> name Grass, Poison -> from types field
  • For the image of a Pokemon this is used, sprites > other > official-artwork > front_default.
  • All Pokemons will be listed on this tab.
  • There is also a progress indicator while Pokemons are being fetched.
  1. Favourites
  • When a Pokemon is marked as favourite by clicking Mark as favourite button on the Pokemon details page, it should be shown on this tab.
  • The number of Pokemons marked as favourite, should be shown near the tab text as shown on designs. Pokemons that are marked as favourite should be persistent and the data can be stored on disk. So, after a Pokemon is marked as favourite, it should still be shown under Favourites tab even after application is closed and started again.
  • As, we always want to see the most up-to-date information (what API returns) of the Pokemons marked as favourite. We will use local database.
  1. Pokemon details page
  • Using SliverAppBar while implementing the app bar of this page.
  • In order to calculate BMI using this formula: weight / (height^2) without caring any units.
  • In order to calculate Avg. Power under Base stats, use this formula: (Hp + Attack + Defense + Special Attack + Special Defense + Speed) / 6
  • Remove from favourites button removes the related Pokemon from the list shown on Favourites tab.
You might also like...

Flutter plugin for interacting with Accessibility Service in Android.

flutter_accessibility_service a plugin for interacting with Accessibility Service in Android. Accessibility services are intended to assist users with

Dec 22, 2022

Flutter app for interacting with Tesla Android.

Tesla Android Flutter app for Tesla Android. Please refer to https://tesla-android.gapinski.eu for release notes, hardware requirements and the instal

Nov 25, 2022

Click - Interacting with svg in flutter

Click - Interacting with svg in flutter

click Interacting with svg in flutter Getting Started This project is a starting point for a Flutter application. A few resources to get you started i

Dec 20, 2022

Dart API Library for interacting with the TRON Network

Dart API Library for interacting with the TRON Network. Getting started In your

Dec 20, 2022

A powerful state machine for MobX management, that can be used in almost any application state.

A powerful state machine for MobX management, which can be used in almost any application state. It has 3 states - loading, success, error - and is pe

Oct 31, 2022

Starting template for a new Flutter project. Using clean architecture + Riverpod.

flutter_project_template_riverpod Installation Add Flutter to your machine Open this project folder with Terminal/CMD Ensure there's no cache/build le

Dec 27, 2022

An extension to the bloc state management library which lets you create State Machine using a declarative API

An extension to the bloc state management library which lets you create State Machine using a declarative API

Nov 28, 2022

This project follows the Reso Coder course for flutter test-driven-development with clean architecture and BloC state management for a random trivia simple app.

This project follows the Reso Coder course for flutter test-driven-development with clean architecture and BloC state management for a random trivia simple app.

Jan 5, 2022

State Persistence - Persist state across app launches. By default this library store state as a local JSON file called `data.json` in the applications data directory. Maintainer: @slightfoot

State Persistence Persist state across app launches. By default this library store state as a local JSON file called data.json in the applications dat

Sep 28, 2022
Owner
Creating the Best version of Myself,#Hack 19 winner,Flutter Developer,Explorer..
null
Shopify Tag and Product Management App using Flutter and Riverpod State Management

Myshopify App A Simple Flutter Application project to get List of Tags, Products and Product Details from shopify https://shopicruit.myshopify.com/adm

Idowu Tomiwa 5 Nov 12, 2022
Multiplayer tictactoe game made in Flutter with nodejs and socket.io and using riverpod for state management

TicTacToe Game A Multiplayer TicTacToe Game- Works on Android, iOS and Web. Features Create/Join Room Play Realtime Display Points Round & Game Winner

Utsav Ghimire 5 Oct 18, 2022
This is a practical guide to MVVM architecture in flutter with riverpod for state management.

flutter_mvvm This project is a practical guide to MVVM pattern in flutter with Riverpod. Install flutter Get your APIKEY from https://api.openweatherm

Augustine Victor 3 Jan 1, 2023
Riverpod University. App that shows my way of dealing with state management in Flutter.

Riverpod University A Flutter project that showcases Riverpod possibilities created with https://flutlab.io Realized thusfar: Counter, Light/Dark butt

:plotsklapps 5 Dec 18, 2022
A Dart SDK for interacting with a Minecraft server using the RCON protocol.

A Dart SDK for interacting with a Minecraft server using the RCON protocol. Package on pub.dev Features Provides an API to connect to, log in to, send

Aidan Lok 2 Oct 4, 2022
A Flutter boilerplate made by GeniusCrew BV and inspired to the Clean Architecture structure.

GeniusArchitecture This is a boilerplate project created in flutter using Provider, Firebase, Dio, and some fundamentals of Robert C Martin's Clean Ar

GeniusCrew 10 Dec 16, 2022
Riverpod Messages Listener: A message notification listener for apps build with Riverpod

Riverpod Messages Listener Hello all, this is the home page of riverpod_messages package, a message notification listener for apps build with Riverpod

Fabrizio Tognetto 4 Dec 8, 2022
clean architecture and clean code with flutter , with bloc and getx state managment .

example_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

Khaled ElTohamy 6 Aug 22, 2022
💻 Flutter clean architecture using the bloc & cubit library for state management

Egymation ?? · This application was developed using a well-defined and decoupled architecture, following TDD (test-driven programming) as a working me

Mohaned Zekry 3 Nov 21, 2022
This repo is an example of clean architecture using the GetX state-management solution.

GetX Clean Architecture A Flutter Clean Architecture Using GetX. This repo is forked from: https://github.com/phamdinhduc795397/flutter-getx-clean-arc

Md. Siam 78 Jan 3, 2023