yvan-ngoahitsi / hadwin-money-app Goto Github PK

prototype of a fund transfer app built with Flutter.

I wanted to make this app with flutter because I was interested in flutter developer roles. I figured out this payment interface is a fundamental and common fragment of almost every app, since almost every app requires some sort of payment/transaction interface to be present, be it a video streaming service like Netflix or Disney+ during signing up for subscription or a social networking platform like facebook or Instagram where an user needs to add their card details for promoting their content to reach more users. I wanted to build something that would cover demonstration of a wide range of skills required for an app developer, like - knowledge of architectural components & design patterns, state management/nested state management with provider, fetching data from servers to demonstrate proficiency with restful API to connect applications to back-end services, building a real time interface, using the Camera API, writing data to local files, custom navigation stack, complex animations, seamlessly incorporating third party packages, pixel-perfect implementation of UI designs (differs only because some improvisations I made), debugging, analysis skills & performance tuning and deployment to playstore.

1. Fund Transfer - mock simulation only, a transaction request is made to the server, the server is programmed to respond with 66.666% probability of successfully executing the transaction so as to simulate real world experirence (in the future this probability can increased to 75% or more).
2. Scan to Pay - mock simulation only, QR Code Scanner is programmed to only recognize QR Codes of HADWIN accounts.
3. Credit Card Validator and Storage - credit card details will be stored locally and not shared with the server, the validator is programmed to recognize cards belonging to American Express, VISA, MasterCard, Discover.
4. Real-Time username availability checker - part of sign up process.

NOTE: Since this is a prototype users cannot send or receive real money, or create real accounts, users need to login/register with test data provided here ➡️ https://github.com/brownboycodes/HADWIN/blob/master/docs/HADWIN_WIKI.md. Transaction and credit card data will be saved on the users device itself and not shared with the server.

Some custom system utilities built by me :-

1. custom tab navigation stack
2. custom keypad and input field for fund transfer screen
3. custom card flow widget
4. custom transaction receipt generator
5. error alerts
6. search and sort systems for filtering past transactions, contacts and business organiztions
7. local client-side databases

anything else   🙈

The flowchart below provides a brief overview of the activities that take place when the app is launched

If users want to test the QR code scanning feature of HADWIN, they are requested to go to https://fruitcastle.herokuapp.com/hadwin/v2/qr-code-interpretter/random to obtain a random QR code image.

Users are requested to rest assured as no personal data is being saved on the server and if they are still concerned about their privacy users are allowed to test the app with the mock data only.

FruitCastle (source code 💡) is a server created using Python and Flask, which hosts the data being used to create simulation for authorizing access to the features to the app and making transactions.

checkout the working demo for android devices :

HADWIN is yet to be released for iOS devices, anyone releasing an iOS app with the name or user interface same-as/similar-to HADWIN will be met with legal action.

1. Ensure you have flutter installed on your system (if not click here).

2. Fork the repository

3. clone the repository to your local machine

   git clone https://github.com/YOUR_GITHUB_USERNAME/HADWIN.git

4. open the cloned repository

   cd HADWIN

5. run the following command to install all required dependencies

   flutter pub get

6. create and switch to a new branch

   git checkout -b dev_your_github_username

7. now open your local copy of the repo in a coding terminal of your choice and explore 😊🎉

The tasks have been laid out in the format task_type (SCOPE): the_task and these tasks have been sorted in terms of their difficulty. Some tasks may accompany some conditions which have to be met before attempting, read and understand them carefully since a small unrectified mistake can wreck this project completely. Check the contributing guidelines first.

1. feature (UIUX): in the Login process, an alert box with an error message received from the server pops up every time a user enters the wrong credentials, create a counter that would track the number of times the user enters an username or email ID that does not belong to any account on the server, if the counter hits 3 times in a row then show an option to take the user to the sign up screen in the alert box that would appear. Maintain the existing UI and experience while doing so. 🚸✨

2. fix (UIUX): debug the Sign Up process, hopefully it can contain some flaws or maybe it can be simplified further while maintaining the existing UI and experience (hint: check the UI/UX of the sign up screen and its components for errors if any). 🚸🐛🩹

3. refactor : use StreamBuilder in ChooseUsernameScreen

4. build (DEPENDENCIES): upgrade to the latest version of the flutter SDK without failing the build and crashing the app 👷‍♂️🏗⬆💥

5. build (DEPENDENCIES): if the flutter SDK version of the project is the latest available upgrade the dependencies of the project to the latest available version without failing the build and crashing the app 👷‍♂️⬆💥

6. build (DEPENDENCIES): if the flutter SDK version of the project is the latest available and the package qr_code_scanner has been discontinued, replace qr_code_scanner with mobile_scanner and implement it without crashing the app. ➖📦➕

7. feature (LOCALIZATION): make HADWIN available in other languages (japanese, hindi, bengali, mandarin, spanish, french, german etc.) 🌐

8. test : write some meaningful tests maybe? 🧪🤔

   

   just don't break anything... please

HADWIN uses the following dependencies:

1. provider (📌6.0.2): A wrapper around InheritedWidget to make them easier to use and more reusable. ⚡
2. fluentui_system_icons (📌1.1.153): Fluent UI System Icons are a collection of familiar, friendly and modern icons from Microsoft. 🎨
3. http (📌0.13.4): A composable, multi-platform, Future-based API for HTTP requests. ⚡
4. fade_shimmer (📌2.0.1): A fade shimmer library to implement loading like lastest facebook loading effect. 🎨
5. qr_code_scanner (📌0.6.1): QR code scanner that can be embedded inside flutter. It uses zxing in Android and MTBBarcode scanner in iOS. ✨
6. scrollable_positioned_list (📌0.2.3): A list with helper methods to programmatically scroll to an item. ⚡
7. google_fonts (📌2.3.1): A Flutter package to use fonts from fonts.google.com. 🎨
8. lottie (📌1.2.2): Render After Effects animations natively on Flutter. This package is a pure Dart implementation of a Lottie player. 🎨
9. socket_io_client (📌1.0.2): Dartlang port of socket.io-client for web, flutter, dartvm to use. ⚡✨
10. grouped_list (📌4.2.0): A Flutter ListView where the list items can be grouped into sections. ⚡
11. concentric_transition (📌1.0.1): Concentric Transition effect. Useful for onboarding, page transitions etc. 🎨
12. dotted_line (📌3.1.0): This package allows you to draw dotted lines with Flutter. You can draw a beautiful dotted line. 🎨
13. qr_flutter (📌4.0.0): QR.Flutter is a Flutter library for simple and fast QR code rendering via a Widget or custom painter. ✨🎨
14. url_launcher (📌6.0.20): Flutter plugin for launching a URL. Supports web, phone, SMS, and email schemes. ✨
15. google_nav_bar (📌5.0.6): A modern google style nav bar which could be use as a bottom navigation bar or tabbar, the design strictly follows the cuberto UI/UX on dribbble. 🎨⚡✨
16. path_provider (📌2.0.9): Flutter plugin for getting commonly used locations on host platform file systems, such as the temp and app data directories. ⚡
17. markdown_widget (📌1.2.8): A new markdown package. It supports TOC function, HTML video and img tag，and it works well on both the web and mobile. 🎨✨
18. flutter_launcher_icons (📌0.9.2): A package which simplifies the task of updating your Flutter app's launcher icon. 🎨
19. flutter_native_splash (📌2.0.1+1): Customize Flutter's default white native splash screen with background color and splash image. Supports dark mode, full screen, and more. 🎨

⭐ PayPal App Redesign Concept by Vadim Demenko , follow Vadim on  

⭐Credit card - Checkout flow (AMEX) by Ramakrishna Venkatesan, follow Ramakrishna on  

⭐ Auto Location Switching & Transaction Receipt by Nimasha Perera, follow Nimasha on  

⭐ Work From Home Setup (Night) by Mohamed Chahin, follow Mohamed on  

⭐ Online shopping at the best prices. by Yuliia Osadcha, follow Yulia on  

Add a star

Fork the repository

share on twitter  

share on facebook  

share on LinkedIn  

Watch the introductory video on HADWIN on YouTube   ⤵

🚨 USERS ARE REQUESTED TO INSTALL HADWIN ONLY FROM GOOGLE PLAY AND APP STORE (when HADWIN becomes available for iOS devices), HADWIN IS A FREE APP THUS REPORT AND INFORM ABOUT ANY PAID VERSION BEING DISTRIBUTED ANYWHERE 🚨. HADWIN has been created purely out of my own interest in building a sophisticated fund transfer platform for adding value to my portfolio. Again it is being remided that users cannot transfer/receive real money through this app (as of now), users are warned and forbidden from using real credit/debit card numbers or bank account numbers. Users may and if possible should only test this application with mock data provided from my personal API hosting server (FruitCastle (source code 💡). Account numbers and User details are fictitious, they have been generated randomly out of imagination, any resemblance of mock data with real people or account numbers is matter of sheer coincidence. The creator of this project not be/ cannot be held responsible for loss of any kind.

Anyone attempting to infringe/plagarize my code to replicate this project or reproducing this project with exactly same code and claiming it as their own is being requested to play fair, try building this project on your own, it will help in better assessment of your app development skills and also properly attribute/give credit to the people and resources from which inspiration has been drawn from.