The Story of Blue Ledger
What Inspired Me
My journey into web development has always been driven by a desire to build applications that solve real-world problems. While exploring the world of climate technology, I was struck by a fundamental paradox in the carbon credit market: a system designed to build trust in environmental action often suffers from a critical lack of transparency. Issues like double-spending of credits and the difficulty in verifying the real-world impact of projects create a barrier for both dedicated NGOs and potential investors.
I was inspired to build Blue Ledger to address this head-on. My vision was to create a decentralized platform where every claim of carbon sequestration is not just a promise, but a permanent, publicly verifiable record on the blockchain. I wanted to build a system that empowers NGOs by giving them direct access to a global market and gives buyers the confidence that their investment is making a real, measurable difference.
How I Built It: The Technical Journey
I architected Blue Ledger as a full-stack decentralized application, carefully selecting technologies to ensure security, transparency, and a premium user experience.
The Foundation (On-Chain Logic): The core of the platform is built with Solidity smart contracts deployed on the Polygon Amoy testnet. I designed a central ProjectRegistry contract to act as the single source of truth for all projects. To represent carbon credits, I chose the ERC1155 token standard, which is incredibly efficient as it allows each project's credits to be a distinct token ID within the same contract. All smart contract development and testing were done using Foundry.
Decentralized Data Storage: To ensure the integrity of off-chain data like project descriptions, images, and MRV documents, I integrated IPFS via the Pinata service. The smart contracts store an immutable IPFS hash for every piece of data, creating an unbreakable link between the on-chain record and the off-chain files.
The Frontend Experience: The user interface is a modern, responsive web application built with React, TypeScript, and Vite. For Web3 connectivity, I used the industry-standard libraries wagmi and RainbowKit, which provide a seamless wallet connection experience.
A Focus on High-Fidelity UI/UX: I believe that trust is also built through a high-quality user experience. I went beyond basic components by integrating libraries like shadcn/ui, Aceternity UI, and Magic UI to implement:
Interactive 3D card and pin effects for project browsing.
A scroll-based "Macbook" animation to showcase the platform's features.
An animated "Retro Grid" background to give the user dashboards a modern, high-tech feel.
An interactive globe visualization using cobe to display the global reach of the projects.
On-demand PDF report generation using @react-pdf/renderer.
What I Learned
This project was a massive learning experience that took me far beyond standard full-stack development.
dApp Architecture: I learned how to design and build a complete end-to-end decentralized application, managing the complex interplay between on-chain smart contracts and a reactive frontend.
Web3 Integration: I gained deep, practical experience with wagmi and viem, learning how to handle the entire transaction lifecycle, from reading contract state to managing multi-step transactions like token approvals and purchases.
Technical Pivoting & Debugging: I faced significant dependency conflicts with three.js while building a 3D globe. After extensive debugging, I made the pragmatic decision to pivot to the more stable cobe library. This taught me a valuable lesson in choosing the right tool for the job and not being afraid to change course to ensure project stability.
Full-Stack Problem Solving: I solved classic full-stack challenges like handling CORS errors between a deployed frontend (on Vercel) and backend (on Render), and I engineered a robust data-fetching pipeline for the PDF generation feature to handle potential image loading failures.
What's Next: The AI Co-Pilot (Work in Progress)
The next major feature for Blue Ledger is an AI Verification Co-Pilot. The UI and backend infrastructure for this are currently in progress. The goal is to integrate Google's Gemini 1.5 API to automatically analyze the drone imagery and documents submitted by NGOs. The AI will provide objective metrics like estimated sapling counts, canopy health percentages, and summaries of PDF reports, giving the platform's administrators a powerful tool to assist in the verification process and further enhance the trustworthiness of the entire system.
Built With
- blockchain
- ether.js
- forge
- foundry
- framer-motion
- react
- shadcn
- solidity
- tailwind
Log in or sign up for Devpost to join the conversation.