Spend - Expense Tracker

This is Spend, the modern-day expense tracker designed both with precision and the latest technology. The app is seamless in tracking expenses; visualizing things in between; and better managing finances.

🛠️ Tech Stack

Spend leverages the following tools and libraries:

• TypeScript: Type-safe programming
• Next.js 15: Robust React framework for building modern web applications
• TailwindCSS: Utility-first CSS framework
• Prisma: ORM for database management
• NeonDB: Postgres database as a service
• ClerkAuth: Authentication made simple
• Recharts: Beautiful and customizable charts
• React Hook Form: Simplified form handling
• Zod: Schema validation
• TanStack Table: Flexible table library
• TanStack Query: Asynchronous state management
• Lucide React: Icon toolkit
• ShadCN-UI: Components for building user interfaces
• Date-fns: Utility library for handling dates
• Export-to-CSV: Export data as CSV
• React CountUp: Animated number counter
• Emoji Mart: Emoji picker library
• pnpm: Fast, disk space-efficient package manager

---

🌟 Features

• 🚀 Effortless Expense Tracking: Add, edit, and delete expenses with ease.
• 📊 Interactive Charts: Visualize spending patterns using beautiful charts.
• 🗃️ Customizable Tables: Organize and filter your expense data.
• 📅 Date Management: Intuitive date handling for accurate records.
• 🛡️ Secure Authentication: Manage users with robust authentication.
• 📤 Export Data: Save your data as CSV for offline use.
• 🌈 Dynamic Emojis: Add a personal touch with emojis.

---

🚀 Getting Started

Follow these steps to set up the project locally:

Prerequisites

• Node.js >= 16
• pnpm installed globally: npm install -g pnpm
• A NeonDB database instance
• ClerkAuth account for authentication

Installation

1. Clone the repository:

   git clone https://github.com/IFTE-13/spend.git
   cd spend

2. Install dependencies:

   pnpm install

3. Set up environment variables:

   Create a .env file in the root of your project and add your API key for the services:

    NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=publishable_key
    CLERK_SECRET_KEY=secret_key
    NEXT_PUBLIC_CLERK_SIGN_IN_URL=sign-in
    DATABASE_URL=your_api_key_here
   

4. Run the development server:

🤝 Contributing

Contributions are welcome! If you have any suggestions or improvements, feel free to create an issue or submit a pull request.

1. Fork the repository

2. Create a new branch:

   git checkout -b feature/your-feature-name

3. Make your changes

4. Commit your changes:

   git commit -m '<type>[optional scope]: <description>'

5. Push to the branch:

   git push origin feature/your-feature-name

6. Open a pull request

   pnpm run dev

   Open http://localhost:3000 in your browser to see the app in action.

📝 License

Caution

This project is licensed under the MIT License. See the LICENSE file for details.