Blockchain-powered real estate property registry and tokenization platform
Built with Next.js 15, TypeScript, Tailwind CSS, shadcn/ui, and Zustand
PropChain is a cutting-edge decentralized property registry that enables property owners, verifiers, and oracle nodes to tokenize, verify, and manage real estate assets on the blockchain.
- 🏡 Property Minting — Multi-step wizard to register and tokenize properties as NFT-backed assets
- 🔍 AI-Powered Verification — AI engine extracts metadata from deed documents and assigns confidence scores
- 📊 Portfolio Dashboard — Real-time portfolio overview with valuations, yield metrics and telemetry
- 🧾 Audit History — Immutable, tamper-proof audit log of all property events
- 🔐 Oracle Verification Queue — Institutional validators review and sign pending asset mints
- 🌐 Network Telemetry — Live block height, gas metrics, and oracle consensus status
The UI was designed using Stitch by Google — Google's AI-powered UI generation tool.
| Token | Color | Usage |
|---|---|---|
primary |
#0050b2 |
CTA buttons, accented text |
surface |
#f9f9ff |
Page backgrounds |
on_surface |
#191c21 |
Primary text |
on_surface_variant |
#43474e |
Secondary text |
success |
#006e2c |
Verified / confirmed states |
error |
#ba1a1a |
Failed / conflict states |
- Display / Headings: Plus Jakarta Sans (via
font-display) - Body: Inter (via
font-body) - Scale: Fluid typography using
clamp()for all breakpoints
| Technology | Version | Purpose |
|---|---|---|
| Next.js | 15.2.3 | React framework (App Router) |
| React | 19.x | UI library |
| TypeScript | 5.x | Type safety |
| Tailwind CSS | 3.4.x | Utility-first styling |
| shadcn/ui | 4.x | Pre-built accessible components |
| Radix UI | Various | Primitive UI components |
| Zustand | 5.x | Global state management |
| Lucide React | 0.474 | Icon library |
| React Hook Form | 7.x | Form management |
| Zod | 3.x | Schema validation |
PropChain/
├── app/ # Next.js App Router pages
│ ├── dashboard/ # Portfolio Overview dashboard
│ ├── properties/ # Property listing & detail pages
│ │ └── [id]/ # Dynamic property detail
│ ├── mint/ # Multi-step asset minting flow
│ │ ├── layout.tsx # Shared stepper layout
│ │ ├── details/ # Step 1: Property identification
│ │ ├── upload/ # Step 2: Document upload + AI review
│ │ ├── ai-check/ # Step 3: AI confidence results
│ │ └── review/ # Step 4: Final review & mint
│ ├── audit/ # Audit history & verification queue
│ ├── oracle/ # Oracle node panel
│ │ ├── queue/ # Verification queue
│ │ └── analytics/ # Oracle analytics
│ └── registry/ # Public registry explorer
├── components/
│ ├── layout/ # AppShell, Sidebar, Navbar
│ ├── shared/ # Reusable: PropertyCard, StatCard, etc.
│ ├── forms/ # DocumentUploadZone, form controls
│ └── ui/ # shadcn/ui primitive components
├── store/ # Zustand state stores
│ ├── useMintStore.ts # Minting wizard state
│ ├── usePropertyStore.ts # Property list state
│ └── useRoleStore.ts # User role (USER / ORACLE)
├── lib/
│ ├── mockData.ts # Placeholder data for dev
│ └── utils.ts # Utility helpers (cn, etc.)
├── types/
│ └── index.ts # Shared TypeScript interfaces
└── hooks/ # Custom React hooks
- Node.js 20.x or higher
- npm 10.x or higher
# Clone the repository
git clone https://github.com/Hey-Viswa/PropChain.git
cd PropChain
# Install dependencies
npm install
# Start the development server
npm run devOpen http://localhost:3000 in your browser.
| Script | Command | Description |
|---|---|---|
| Dev server | npm run dev |
Starts Next.js with Turbopack |
| Production build | npm run build |
Creates optimized production build |
| Start production | npm start |
Serves the production build |
| Lint | npm run lint |
Run ESLint checks |
This project follows a two-branch workflow for safe deployment separation:
| Branch | Purpose | Auto-deploy |
|---|---|---|
development |
Active feature development and experiments | Dev/Staging |
production |
Stable, tested, release-ready code | Production |
feature/* → development → (PR review) → production
⚠️ Never commit directly toproduction. Always merge fromdevelopmentvia Pull Request after testing.
| Design Component | Source |
|---|---|
| UI Screens & Mockups | Stitch by Google DeepMind — AI-generated UI design system |
| Icons | Lucide React — Open-source icon library |
| Components | shadcn/ui — MIT Licensed component library |
| Property images (demo) | Unsplash — Free to use photography |
| Fonts | Google Fonts — Plus Jakarta Sans, Inter |
| Route | Page | Description |
|---|---|---|
/ |
Landing | Redirect to dashboard |
/dashboard |
Portfolio Overview | Equity value, yield, verified asset cards |
/properties |
My Properties | Grid of tokenized property cards |
/properties/[id] |
Property Detail | Full asset detail with audit timeline |
/mint/details |
Mint Step 1 | Property identification form |
/mint/upload |
Mint Step 2 | Document upload + AI engine processing |
/mint/ai-check |
Mint Step 3 | AI confidence results |
/mint/review |
Mint Step 4 | Final review and ledger submission |
/audit |
Verification Queue | Oracle queue with confidence scoring |
/oracle/queue |
Oracle Panel | Node operator verification interface |
/oracle/analytics |
Oracle Analytics | Node performance metrics |
/registry |
Public Registry | Searchable public property registry |
- Wallet connection (MetaMask / WalletConnect)
- Real blockchain integration (Ethereum / Polygon)
- IPFS document storage (via Filecoin/NFT.storage)
- Oracle node smart contract integration
- PDF parsing AI backend
- Multi-language support (i18n)
- Mobile PWA support
This project is licensed under the MIT License — see the LICENSE file for details.
Built with ❤️ using Next.js & Stitch by Google