Giter Site home page Giter Site logo

mcace007 / shop_app Goto Github PK

View Code? Open in Web Editor NEW
0.0 1.0 0.0 22.82 MB

Basic Shop App made with Flutter

Kotlin 0.20% Dart 99.80%
animation dart firebase firebase-auth firebase-realtime-database flutter flutter-apps http provider-state-management

shop_app's Introduction

Project Title

Basic Shop App made with Flutter

The Basic Shop App is a Flutter application designed to provide a seamless shopping experience for users. It leverages the Firebase API for authentication and uses the Firebase real-time database as its database solution. The app also employs the Provider package for state management, ensuring efficient and scalable management of the application state.

The app consists of three main pages, each catering to different functionalities:

  1. Product Overview Page: The first page of the app is the product overview page. It showcases all the available products in a visually appealing manner. Each product is displayed within a container, featuring an image, a favorite button for users to mark products as favorites, a title, and an "Add to Cart" button. The page also includes an app bar with a side drawer located at the leftmost corner. On the app bar, there is a popup menu button that provides options to filter and display all products or only the user's favorites. Adjacent to the popup menu button, there is a cart button displaying a badge indicating the number of items in the cart. Clicking on the cart button allows users to navigate to the cart page. The side drawer contains three buttons: "Home" for returning to the main product overview page, "Your Orders" to view previous orders, and "Log Out" to sign out from the app.

  2. Cart Page: The second page is the cart page, where users can review and manage the items they have added to their cart. Each cart item is presented with a product image, title, price, and quantity. Users can increase or decrease the quantity of items using dedicated buttons. At the bottom of the page, there is a container displaying the total price of the items in the cart. Additionally, an "Order Now" button is present, allowing users to proceed with their purchase. This button is disabled when the cart is empty, preventing users from placing an order without selecting any products.

  3. Your Orders Page: The third page is the "Your Orders" page, which offers users a comprehensive view of their previous orders. Each order is enclosed within a container, displaying the total price and the date and time when the order was placed. At the right-most corner of each order container, there is a down arrow or expand button. Clicking on this button reveals a detailed breakdown of the order, including the titles, prices, and quantities of the products associated with that particular order. This expandable view provides users with a convenient way to review their past purchases.

Overall, the Basic Shop App offers users a user-friendly interface with seamless navigation between the main product overview page, the cart page, and your orders page. The integration of Firebase API and Firebase real-time database ensures secure user authentication and reliable data storage, while the implementation of basic animations enhances the overall user experience. The use of Provider for state management allows for efficient and scalable management of the application state, ensuring smooth performance even with a growing number of users and products.

๐Ÿ“ธ Screenshots

The screenshots below are taken on an Android emulator.

1 2
3 4
5 6
7 8
9 10

shop_app's People

Contributors

mcace007 avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.