ArkFolio Showcase

Public showcase build of ArkFolio, a portfolio intelligence dashboard for tracking equities, mutual funds, gold, PPF, cash, and other manual assets across multiple portfolio sleeves.

Live demo: https://arkfolio-showcase.vercel.app/

Overview

ArkFolio Showcase is a polished, read-only product demo. It is designed for resume, portfolio, and product presentation use.

The app ships with a fully simulated Rs 10 Cr diversified portfolio, seeded import history, and illustrative market snapshots so visitors can explore the product flow without credentials, uploads, or backend setup.

Product Walkthrough

The public demo is structured like a compact investment control room:

• Dashboard surfaces total net worth, allocation, concentration, and portfolio health in one place
• Holdings lets viewers inspect securities using search, sorting, and portfolio or sector filters
• Analytics shows diversification and concentration signals rather than just raw totals
• Manual Assets rounds out the picture with gold, PPF, and fixed deposits
• Bank Accounts exposes liquidity sleeves alongside the invested book
• Imports demonstrates how upload batches and reconciliation logs would be presented in-product
• Settings is repurposed as showcase notes so the public demo remains read-only and self-explanatory

Core Features

• multi-portfolio dashboard with net worth summary and allocation views
• holdings explorer with search, sorting, portfolio filters, and sector filters
• analytics page with health score, concentration metrics, sector mix, and performance breakdown
• manual assets view covering gold, PPF, and fixed deposits
• bank liquidity sleeves grouped by portfolio
• seeded import history with batch-level drill-down to illustrate reconciliation workflows
• clear demo banner and disclosure messaging

Engineering Highlights

• static seeded data layer for a zero-secrets, zero-backend public deployment
• route-driven Next.js application with reusable layout and UI composition
• strong separation between data shaping, formatting helpers, and page rendering
• read-only product simulation that preserves real app navigation without exposing mutation paths
• production-verified Vercel deployment on the free tier

Demo Data Model

The showcase uses static, in-repo demo data with:

• Portfolio A
• Portfolio B
• Portfolio C
• Portfolio D

The seeded dataset includes:

• Indian equity positions using real market naming conventions
• mutual funds with illustrative units and valuations
• gold, PPF, and fixed deposits
• bank balances and cash sleeves
• import batches and processed file history

Demo Safety

• no personal portfolio data is included
• no login is required
• no uploads or edits are enabled
• no backend, database, or secret environment variables are required
• all holdings, balances, prices, and valuations are illustrative

Project Structure

src/
  app/          Route-based pages
  components/   UI shell and reusable components
  data/         Static showcase dataset
  lib/          Formatting and local data access helpers
  types/        Shared TypeScript contracts
public/         Static assets

Local Run

npm install
npm run dev

Open http://localhost:3000.

Production Deploy

This project deploys cleanly on Vercel Hobby.

1. Import this repository into Vercel.
2. Use the default repository root.
3. Select Next.js as the framework preset.
4. Deploy with no environment variables.

Architecture Notes

The goal is not to mimic a live brokerage product. The goal is to demonstrate how ArkFolio organizes portfolio intelligence:

• summary at the top
• drill-down through holdings and analytics
• supporting liquidity and manual asset context
• audit-style visibility into import history

In short, it shows the product shape clearly without depending on live personal data.

Tech Stack

• Next.js 16
• React 19
• TypeScript
• Tailwind CSS
• Recharts
• Radix primitives and reusable local UI components

Suitable Use Cases

• portfolio and resume showcase
• frontend product engineering demonstration
• dashboard UX demonstration
• static deployment example on Vercel
• case study for transforming a stateful product into a safe public demo

Status

• public demo deployed
• static illustrative dataset integrated
• navigation and drill-down flows verified
• build and lint verified before publish