anibalbastiass/android.ob.foodapp

FoodApp Android app Challenge

Anibal Bastias Soto - @anibalbastiass

Hey everyone! 👋

This is my Github page. My name is Anibal and I'm a Android Engineer with 10 years of experience in different kinds of companies and products. I have participated in the development processes of multiple Android native apps and is well versed in Kotlin and Java, as well as Architecture patterns. I've worked for companies and start-ups from Chile, the USA, Canada, and Australia, and is used to interacting with distributed teams as well.

I've been working on Backend stuff with TypeScript, NodeJS, KoaJS, tons of testing using Jest, Mocha, Chai. I'm a passionate engineer loves to learn new things.

YouTube Streaming - Challenge live coding on Android App (August 18th, 2021)

Watch YouTube Video

Tech Stack

 

How to reach me?

android.ob.foodapp's Issues

Publish Release 1.0

Description

After finish the remaining features, this is the first release for show and have a MVP app.

Integrate Search Result Figma Design

Description

The main goal is integrate the current defined Figma Design to the Android app.

In this requeriment, we will define the following atoms, molecules and templates:

Template

• SearchResultTemplate: CollapsableToolbar(TitleText + MenuImageButton) + ResultItemView list into a RecyclerView
  

Atoms

• TitleText: Text portion with regular text + bold text
  

• MenuImageButton: Rounded ImageView + Ripple action button when is clicked
  

• FavoriteButton: Rounded button with On/Off state, Heart icon and fade effect
  
  

• TitleItemText: Defined design for title text in Result Item, Maximum 2 lines
  

• PriceItemText: Defined design for price text in Result Item, Maximum 1 line
  

• RateItemText: Defined design for rate text in Result Item + star icon, Maximum 1 line
  

• CategoryTab: Defined Category tab as design. Selected (Underline + Bold), Unselected (No Underline + Grey)
  
  

Molecules

• ResultItemView: ImageView + TitleItemText + PriceItemText + RateItemText + FavoriteButton + Rounded and Background defined into the card.

• 

• CategoryTabLayout: List of CategoryTab into a TabLayout View from Android, Maximum width, Scrollable.
  

Refine Unit Test and Coverage

Description

The main idea is check the Unit test coverage with Jacoco and publish the coverage throughout Coveralls library, for publish the badges in Readme.md file.

Integrate Edit Profile Figma Design

Description

The main goal is integrate the current defined Figma Design to the Android app.
In this requeriment, we will define the following atoms, molecules and templates:

Template

• ProfileTemplate: ProfileHeaderView + 3 x ProfileFieldEditText + PrimaryButton + SecundaryButton + Background
  

Atoms

• ProfileLabelText: Defined Text for Edit Profile text
  

• ProfileEmailText: Defined text for email address
  

• ProfileFieldEditText: Predefined edit text that accepts maximum 100 chars and begins writing in Capitalize mode, don't accepts blank values as validation mode, with default placeholder (grey color).
  

• PrimaryButton: Predefined button like as design with feedback action with Ripple animation with green color
  

• SecundaryButton: Predefined button like as design with feedback action with Ripple animation with red color
  

Molecules

• ProfileHeaderView: ImageView (With PlaceHolder if hasn't any image) + ProfileLabelText + ProfileEmailText
  

Implement Search Result Firestore Auth Action

Description

The main goal of this feature, is implementing some calls for interact with items from Search Result:

• Fetch profile data
• Load User image into ImageButton on Toolbar. When the user tap this, navigates to #4
• Fetch the results of Food items.
• Filter items by category
• Implement action for add/remove favorite item by userId.

Firestore

In the following link https://firebase.google.com/docs/firestore, we can learn fetch or update data into a realtime NoSQL database using Firestore cloud service.

Edge cases

• Show Progress bar when is loading the data and manage with MVI View States.
• Show a tiny progress bar when is updating the favorite item state into the result item.

Notes

• If it is necessary, think about some Paging Library implementation if the result search return a lot of elements, maybe for a release 2.0.

Build Architecture

Description

Build an Android project from scratch in Kotlin with the following definitions:

• App module: (Runnable app module)
  • Contains the features (SignIn, Search Result and Edit Profile)
  • Definitions of Dependency Injection with KodeIn
  • Define resources: Layouts, Drawables, Navigation, Menu, etc.
• Library/UiKit module: (Library module)
  • This library contains the UI widgets defined with Atomic Design and reuse in the app module
  • Define texts, edit texts, buttons, icons, cards, image buttons.
• Library/MVICore: (Library Module)
  • Base library for define the current reactive design pattern for call ViewModels into app module and separate the concerns from app module whether it will be necessary implement in future feature modules.
• buildSrc (Kotlin DSL module)
  • Needed module for build Gradle scripts with Kotlin

Note: For this time, I won't implement with Jetpack Compose the UI. This will be update for an Release 2.0

Implement Sign In Firebase Auth Action

Description

The main goal is authenticate throghout the SignIn layout #2 using the already created Firebase Auth service. This is the following registered users:

[email protected]
[email protected]
[email protected]
[email protected]
[email protected]

Password for each account is... password

Firebase Auth

In the following link https://firebase.google.com/docs/auth, we can learn how to authenticate with email/password credential throghout Firebase Auth.

Edge Cases

• The validation data (email and password) must be offline.
• The Sign In button will be enabled themself when the email and password has been typed correctly.
• After pressing the button, the entire view must locked until finished the Firebase Auth request, showing a Progress bar on the SignIn Button.
• If the device hasn't any Internet connection, show the proper error with a Toast or embeded message.
• When the app launch, check throghout Firebase Auth if any user is already logged, and navigate to #3, else show Sign In View.
• If the device hasn't Internet connection, the app should be follow the Firebase Auth response. If this hasn't any response or exception, it shouldn't open the app or show SignIn over again.

Implement Edit Profile Firestore Auth Action

Description

The main goal of this feature, is implementing some calls for interact with User Profile:

• Fetch profile data (Already fetched from Result Search View)
• Implement validation for name, city and bio fields (these must have non-blank values)
• Implement Save Profile button action.
• Implement SignOut button action.

Firestore

In the following link https://firebase.google.com/docs/firestore, we can learn fetch or update data into a realtime NoSQL database using Firestore cloud service.

Edge cases

• Implement Save Profile button action. First, showing a progress bar mainwhile is refresing this, and go back to Search Result View.
• Implement SignOut button action. First, after pressing this button, this should show a Alert Dialog for confirm the signout action and finally implement SignOut from #5 plus navigating to SignIn view, cleangin all stack navigation fragments.

Integrate Sign In Figma Design

Description

The main goal is integrate the current defined Figma Design to the Android app.

In this requeriment, we will define the following atoms, molecules and templates:

Template

• SignIn: LogoView + TitleText + BodyText + EmailEditText + PasswordText + PrimaryButton + Defined Color background

Atoms

• LogoText: FoodApp text with custom colors
  

• TitleText: Text portion with regular text + bold text
  

• BodyText: Regular text that accepts Unicode.
  

• EmailEditText: Predefined edit text that accepts email with design and proper validation
  

• PasswordEditText: Predefined edit text that accepts password with design and proper validation
  

• PrimaryButton: Predefined button like as design with feedback action with Ripple animation with green color
  

Molecules

• LogoView: ImageView + LogoText atoms
  

Implement Continuous Integration: Build, Unit Test, Detekt, Dokka

Description

The main goal of this feature is implementing the Github Actions scripts from scratch for setup:

• Build the app into Android SDK Docker instance,
• Running the unit tests
• Running Detekt (for check bad practices, code smells and code styles).
• Running Dokka for implement a isolated branch, only for documentation in Github pages, in develop-documentation branch

Implement Add/Remove Favorite in Search Result Firestore Action

Description

The main goal of this feature, is implementing some calls for add and remove favorite items in the user document and sync with the UI doing a match between result list and profile:

• Fetch result data and profile data, then join the data to check the favorite ones.
• Draw in the UI when the item is a favorite item by the user
• Implement add favorite and refresh the list.
• Implement remove favorite and refresh the list

Firestore

In the following link https://firebase.google.com/docs/firestore, we can learn to fetch or update data into a real-time NoSQL database using Firestore cloud service.

Edge cases

• Block the button for any ms when the user has pressed the favorite button.
• Make sure the correct feedback and sync with Profile and Result data.