|
1 |
| -# Stock Portfolio Tracker 📈 |
| 1 | +# Portfolio Tracker |
2 | 2 |
|
3 |
| -<div align="center"> |
| 3 | +A modern portfolio tracking application built with React, Vite, and Supabase. |
4 | 4 |
|
5 |
| -[](https://portfolio-tracker-hackstyx.vercel.app) |
6 |
| -[](https://portfolio-tracker-backend-y7ne.onrender.com/api) |
7 |
| -[](https://reactjs.org/) |
8 |
| -[](https://vitejs.dev/) |
9 |
| -[](https://supabase.com/) |
10 |
| -[](https://tailwindcss.com/) |
11 |
| -[](https://nodejs.org/) |
12 |
| -[](https://finnhub.io/) |
13 |
| -[](https://hackstyx.github.io/portfolio-tracker/) |
| 5 | +## 🚀 Deployment Status |
14 | 6 |
|
15 |
| -<p align="center"> |
16 |
| - <strong>A modern, responsive stock portfolio tracker built with React and Node.js</strong> |
17 |
| -</p> |
| 7 | +- **Frontend**: [https://portfolio-tracker-hackstyx.vercel.app/](https://portfolio-tracker-hackstyx.vercel.app/) |
| 8 | +- **Backend**: [https://portfolio-tracker-backend-eh7r.onrender.com](https://portfolio-tracker-backend-eh7r.onrender.com) |
| 9 | +- **Database**: Supabase |
18 | 10 |
|
19 |
| -[Live Demo](https://portfolio-tracker-hackstyx.vercel.app) • [API Documentation](https://hackstyx.github.io/portfolio-tracker/) • [Report Bug](https://github.com/HackStyx/portfolio-tracker/issues) |
| 11 | +## Features |
20 | 12 |
|
21 |
| -> **Note**: Due to the free tier limitations of Render, the initial load of the demo might take 30-60 seconds. If no data appears, please refresh the page. If issues persist, click the logout button to reset the application state. The backend spins down after 15 minutes of inactivity and needs time to restart. |
| 13 | +- Real-time stock tracking |
| 14 | +- Portfolio management |
| 15 | +- Watchlist functionality |
| 16 | +- Market calendar |
| 17 | +- News integration |
| 18 | +- Dark/Light theme |
| 19 | +- Responsive design |
22 | 20 |
|
23 |
| - |
| 21 | +## Tech Stack |
24 | 22 |
|
25 |
| -</div> |
| 23 | +- **Frontend**: React 18, Vite, Tailwind CSS, Tremor UI |
| 24 | +- **Backend**: Node.js, Express.js |
| 25 | +- **Database**: Supabase (PostgreSQL) |
| 26 | +- **Authentication**: Supabase Auth |
| 27 | +- **Stock Data**: Finnhub API |
| 28 | +- **Deployment**: Vercel (Frontend), Render (Backend) |
26 | 29 |
|
27 |
| -## ✨ Features |
| 30 | +## Getting Started |
28 | 31 |
|
29 |
| -- 📊 **Portfolio Management** - Track your stocks with real-time updates |
30 |
| -- 👀 **Watchlist** - Monitor potential investments |
31 |
| -- 🌓 **Dark/Light Mode** - Easy on the eyes, day and night |
32 |
| -- 📱 **Fully Responsive** - Perfect on desktop and mobile |
33 |
| -- 🔄 **Live Updates** - Real-time stock prices via Finnhub API |
34 |
| -- 📈 **Price History** - Visualize stock performance with historical data |
35 |
| -- 💹 **Market Data** - Real-time quotes and market status tracking |
36 |
| -- 🎯 **Price Targets** - Set and monitor stock price targets |
| 32 | +1. Clone the repository |
| 33 | +2. Install dependencies: `npm install` |
| 34 | +3. Set up environment variables (see `.env.example`) |
| 35 | +4. Start development server: `npm run dev` |
37 | 36 |
|
38 |
| -## 🚀 Quick Start |
| 37 | +## Documentation |
39 | 38 |
|
40 |
| -### Prerequisites |
41 |
| - |
42 |
| -- Node.js 14+ |
43 |
| -- npm or yarn |
44 |
| -- Supabase account |
45 |
| -- Finnhub API Key (get one at [finnhub.io](https://finnhub.io/)) |
46 |
| - |
47 |
| -### Frontend Setup |
48 |
| - |
49 |
| -1. Clone and install: |
50 |
| -```bash |
51 |
| -git clone https://github.com/HackStyx/portfolio-tracker.git |
52 |
| -cd portfolio-tracker |
53 |
| -npm install |
54 |
| -``` |
55 |
| - |
56 |
| -2. Create `.env`: |
57 |
| -```env |
58 |
| -VITE_API_BASE_URL=http://localhost:5000/api |
59 |
| -``` |
60 |
| - |
61 |
| -3. Start development server: |
62 |
| -```bash |
63 |
| -npm run dev |
64 |
| -``` |
65 |
| - |
66 |
| -### Backend Setup |
67 |
| - |
68 |
| -1. Setup backend: |
69 |
| -```bash |
70 |
| -cd backend |
71 |
| -npm install |
72 |
| -``` |
73 |
| - |
74 |
| -2. Configure `.env`: |
75 |
| -```env |
76 |
| -SUPABASE_URL=your_supabase_url |
77 |
| -SUPABASE_KEY=your_supabase_anon_key |
78 |
| -PORT=5000 |
79 |
| -FINNHUB_API_KEY=your_finnhub_api_key |
80 |
| -``` |
81 |
| - |
82 |
| -3. Set up Supabase: |
83 |
| - - Follow the instructions in `backend/SUPABASE_SETUP.md` |
84 |
| - |
85 |
| -4. Test connection and start: |
86 |
| -```bash |
87 |
| -npm run init-db |
88 |
| -npm start |
89 |
| -``` |
90 |
| - |
91 |
| -## 🔌 API Documentation |
92 |
| - |
93 |
| -Our API is fully documented and available at [https://hackstyx.github.io/portfolio-tracker/](https://hackstyx.github.io/portfolio-tracker/) |
94 |
| - |
95 |
| -### Base URL |
96 |
| -``` |
97 |
| -https://portfolio-tracker-backend-y7ne.onrender.com/api |
98 |
| -``` |
99 |
| - |
100 |
| -### Key Endpoints |
101 |
| - |
102 |
| -#### Portfolio Management |
103 |
| -```http |
104 |
| -GET /stocks # Get all stocks in portfolio |
105 |
| -POST /stocks # Add new stock |
106 |
| -PUT /stocks/:id # Update existing stock |
107 |
| -DELETE /stocks/:id # Remove stock from portfolio |
108 |
| -``` |
109 |
| - |
110 |
| -#### Watchlist Management |
111 |
| -```http |
112 |
| -GET /watchlist # Get watchlist items |
113 |
| -POST /watchlist # Add stock to watchlist |
114 |
| -DELETE /watchlist/:id # Remove from watchlist |
115 |
| -``` |
116 |
| - |
117 |
| -#### Market Data |
118 |
| -```http |
119 |
| -GET /stocks/:ticker/quote # Get real-time stock quote |
120 |
| -GET /stocks/:ticker/history # Get historical price data |
121 |
| -GET /stocks/summary # Get portfolio analytics |
122 |
| -``` |
123 |
| - |
124 |
| -For detailed API documentation including: |
125 |
| -- Request/Response formats |
126 |
| -- Authentication details |
127 |
| -- Rate limiting |
128 |
| -- Error handling |
129 |
| -- Code examples |
130 |
| - |
131 |
| -Visit our [API Documentation](https://hackstyx.github.io/portfolio-tracker/) |
132 |
| - |
133 |
| -## ⚡️ Tech Stack |
134 |
| - |
135 |
| -### 🎨 Frontend |
136 |
| -- **Framework**: [React](https://reactjs.org/) - A JavaScript library for building user interfaces |
137 |
| -- **Build Tool**: [Vite](https://vitejs.dev/) - Next generation frontend tooling |
138 |
| -- **Styling**: |
139 |
| - - [TailwindCSS](https://tailwindcss.com/) - Utility-first CSS framework |
140 |
| - - [Tremor](https://www.tremor.so/) - React library for dashboards and charts |
141 |
| - - [Framer Motion](https://www.framer.com/motion/) - Animation library |
142 |
| -- **State Management**: React Context API |
143 |
| -- **HTTP Client**: [Axios](https://axios-http.com/) - Promise based HTTP client |
144 |
| - |
145 |
| -### 🛠 Backend |
146 |
| -- **Runtime**: [Node.js](https://nodejs.org/) - JavaScript runtime |
147 |
| -- **Framework**: [Express](https://expressjs.com/) - Web framework for Node.js |
148 |
| -- **Database**: [Supabase](https://supabase.com/) - Open source Firebase alternative |
149 |
| -- **Market Data**: [Finnhub](https://finnhub.io/) - Real-time RESTful APIs for stocks |
150 |
| -- **API Documentation**: [Github Pages](https://hackstyx.github.io/portfolio-tracker/) |
151 |
| - |
152 |
| -### 🚀 DevOps & Infrastructure |
153 |
| -- **Frontend Hosting**: [Vercel](https://vercel.com/) |
154 |
| - - Zero-config deployments |
155 |
| - - Automatic HTTPS |
156 |
| - - Edge Network for optimal performance |
157 |
| -- **Backend Hosting**: [Render](https://render.com/) |
158 |
| - - Containerized deployment |
159 |
| - - Automatic scaling |
160 |
| - - Built-in monitoring |
161 |
| -- **Database Hosting**: [Supabase](https://supabase.com/) |
162 |
| - - PostgreSQL database |
163 |
| - - Automated backups |
164 |
| - - High availability |
165 |
| - |
166 |
| -### 📦 Additional Tools |
167 |
| -- **Version Control**: Git & GitHub |
168 |
| -- **Code Quality**: ESLint & Prettier |
169 |
| -- **API Testing**: Thunder Client |
170 |
| -- **Environment Variables**: dotenv |
171 |
| -- **Security**: CORS |
172 |
| -- **Real-time Monitoring**: UpTimeRobot |
173 |
| - |
174 |
| -## ⚠️ Limitations |
175 |
| - |
176 |
| -- Uses simulated stock data when Finnhub API rate limit is reached |
177 |
| -- Single-user environment |
178 |
| -- Price updates every minute |
179 |
| -- Best viewed in modern browsers |
180 |
| -- Backend spins down after 15 minutes of inactivity and needs time to restart |
181 |
| -- Limited to 60 API calls per minute (Finnhub free tier) |
182 |
| - |
183 |
| -## 📄 License |
184 |
| - |
185 |
| -This project is licensed under the MIT License. |
186 |
| -[](https://opensource.org/licenses/MIT) |
187 |
| - |
188 |
| -For more information, see the [LICENSE](LICENSE) file in the repository. |
189 |
| - |
190 |
| - |
191 |
| - |
192 |
| -<div align="center"> |
193 |
| - <p>THANK YOU FOR VISITING ❤️</p> |
194 |
| -</div> |
195 |
| - |
196 |
| -<p align="center"> |
197 |
| - <img src="https://raw.githubusercontent.com/catppuccin/catppuccin/main/assets/footers/gray0_ctp_on_line.svg?sanitize=true" /> |
198 |
| -</p> |
| 39 | +See [DEPLOYMENT_GUIDE.md](./DEPLOYMENT_GUIDE.md) for detailed deployment instructions. |
0 commit comments