Shadcn AI Personal Finance Dashboard

This is a Next.js project bootstrapped with create-next-app. This project utilizes Plaid and OpenAI technologies as well as shadcn to unlock insights into your spending and transactions. Simply clone and deploy with your own Plaid Developer API Key to host a private Mint App clone, boosted with Vercel AI SDK & Generative UI. Take it forward, contribute or commercialize - go nuts.

Key Features

• /dashboard Connect Debit / Checkings, Savings, Credit Cards & Investment (Robinhood) accounts. Review live account balances.

• charts Shadcn charts to analyze monthly and recurring spend.

• transactions Rich Datagrid to browse transactions and filter by time-range, spend category & more using shadcn data grid and popover filters.

• chat Chat with GPT-4o to ask Q&A about your accounts & financial position. Renders generative UI cards using Vercel AI SDK.

• NEW Custom GPT Integration Serve secure endpoints to inferace with Plaid & ChatGPT. Utilize the pre-populated OpenAPI specification and securely chat with your account and transactions data in ChatGPT.

Roadmap / Future Plans

• Add more charts
• Add loading states
• Budgeting feature like RangerBudget
• Twilio integration for SMS notifications
• Vapi or OpenAI realtime integration for voice AI
• Review Investments
• Check Credit Score
• Check Credit Card Rewards

Getting Started

First, run the development server:

npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file.

This project uses next/font to automatically optimize and load Inter, a custom Google Font.

Learn More

To learn more about Next.js, take a look at the following resources:

• Next.js Documentation - learn about Next.js features and API.
• Learn Next.js - an interactive Next.js tutorial.

You can check out the Next.js GitHub repository - your feedback and contributions are welcome!

Deploy on Vercel

The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.

Check out our Next.js deployment documentation for more details.