Skip to content

Finance Management Dashboard using Next.js, Tailwind CSS, shadcn, Appwrite, Plaid, Dwolla and Sentry

Notifications You must be signed in to change notification settings

lasindu2001/next-banking-app

Repository files navigation

💰 MoneyMaster

MoneyMaster is a financial SaaS platform designed to streamline personal finance management by connecting multiple bank accounts and providing real-time transaction updates. This project was developed as a learning exercise to deepen understanding of Next.js and other modern web technologies.

✨ Features

  • 🔒 User Authentication: Secure SSR authentication with React Hook Form and Zod for proper validations.
  • 🏠 Dashboard: Comprehensive summary of account details, total balance across all connected banks, recent transactions, and spending categories.
  • 🏦 Account Management: Seamless management of linked bank accounts through Plaid integration.
  • 💸 Payment and Transfers: Efficiently initiate and manage payment transfers between accounts using Dwolla.
  • 🌐 API Integration: Robust backend communication for data fetching and server-side operations with Appwrite.
  • 🔄 Data Fetching and State Management: Effective management of application state using React hooks and state management libraries.
  • 🛠 Error Tracking: Integrated Sentry for comprehensive error tracking.
  • 🎨 Styling and UI Components: Utilizes TailwindCSS, ShadCN, and Chart.js for a polished and responsive user interface.
  • 📱 Responsiveness: Ensures a seamless user experience across desktop, tablet, and mobile platforms, adapting to various screen sizes and devices.

🛠 Tech Stack

  • Next.js
  • TypeScript
  • Appwrite
  • Plaid
  • Dwolla
  • React Hook Form
  • Zod
  • TailwindCSS
  • Chart.js
  • ShadCN

🚀 Installation

To get started with MoneyMaster, follow these steps:

  1. Clone the repository:

    git clone https://github.com/lasindu2001/next-banking-app.git
  2. Navigate to the project directory:

    cd moneymaster
  3. Install the dependencies:

    npm install
  4. Set up environment variables:

    Create a .env.local file in the root directory and add the necessary environment variables as specified in .env.example.

  5. Run the development server:

    npm run dev
  6. Open your browser and navigate to http://localhost:3000 to view the application.

🤝 Contributing

Contributions are welcome! If you have suggestions for improvements or encounter issues, please open an issue or submit a pull request.

📧 Contact

For any questions or suggestions, feel free to reach out to me on LinkedIn or open an issue on GitHub.

About

Finance Management Dashboard using Next.js, Tailwind CSS, shadcn, Appwrite, Plaid, Dwolla and Sentry

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published