SYS_ID: treeadoptWEB
Open Live DemoTreeAdopt E-Commerce Platform
Digital Tree Adoption E-Commerce & Conservation Portal
// Technologies:
HonoReactDrizzle ORM
PROJECT SCREENSHOTS (16:9 HD)
[1 / 3]
Overview
Digital tree adoption and planting e-commerce web app featuring instant certificate rendering, payment options, and biodiversity project tracking.
// Role:
Fullstack Developer & System Analyst
// Key Contributions:
- Developed the platform from scratch as the full developer for the entire tree adoption e-commerce application, collaborating with the manager and lead staff.
- Designed aesthetic, user-centric e-commerce UI/UX interfaces while regularly delivering updates driven by user feedback.
- Architected the digital tree adoption e-commerce platform using Hono REST APIs and Drizzle ORM.
- Integrated Midtrans Snap Payment Gateway, Google OAuth 2.0 login, and client-side React PDF certificate viewer & downloader.
- Built the Wishtree public environmental message board and real-time top adopters community impact leaderboard.
Key Features
- 1Tree Adoption Package Purchase & Digital Certificates
- 2Automated Checkout via Midtrans Payment Gateway (QRIS, E-Wallets)
- 3Instant In-Browser Certificate PDF Viewer & Downloader
- 4Wishtree Public Environmental Message Board
- 5Top Adopters & Community Impact Leaderboard
System Architecture
// DEEP_TECH_SPECS & INTEGRATION
- >Midtrans Payment Gateway Integration (Snap & Core API)
- >React PDF Viewer Core & Layout Integration
- >Google OAuth 2.0 Identity Provider Integration
- >Hono Server REST Backend with Drizzle ORM Database
- >Sharp Image Processing Engine for Certificate Rendering
- >TanStack Query & Form Async State Management
Screenshots & Visuals
VIEW 1
VIEW 2
VIEW 3