Raymond Lee

BlockLoyalty

Customer loyalty card decentralized app

Main screen and owner dashboard
Technologies
  • Blockchain
  • Solidity
  • React
Links

Overview

BlockLoyalty is a customer loyalty card decentralized application (DApp) built on the Ethereum blockchain using smart contracts. This app is a digital version of what we see in paper loyalty cards where customers receive a stamp each time they make a purchase. When they reach a certain amount of stamps, they can redeem the card for a free item. With it being powered by Ethereum smart contracts, it won’t need a database or a server to handle the back end code. The smart contract is written in Solidity and the client-side app is created using React.

Smart Contract

The written smart contract is like the back end of this application as it contains all of the logic to process transactions when adding customers, adding stamps, and redeeming stamps. To keep track of all of the loyalty cards, it is storing each of the customer’s addresses and their stamp balance on the blockchain. It is also storing the address of the smart contract owner to control who can process these transactions for the customers.

The function to add customers has parameters for a customer address and their initial balance so that it can issue a loyalty card to a customer with their initial balance. The adding stamps function is similar in that it accepts a customers’ address and the number of stamps to increment. The reason for allowing multiple increments is so that it does not need to make multiple transactions if customers are receiving multiple stamps, therefore cutting down on fees. Finally, the function for redeeming stamps has the parameter for a customer address, which resets a customer’s balance to zero when called.

React App

The React app connects directly to the Ethereum blockchain where the logic and data are handled from the smart contract that has been created. Upon loading it up, it would check the address of the current user (from MetaMask) to see if it is the owner of the smart contract. It displays two different interfaces depending if the user is the smart contract owner.

If the current user is just a customer, it would display a QR code of their address and also their loyalty card. It is also checking to see how many stamps the user has and populates it into the loyalty card.

If the current user is the smart contract owner, it would display a dashboard where they can add customers, add stamps, and redeem stamps. A QR code reader has been implemented as a better way of inputting customer addresses when performing these transactions. Upon clicking on buttons for transactions, a request is made to the blockchain to have it processed.

Main screen containing customer address and balance
Customers get a stamp each time they make a purchase.
Owner dashboard containing section to add new customer
New stamp cards are created from the owner's dashboard.
Owner dashboard containing section to add and redeem stamp
Stamps are added and redeemed from the owner's dashboard.
Inputting customer address with the QR code reader
The customer's address can be inputted through the QR code reader.

Reflection

This project started with my interest in wanting to learn about blockchain development. The idea of a customer loyalty card came to mind when I was brainstorming everyday processes that can be digitized and benefit from blockchain technology. As it was my first time working with blockchain, there was a lot to learn and I enjoyed every part of the journey.

There are a few things that I would like to do to further improve this DApp. First, I would add transaction history so we can track when customers were added, stamps were added, and stamps were redeemed. Another one is to allow other users such as employees to be able to make transactions to the customers since currently, only the contract owner can make these transactions.