# Finance Tracker

Welcome to Finance Tracker, a web-based application designed to help you monitor and manage your finances effortlessly. This platform provides tools to organize your accounts and track your financial data all in one place.

Features

1. User Authentication:

   • Sign up for a new account or log in using your existing credentials.
   • Supports account creation and management.

2. Dashboard Overview:

   • After signing in, users are greeted with a dashboard showing their financial overview.
   • Create and manage accounts to organize your financial data.

3. Create and View Accounts:

   • Add new accounts (e.g., checking, savings, investments) and select them to track associated finances.
   • View consolidated financial data once accounts are added.
   • Add new transaction or import csv file.

How to Use

1. Sign Up / Log In:

   • Visit the Finance Tracker and create a new account or log in with existing credentials.

2. Create Accounts:

   • After logging in, navigate to the account creation section on the dashboard.
   • Add relevant financial accounts by providing required details.

3. Dashboard View:

   • Once accounts are created, access the dashboard to see your financial summaries and manage data.

Technologies Used

• Frontend:

  • React.js & Next.js
  • Tailwind CSS for styling
  • React Query for data fetching and caching
  • React Hook Form for handling forms
  • Radix UI for accessible UI components

• Authentication:

  • Clerk for user sign-up and authentication

• Database:

  • Neon Database (Serverless)
  • Drizzle ORM for querying the database

• Other Dependencies:

  • Recharts for visualizing financial data
  • Zod for schema validation
  • Date-fns for date management
  • Lucide React for icons

• Deployment:

  • Vercel

Getting Started (for developers)

Clone the repository and install dependencies:

Getting Started

git clone [repository-url]
cd finance-tracker
npm install

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.

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.