SmartBalance is a full-stack web application that provides users with personalized financial dashboards using modern web technologies like Next.js, Clerk for authentication, and Drizzle ORM with Neon for serverless PostgreSQL integration.
- 🔐 User Authentication via Clerk
- 📊 Interactive Dashboard with bar charts and data cards
- ⚡ Serverless Database via Neon & Drizzle ORM
- 🎨 Beautiful UI using Radix UI and Tabler Icons
- 🌐 Built with Next.js 13+ App Router
- Frontend: React, Next.js 13 App Router, TypeScript
- UI: Radix UI, Tabler Icons, Tailwind CSS
- Backend: Neon (PostgreSQL), Drizzle ORM
- Auth: Clerk
- Deployment: Vercel (suggested)
SmartBalance
├── app/
│ ├── (auth)/ # Sign-in / Sign-up routes
│ ├── (routes)/ # Dashboard components and routes
│ └── page.tsx # Main landing page
├── drizzle.config.js # Drizzle ORM configuration
├── middleware.ts # Clerk Middleware
├── package.json # Project metadata and dependencies
├── tsconfig.json # TypeScript config
git clone https://github.com/TanayHingane/SmartBalance.git
cd SmartBalancenpm installCreate a .env.local file and add necessary keys (e.g., for Clerk, NeonDB, etc.):
CLERK_SECRET_KEY=your_key
DATABASE_URL=your_neon_db_urlnpm run devOpen http://localhost:3000 to view the app.
npm run db:pushnpm run dev- Start dev servernpm run build- Build for productionnpm run start- Start production servernpm run lint- Lint source codenpm run db:push- Push DB schema using Drizzle ORM
@clerk/nextjs– Authentication provider@neondatabase/serverless– Serverless PostgreSQLdrizzle-orm– Type-safe SQL ORM@radix-ui/*– Headless UI componentstailwindcss– Utility-first CSS framework
Contributions are welcome! Feel free to open issues or submit pull requests.
This project is licensed under the MIT License.
