https://github.com/pintu544/stock_dashbaord

Modern investors need real-time insights into their portfolio performance to make informed decisions—whether to buy, sell, hold, or add to positions. This case study challenges you to build a dynamic web application that displays portfolio information, fetching live data from financial APIs.
https://github.com/pintu544/stock_dashbaord

lucide-react recharts tanstack-table xlsx yahoo-finance-api

Last synced: about 2 months ago
JSON representation

Modern investors need real-time insights into their portfolio performance to make informed decisions—whether to buy, sell, hold, or add to positions. This case study challenges you to build a dynamic web application that displays portfolio information, fetching live data from financial APIs.

• Host: GitHub
• URL: https://github.com/pintu544/stock_dashbaord
• Owner: pintu544
• Created: 2025-06-30T17:17:54.000Z (4 months ago)
• Default Branch: main
• Last Pushed: 2025-06-30T17:34:47.000Z (4 months ago)
• Last Synced: 2025-06-30T18:35:45.001Z (4 months ago)
• Topics: lucide-react, recharts, tanstack-table, xlsx, yahoo-finance-api
• Language: TypeScript
• Homepage: https://stock-dashbaord-pro.vercel.app
• Size: 125 KB
• Stars: 0
• Watchers: 0
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          


README:

• Setup and Usage Instructions:

a) Installation:

– Clone the repository.

– Install dependencies by running:

npm install

b) Running the App:

– In development mode:

npm run dev

– The dashboard should be accessible at localhost:3000.

c) Configuration:

– Include environment variables for financial data fetching (if needed).

– Provide guidance on where to add or configure API keys or unofficial libraries if required.

d) Troubleshooting:

– Common issues with scraping or rate limiting.

– Potential fallback strategies.

Technical Document:

A concise write-up highlighting:

• Key Challenges:

– Unofficial finance APIs and the need for scraping/rate-limit handling.

– Ensuring real-time table updates and color-coded gain/loss indicators.

– Data accuracy and error handling for both front-end and back-end.

• Solutions Implemented:

– Use of Next.js caching or memoization to handle high load and reduce repeated API calls.

– An interval-based update system (e.g., every 15 seconds) for live data fetch.

– A robust data model to store and group data by sector.

– React hooks and asynchronous functions for parallel API requests and dynamic rendering.

• Known Limitations and Future Enhancements:

– Potential breakage due to changes in Google/Yahoo pages.

– Additional caching strategies or use of a dedicated financial data service to improve reliability.

– Possible integration of WebSockets for more efficient real-time updates.