TradeTrack — Trading Dashboard Simulation Platform
TradeTrack is a simulated trading dashboard inspired by modern stock trading platforms. I built this project to practice frontend-heavy application design, authentication flows, data visualisation, and end-to-end MERN architecture.
The focus of this project was not real trading, but building a realistic dashboard experience using simulated data.
Problem I Wanted to Solve
Many trading platforms have complex interfaces that combine large amounts of data, charts, and user actions in one place. I wanted to build a project that mimics this complexity to better understand:
- Dashboard-style UI design
- Managing multiple data views (holdings, positions, orders)
- Authentication and session handling
- Chart-based data visualisation
What I Built
TradeTrack includes the following functionality:
- Secure user authentication (simulated accounts)
- Dashboard views for holdings, positions, and orders
- Simulated order placement and historical data
- Interactive charts for visualising trading data
- Fully responsive UI for desktop and mobile devices
All data is simulated and stored in the database for learning purposes.
Tech Stack
- Frontend: React, Bootstrap, Material UI
- Charts: Chart.js
- Backend: Node.js, Express
- Database: MongoDB (MongoDB Atlas)
- Authentication: Passport.js (local strategy)
Architecture & Design
The project is structured as a multi-part MERN application:
- React-based landing page
- React dashboard application for authenticated users
- Express backend with MongoDB models
This separation helped keep the dashboard logic, API layer, and data models organised and maintainable.
Challenges & Solutions
- Complex UI layout → broke dashboard into reusable components
- Handling multiple datasets → structured backend responses clearly
- Authentication flow → implemented session-based login using Passport.js
- Responsive design → tested layouts across screen sizes
Results
- Built a realistic trading dashboard experience using simulated data
- Gained confidence working with dashboard-heavy UIs
- Improved understanding of authentication and data visualisation
- Strengthened MERN full-stack development skills
What I Learned
This project helped me improve my skills in:
- Designing complex dashboard interfaces
- Managing application state across multiple views
- Working with chart libraries for data visualisation
- Structuring larger MERN applications
Links
- Live Demo: https://trade-track-front.vercel.app
- GitHub: https://github.com/Noobod/TradeTrack