Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/esr-style/expense-tracker
A full stack website which i built for my own personal use for tracking my expenses
https://github.com/esr-style/expense-tracker
expense-tracker fullstack nodejs postgres recharts
Last synced: 22 days ago
JSON representation
A full stack website which i built for my own personal use for tracking my expenses
- Host: GitHub
- URL: https://github.com/esr-style/expense-tracker
- Owner: ESR-style
- Created: 2024-11-01T05:19:37.000Z (2 months ago)
- Default Branch: main
- Last Pushed: 2024-11-29T17:57:28.000Z (about 1 month ago)
- Last Synced: 2024-11-29T18:34:28.719Z (about 1 month ago)
- Topics: expense-tracker, fullstack, nodejs, postgres, recharts
- Language: JavaScript
- Homepage: https://expense-tracker-ochre-nine-55.vercel.app
- Size: 335 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# SpendSage - Personal Expense Tracker
A full-stack web application for tracking personal expenses with detailed analytics and visualization.## Features
- 🔐 User authentication with JWT
- 💰 Track daily and monthly expenses
- 📊 Visual analytics with charts
- 📱 Responsive design for mobile and desktop
- 🔍 Filter transactions by date
- 📋 CRUD operations for expenses and loans
- 📈 Expense trends visualization
- 🔄 Real-time updates
- 💸 Manage loans with detailed records## Tech Stack
### Frontend
- React.js
- TailwindCSS
- Recharts for data visualization
- React Router for navigation### Backend
- Node.js
- Express.js
- PostgreSQL
- JWT for authentication
- bcrypt for password hashing## Installation
1. Clone the repository
```bash
git clone https://github.com/ESR-style/Expense-tracker.git
```2. Install dependencies for frontend
```
npm install
```3. Install dependencies for backend
```
cd backend
npm install
```4. Set up PostgreSQL database
```
CREATE DATABASE expense_tracker;
CREATE TABLE users (
user_id SERIAL PRIMARY KEY,
email VARCHAR(255) UNIQUE NOT NULL,
password VARCHAR(255) NOT NULL,
name VARCHAR(255) NOT NULL,
created_at TIMESTAMP WITH TIME ZONE DEFAULT CURRENT_TIMESTAMP
);
CREATE TABLE transactions (
transaction_id SERIAL PRIMARY KEY,
user_id INTEGER REFERENCES users(user_id),
type VARCHAR(50) NOT NULL,
category VARCHAR(100) NOT NULL,
amount DECIMAL(10,2) NOT NULL,
description TEXT,
date TIMESTAMP WITH TIME ZONE DEFAULT CURRENT_TIMESTAMP,
created_at TIMESTAMP WITH TIME ZONE DEFAULT CURRENT_TIMESTAMP
);
CREATE TABLE loans (
loan_id SERIAL PRIMARY KEY,
user_id INTEGER REFERENCES users(user_id),
person_name VARCHAR(255) NOT NULL,
amount DECIMAL(10,2) NOT NULL,
type VARCHAR(50) NOT NULL,
description TEXT,
date TIMESTAMP WITH TIME ZONE DEFAULT CURRENT_TIMESTAMP,
created_at TIMESTAMP WITH TIME ZONE DEFAULT CURRENT_TIMESTAMP
);
```5. Create .env file in backend directory
```
DB_USER=your_username
DB_PASSWORD=your_password
DB_HOST=localhost
DB_PORT=5432
DB_DATABASE=expense_tracker
JWT_SECRET=your_jwt_secret
```## Usage
1. Start the backend server
```
cd backend
node server.js
```2. Start the frontend application
```
npm run dev
```## API Documentation
### Authentication
| Method | Endpoint | Description |
|--------|----------|-------------|
| POST | `/api/register` | Register new user |
| POST | `/api/login` | Login user |### Expenses
| Method | Endpoint | Description |
|--------|----------|-------------|
| GET | `/api/expenses` | Get all expenses |
| POST | `/api/expenses` | Create new expense |
| PUT | `/api/expenses/:id` | Update expense |
| DELETE | `/api/expenses/:id` | Delete expense |### Loans
| Method | Endpoint | Description |
|--------|----------|-------------|
| GET | `/api/loans` | Get all loans |
| POST | `/api/loans` | Create new loan |
| PUT | `/api/loans/:id` | Update loan |
| DELETE | `/api/loans/:id` | Delete loan |## Screenshots
### Homepage
![Homepage Screenshot](/public/Screenshot%20(190).png)### Expenses Page
![Expenses Page Screenshot](/public/Screenshot%20(191).png)### Loans Page
![Loans Page Screenshot](/public/Screenshot%20(192).png)