The application is deployed through Vercel on the following links:
As you can see, there are 2 versions of our application:
- The first one has
REACH_CONNECTOR_MODE
set toALGO
to use with MyAlgo wallet - Another has
REACH_CONNECTOR_MODE
set toETH
which may use MetaMask.
This is a create-react-app
project. If you want to run it locally:
- Clone the repository.
- Run
npm i
from the root directory. You need to havenpm
installed. - Run
npm start
.
SourceSmart is a web3 blockchain application that allows the public to track and trace the origin of any registered product, from the raw materials to the final product.
Buyers and the Suppliers use SourceSmart to register a product as well as its origin, and the consumers use SourceSmart to view the product's origin and verify its authenticity.
The flow goes as follows:
- Buyer creates a contract with the ingredient's details and the supplier's address.
- Supplier attaches to, and views the contract, accepts it, and adds the ingredient to the contract. (Or rejects it)
- Buyer receives the goods and finally mark the contract as delivered.
- QR code is generated, printed on the product and the contract information is accessible to the public.
Feature Highlights:
-
Publicly Accessible, Fully Transparent Supply Chain. If a product supply chain is
[A -> B -> C -> D]
each representing a contract, the application provides a convenient tree view that allows you to trace the origin of the product from D to A even though you only have the QR code of D. -
QR Code Scanning and Generation:
- When the buyer deploys, a QR code is generated for the supplier to attach to the contract.
- Supplier can add ingredients to the contract by QR code scanning
- Once the contract is delivered, a QR code is generated for the product. QR code can be printed on the product and scanned by the public to view the entire supply chain.
-
No Disconnection Problem. The backend utilizes API calls, which can be called anytime from the frontend. Therefore there will be no problems with closing the application in the middle of the process - You can always attach back anytime.
-
Two Blockchains. Thanks to Reach, the application can be used on both Ethereum and Algorand blockchains.
SourceSmart is a React application, and thereby follows the standard React project structure. The main source code is in the src
folder:
context
- React Context API for global state managementreach-backend
- Reach backend code. Containsindex.rsh
and compiledindex.main.mjs
file.styles
- CSS fileviews
- Pages of the applicationApp.js
- Entry point of the React applicationAppRoutes.js
- React Router routesUtil.js
- Contains common utility functions, mainly the ones that interact with the Reach backend, like API calls, wallet connection, and contract attachment.