📈 Stoxly (Stock Market Portfolio Tracker)

---

🌐 Deployment

• 🔗 Live Site (Frontend)

---

🎥 Demo

---

📸 Screenshots

📊 Portfolio Dashboard

🎮 3D Landing Page

---

📝 Overview

Tracking stock investments manually can be challenging, leading to difficulties in monitoring profits/losses, retrieving historical data, and visualizing market trends?

Stoxly is a modern full-stack web application designed to help users manage and analyze their stock investments with ease. By integrating real-time stock data, interactive dashboards, and 3D visuals, it delivers a robust experience for both beginners and experienced traders.

---

✨ Features

• 🔐 Secure Authentication – User login and registration powered by JWT.
• 📊 Portfolio Dashboard – Add, update, and remove stocks in a personal portfolio.
• 📈 Live Market Data – Real-time stock prices and updates via Alpaca API and WebSocket.
• 📉 Analytics & Insights – Visualize profits, losses, and historical trends.
• 🌐 3D Interactive UI – Engaging, animated elements and charts powered by Three.js.
• 📰 Market News – Stay updated with top headlines and movers in the stock market.

---

🛠️ Tech Stack

Frontend

• React.js
• CSS

Backend

• Node.js
• Express.js
• MongoDB Atlas
• JWT Authentication
• WebSocket for real-time data

APIs & Services

• Alpaca API – Real-time stock data
• TradingView – Optional charting integration

Visualization

• Three.js – 3D interactive visuals

---

Getting Started

Prerequisites

• Node.js & npm
• MongoDB Atlas account
• Alpaca API key (go here for keys)

Installation

1. Clone the repository:

   git clone https://github.com/kalviumcommunity/S64_DivyanshuVerma_Capstone_Stoxly.git
   cd S64_DivyanshuVerma_Capstone_Stoxly

2. Install dependencies:

   cd backend && npm install
   cd ../frontend && npm install

3. Set up environment variables:
   • Create .env files in backend directory (see .env.example).
4. Run the application:
   • Start backend:

     cd backend && npm run dev

   • Start frontend:

     cd frontend && npm run dev

Usage

• Register or log in to your account.
• Add stocks to your portfolio and track their performance in real time.
• Explore interactive charts and 3D visualizations.
• Stay informed with live news and market movers.

🚀 Quick Start with Docker

1. Create .env file

MONGODB_URI=your_mongodb_connection_string
JWT_SECRET=your_jwt_secret_key
ALPACA_API_KEY=your_alpaca_api_key
ALPACA_SECRET_KEY=your_alpaca_secret_key
GOOGLE_CLIENT_ID=your_google_client_id
GOOGLE_CLIENT_SECRET=your_google_client_secret

2. Run the app

docker-compose up --build

3. Open your browser

• Frontend: http://localhost:5173
• Backend API: http://localhost:5000

🛑 Stop the app

docker-compose down

Contributing

Contributions are welcome! Please open issues or submit pull requests for improvements, bug fixes, or new features.

License

This project is licensed under the MIT License. modern, real-time stock market portfolio tracking application built with React, Node.js, and MongoDB.