Demo E-commerce site
Checkout step 1: Review summary
Checkout step 3: Minting, creating offer, and accepting offer
Checkout step 4: Completed payment
Admin setting page to configure plugin
Moderator page to search for NFT token by this issuer
Integrating with frontend via HTML Class
Transaction store on Strapi model for easy query
A functional NFT is mean an NFT that provides some sort of functionality. The idea of integrating an NFT token as part of the transaction receipt as well as a proof check of the authenticity of the purchase makes sense.
Given that we can keep track of the payer, using NFT on e-commerce allow us to extend the functionality to give out promo code without fear of people abusing it. The source of truth can be validated with the issuer's address.
I try to search for well-known and popular CMS that is easy to build on top. Strapi came on top with plenty of quick bootstrapping tools to build an application for this project.
What it does
This project is a Strapi Plugin that can be published on Strapi Marketplace to allow users to quickly install and test out the XRP's NFT feature.
By using the provided E-commerse template as the base or any user with existing e-commerce can do a minor tweak on the Frontend application to quickly support checkout payment with NFT.
Coupled with the build-in Admin Page with Strapi, the existing user can leverage the platform to monitor and use the platform to view their transaction and do some search directly on the XRP blockchain.
How we built it
Foremostly, I am new to Strapi. However, this serves as a good platform to bootstrap using Strapi as the base and NEXT.js to build the e-commerce frontend. Next, we hack our way to convert the existing shopping cart feature to use our XRP transaction logic.
In order to make this product/project scalable, and easy for other users to install. We decided to convert it into a plugin. And this took us an extra effort to understand the system and work on the change.
Challenges we ran into
The most obvious challenge was understanding and building on Strapi. The documentation is clear, however it wasn't detailed enough when you start to dive deeper into the implementation. As the result, I am required to create an issue and further discuss it with the community to unblock the issue.
As for the XRP end of this. Going through the docs was a little information overload. Until I bump across the NTF tester. This allows me to quickly spike to understand the response. Beyond that, it was quite smooth.
Besides that, the Transaction Memo is hard to use and is not designed to allow users to configure. We initially thought that we can insert the cart metadata into this to store it into the blockchain. However, we have been facing quite a number of hurdles to do so. In the end, only URL was usable. Thus, we have to create a temporary (mock) ipfs URL to illustrate how the metadata is stored. Ideally, if the information is able to store on the blockchain as the source of truth. That would be the best outcome.
Accomplishments that we're proud of
I managed to complete and build a solution using 2 new systems (Strapi & XRP). Both of those are new to me and completing them in a short amount of time.
The output looks decent and the stability of the product is reliable. The only thing
What we learned
I managed to learn more about XRP NFT. And making a functional NFT for real-world application.
Also, I never really work on CMS systems before. Sort of mind blown by the convenience we can get out of a headless CMS with Admin page, security control for endpoint, and more. And, to the extent of creating a database table without needing to write code.
What's next for XRP Cart
- As mentioned, the product does feel quite stable and reliable to use. On the UI side, the checkout page and be improved by collaborating with some UI/UX experts to make it more seamless.
- Since I am new to this, I probably need to spend a little more time to figure out how to publish this plugin into the Strapi Marketplace.
- Last but not least, on the minting rule setup. It is very basic as of now. I believe this can be further improved to support more use cases to make use of the NFT to serve e-commerce better.
Log in or sign up for Devpost to join the conversation.