Flutter - TVMaze Jobsity

Overview

Flutter - TVMaze Jobsity

App Challenge for Jobsity Interview Process.

An App for listing TV Series, using the API provided by the TVMaze Website.

You can find the API here.

The current Features Available on the App are listed below:

  • List All Series contained in the API used by the paging scheme provided by the API.
  • Users can to Search Series by Name.
  • After clicking on a Series, the App shows the details of th Series.
  • After clicking on an episode, the App shows episode’s information.
  • User can save a series as favorite.
  • User can delete a series from the favorite list.
  • User can browse their favorite series in alphabetical order, and click to see its details.

App Overview

Show Details Episode Details
Search Show by Name Favorites List
Search People by Name People Details

Table of Contents


How to run this project

A few resources to get you started if this is your first Flutter project:

For help getting started with Flutter, the link above offers tutorials, samples, guidance on mobile development, and a full API reference.

FVM

The project uses FVM (Flutter Version Management).

  • FVM Documentation Available here.

Commands to run the project

  • Check if you are using → Flutter Version: 2.10.3

  • To run the project using the Flutter global SDK installed on your machine, go to .vscode/settings.json and comment out all the content. This will remove the VSCode configuration responsible for prioritizing the Flutter SDK installed by FVM and will therefore use the SDK installed on your machine.

  • Otherwise, if you want to use FVM, follow the instructions in the documentation.

  • Commands:

flutter pub get
flutter run

Project Structure Overview

Gitflow

I used Gitflow as a strategy to manage branches.

The project structure is quite simple. The main folders are the assets, lib and test folders. The lib folder is where all the code is written and the assets folder is where we put our images, icons and other related files.

project-structure


Architecture Overview

The main architectural concept used in the App was Clean Architecture. A multi-layer architecture that facilitates unit testing and helps us with separation of responsibilities. Another objective of this architecture is to facilitate the scalability of the App with new features.

The functions of each layer are described in the following sections below.

Dependency Injection

The project uses the get_it package to facilitate the organization of dependency injection. Control is done by the injection container.

Design Patterns

The project makes use of some Design Patterns such as:

  • Singleton and Factory - Creational Patterns
  • Adapter and Decorator - Structural Patterns
  • Strategy - Behavioral Pattern

SOLID Principles

Other good practices present in the project are Clean Code for more descriptive nomenclature and the SOLID principles.

Domain Layer

Here is where we can find our Entities and UseCases. This is the core of our architecture, the entities define the objects of our system and the usecases are the actions the application is supposed to perform.

Data Layer

In this layer we have the implementation of our UseCases and the creation of our Models or DTOs (Data Transfer Objects) to translate the external data to our entities. We also have interfaces that define how we should implement http or cache adapters.

Infra Layer

In the Infra layer, we have the implementation of our services. It is the layer responsible for creating the decoupling point between our system and external dependencies.

Presentation Layer

Our Presentation Layer contains the Controllers for our view. Controllers or Presenters are responsible for the Presentation Logic.

UI Layer

The UI layer is where our screens and visual components will be. In the case of Flutter, this is where we will have our Widgets.

The Architecture Diagram is available below:

architecture-diagram


Exception Structure Overview

The exception schema was designed to work following the principles of clean architecture, where we should treat exceptions as alternative system flows. The exception structure diagram is available below:

exception-diagram


You might also like...

Challenge yourself every weekend with flutter. Join me to implement challenging UI & digital designs using Flutter.

Challenge yourself every weekend with flutter. Join me to implement challenging UI & digital designs using Flutter.

Weekend With Flutter This is my new challenge. Every weekend, I want to implement challenging UI & digital designs using Flutter. you can join me with

Feb 24, 2022

Let's create a complete Flutter User Profile Page with SharedPreferences to persist the user's information in Flutter.

Let's create a complete Flutter User Profile Page with SharedPreferences to persist the user's information in Flutter.

Flutter Tutorial - User Profile & SharedPreferences Let's create a complete Flutter User Profile Page with SharedPreferences to persist the user's inf

Dec 3, 2022

Let's create a Flutter Collapsible Sidebar Menu that can collapse and expand the Navigation Drawer in Flutter.

Let's create a Flutter Collapsible Sidebar Menu that can collapse and expand the Navigation Drawer in Flutter.

Flutter Tutorial - Collapsible Sidebar Menu & Navigation Drawer Let's create a Flutter Collapsible Sidebar Menu that can collapse and expand the Navig

Jan 3, 2023

🚗 Apple CarPlay for Flutter Apps. Aims to make it safe to use apps made with Flutter in the car by integrating with CarPlay.

🚗 Apple CarPlay for Flutter Apps. Aims to make it safe to use apps made with Flutter in the car by integrating with CarPlay.

CarPlay with Flutter 🚗 Flutter Apps now on Apple CarPlay! flutter_carplay aims to make it safe to use iPhone apps made with Flutter in the car by int

Dec 26, 2022

Flutter ui boilerplate is easiest way to create new flutter project with clean code and well organized file folder.

Flutter ui boilerplate is easiest way to create new flutter project with clean code and well organized file folder.

Flutter UI Boilerplate "Sharing for fun" Flutter ui boilerplate is easiest way to create new flutter project with clean code and well organized file f

Dec 1, 2022

This is a Flutter app which shows how to use the PageView Class in your Flutter App

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

Oct 25, 2021

Flutter Architecture Blueprints is a project that introduces MVVM architecture and project structure approaches to developing Flutter apps.

Flutter Architecture Blueprints is a project that introduces MVVM architecture and project structure approaches to developing Flutter apps.

Flutter Architecture Blueprints Flutter Architecture Blueprints is a project that introduces MVVM architecture and project structure approaches to dev

Apr 9, 2022

Flutter Viral News App using : Flutter + Rest Api + Bloc / Cubit

Flutter Viral News App using : Flutter + Rest Api + Bloc / Cubit

Intro Viral News App on Flutter. The tech used: Flutter widgets + Flutter Bloc / Cubit + Rest Api Check the screenshot : P.S Make sure to upgrade your

Nov 2, 2022
Owner
Will Cavenagli
Hi, I'm a software engineer, currently working with Flutter 🐦!
Will Cavenagli
ABC of Flutter widgets. Intended for super beginners at Flutter. Play with 35+ examples in DartPad directly and get familiar with various basic widgets in Flutter

Basic Widgets Examples This is aimed for complete beginners in Flutter, to get them acquainted with the various basic widgets in Flutter. Run this pro

Pooja Bhaumik 815 Jan 3, 2023
Minha primeira aplicação android utilizando Flutter feito no curso de Flutter da Cod3r Cursos Online. O foco dessa aplicação foi um contato inicial com o Flutter.

expenses Expenses é uma aplicação android simples feita em Flutter para controlar despesas pessoais. A aplicação consiste em: Listar transações feitas

Guilherme Teixeira Ais 2 Apr 19, 2022
Flutter Github Following Application, Using Flutter Provider and Flutter HTTP to get data from Github API.

Flutter Github Following Application Watch it on Youtube Previous Designs Checkout my Youtube channel Installation Please remember, after cloning this

Mohammad Rahmani 110 Dec 23, 2022
Flutter RSS feed parsing - A demo application of flutter which parse RSS XML contents to the flutter application

Flutter RSS feed parsing demo This is demo application of flutter which shows ho

Nyakuri Levite 3 Nov 15, 2022
Boris Gautier 1 Jan 31, 2022
Code for Flutter Talk from Flutter Vikings 2022: Custom User Interactions in Flutter

Custom User Interactions - Flutter Vikings 2022 A companion app for the Flutter Vikings 2022 talk - Custom User Interactions with Shortcuts, Intents,

Justin McCandless 9 Sep 16, 2022
Create a Flutter User Profile Page UI where you can access and edit your user's information within your Flutter app.

Flutter Tutorial - User Profile Page UI 1/2 Create a Flutter User Profile Page UI where you can access and edit your user's information within your Fl

Johannes Milke 46 Dec 6, 2022
Create a Flutter User Profile Page UI where you can access and edit your user's information within your Flutter app.

Flutter Tutorial - User Profile Page UI #2 Create a Flutter User Profile Page UI where you can access and edit your user's information within your Flu

Johannes Milke 45 Dec 15, 2022
Let's create a selectable Flutter Navigation Drawer with routing that highlights the current item within the Flutter Sidebar Menu.

Flutter Tutorial - Sidebar Menu & Selectable Navigation Drawer Let's create a selectable Flutter Navigation Drawer with routing that highlights the cu

Johannes Milke 12 Dec 26, 2022
Components that optimize Flutter fluency.(Flutter 流畅度优化的通用方案,轻松解决卡顿问题)

Flutter fluency optimization component "Keframe" Page switching fluency improved: How to use Project depend on: Quick learning Constructor Description

Ke Technologies 793 Dec 30, 2022