Stock Portfolio Tracker 📈

A modern, responsive stock portfolio tracker built with React and Node.js

Live Demo • API Endpoint • Report Bug

✨ Features

• 📊 Portfolio Management - Track your stocks with real-time updates
• 👀 Watchlist - Monitor potential investments
• 🌓 Dark/Light Mode - Easy on the eyes, day and night
• 📱 Fully Responsive - Perfect on desktop and mobile
• 🔄 Live Updates - Stock prices update automatically
• 📈 Price History - Visualize stock performance

🚀 Quick Start

Prerequisites

• Node.js 14+
• npm or yarn
• MySQL

Frontend Setup

1. Clone and install:

git clone https://github.com/HackStyx/portfolio-tracker.git
cd portfolio-tracker
npm install

2. Create .env:

VITE_API_BASE_URL=http://localhost:5000/api

3. Start development server:

npm run dev

Backend Setup

1. Setup backend:

cd backend
npm install

2. Configure .env:

DATABASE_URL=mysql://user:password@localhost:3306/portfolio_tracker
PORT=5000
NODE_ENV=development

3. Run migrations and start:

npm run migrate
npm start

🔌 API Endpoints

Portfolio

```http GET /api/stocks # Get portfolio stocks POST /api/stocks # Add stock PUT /api/stocks/:id # Update stock DELETE /api/stocks/:id # Remove stock ```

Watchlist

```http GET /api/watchlist # Get watchlist POST /api/watchlist # Add to watchlist PUT /api/watchlist/:id # Update watchlist item DELETE /api/watchlist/:id # Remove from watchlist ```

⚡️ Tech Stack

Frontend

• React + Vite
• TailwindCSS
• Framer Motion
• Tremor Charts
• Axios

Backend

• Node.js
• Express
• MySQL
• Knex.js

⚠️ Limitations

• Uses simulated stock data
• Single-user environment
• Price updates every minute
• Best viewed in modern browsers

📄 License

MIT © HackStyx