Skip to content

belenyb/eshop

Repository files navigation

Eshop: A Flutter E-Commerce App

An online shopping app connected to a public API.

App Logo

Overview

This Flutter app is an e-commerce application that enables users to browse and shop for products from the FakeStore API. The app features a user authentication system, product listings, a shopping cart, and various UI elements to enhance the user experience.

Installation

  1. Clone the repository:

    git clone https://github.com/belenyb/eshop.git
    
  2. Navigate to the project directory:

     cd eshop
    
  3. Install dependencies:

     flutter pub get
    
  4. Run the app:

     flutter run
    

Features

Splash Screen

The splash screen uses a Stateful Widget and AnimatedBuilder to create a loading effect.

Splash screen

Login

User authentication is implemented via the FakeStore API login service. Form validation is included.

Test credentials:
username: "johnd"
password: "m38rmF$"

Login screen

Home

The home screen starts with a featured product randomly selected using the getFeaturedProduct() function inside the app_provider.dart file. This function utilizes a random number generator from the dart:math library. Featured products use hero animation for a smooth transition between screens. The main page also contains a categories filter and a short list of products that can be expanded by clicking on the SEE ALL button.

Home screen

Profile drawer

By clicking on the profile icon in the app bar, users can access the profile drawer. This information is also obtained from the public API.

Profile drawer

Product detail

The screen includes additional product information and provides an "Add to Cart" functionality. When the user adds an item to the cart, a View Cart button is provided as a shortcut. This screen also includes rating stars using the flutter_rating_bar package.

Product screen

Cart

Add, remove, update, or empty all items using the provider package. The shopping cart employs the dismissible effect for easy item removal.

Cart screen

End of app

The conclusion of the app is marked by the presence of the Buy now button. At this point, you have the choice to either go back to the cart or start fresh by using the Restart button. This button clears all app data, giving you a clean slate for further testing.

End of app dialog

About

A Flutter e-commerce app

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published