Swift-Scan is a modern self-checkout mobile application designed to revolutionize the supermarket shopping experience. Developed using React Native and Firebase, this innovative app allows users to scan, manage, and pay for their purchases directly from their smartphones, eliminating the need for traditional cashier-based checkout systems.
- Efficient Checkout: Say goodbye to long queues and waiting times at the checkout counter.
- Product Scanning: Easily scan items using your smartphone camera for quick and accurate checkout.
- Cart Management: Add, remove, and adjust quantities of items in your virtual shopping cart with ease.
- Secure Payments: Pay securely using integrated payment gateways, including credit/debit cards and mobile wallets.
- Real-time Receipts: Receive instant digital receipts for all transactions, accessible directly from the app.
- Clone the repository:
git clone https://github.com/JoshuaOloton/swift-scan.git - Install dependencies:
npm install - Set up Firebase: Follow the instructions in the Firebase documentation to set up Firebase for your project.
- Configure Firebase credentials: Replace the Firebase configuration in
src/firebase/config.jswith your own Firebase project credentials. - Run the app:
npm run devorreact-native run-android/react-native run-ios
The workflow from the customer’s access point is shown below:
-
- The user provides their valid username/email and password to gain access to the customer interface.
-
- Customers utilize the barcode scanner on the app to scan products.
- Product details and prices are displayed upon successful scanning.
- Selected products are added to the customer's online cart.
-
- Customers continue shopping, scanning, and adding products to their carts.
- A user-friendly interface ensures a seamless shopping experience.
Login Screen
Customer Scan Page
-
- Customers proceed to checkout.
- The app facilitates payment through a trusted payment provider using the customer's credit card details.
- An online receipt is generated upon successful payment.
-
- Customers present the online receipt at a dedicated checkout counter.
- The attendant verifies the items, expediting the process as scanning and payment have already been completed.
-
- Items are packed, and the customer can promptly depart from the supermarket or shopping mall.
Customer adds Product to Cart
Checkout Page
Payment Confirmation
-
- The admin is responsible for adding new products to the supermarket inventory.
- This involves scanning the barcode of each product and entering the corresponding name and price information.
- The admin interface facilitates a streamlined process for adding multiple products efficiently.
Admin Inventory Page
-
- The admin interface provides a user-friendly form to input necessary details for each scanned product, ensuring accurate and comprehensive data entry.
- Validation mechanisms are implemented to maintain data integrity.
-
- Admins can view a comprehensive list of all added products within the supermarket inventory.
- This overview includes product names, prices, and other relevant details for easy reference.
-
- The admin has the privilege to delete any product from the inventory when necessary.
- This capability ensures the ability to manage and update the inventory effectively.
Admin Data Entry
Admin Product Deletion
- Login: The admin logs into the Supermarket Checkout App with privileged access.
- Barcode Scanning: The admin scans the barcode of a new product using the admin interface.
- Data Entry: The interface prompts the admin to enter the name and price of the scanned product.
- Add to Inventory: The admin adds the product to the supermarket inventory upon entering the required details.
- Repeat Process: The admin repeats the scanning and data entry process for any additional products that need to be added to the inventory.
- Product Overview: The admin can view a comprehensive list of all added products in the inventory, providing an organised overview.
- Deletion Process: If necessary, the admin can select a product from the list and delete it from the inventory.
- Confirmation: The admin interface provides confirmation prompts to ensure accurate deletion and prevent accidental removal of products.
- Logout: After completing the necessary inventory management tasks, the admin logs out to secure the privileged access.
The workflow from the customer’s access point is shown below:
-
- The user provides their valid username/email and password to gain access to the customer interface.
-
- Customers utilize the barcode scanner on the app to scan products.
- Product details and prices are displayed upon successful scanning.
- Selected products are added to the customer's online cart.
-
- Customers continue shopping, scanning, and adding products to their carts.
- A user-friendly interface ensures a seamless shopping experience.
-
- Customers proceed to checkout.
- The app facilitates payment through a trusted payment provider using the customer's credit card details.
- An online receipt is generated upon successful payment.
-
- Customers present the online receipt at a dedicated checkout counter.
- The attendant verifies the items, expediting the process as scanning and payment have already been completed.
-
- Items are packed, and the customer can promptly depart from the supermarket or shopping mall.
Contributions are welcome! Feel free to open issues or pull requests for any improvements, bug fixes, or feature requests.