NextJS Stock Market Website | Full Stack Web Development
James Musser
A client that had created a custom stock market index and was looking to have a professional website built to replace his current excel spreadsheet and make the data more presentable. The goal was to have the website update automatically with real time stock market data and to include responsive performance charts and tables, along with a list of other necessities.
Building this web application involved:
Building a Python backend that runs on a cron schedule. This backend was connected with the Alpha Vantage stock market API, where it pulled data from a list of relevant companies, cleaned/reformatted the data, performed thousands of calculations to determine the custom stock market index data over a range of days, then updated the data in a MongoDB database. The backend was kept as separate as possible from the NextJS application and the JSON outputs kept to a minimum in order to ensure optimal performance on the frontend
Building a NextJS application for the frontend that would regularly pull data from the MongoDB database to automatically update the stock market data in real time on the client side (and on the server side, where more efficient and when not affecting UX)
Custom charts built with ChartJS/react-chartjs-2 to show performance of stock market ETF's and individual companies
Tailwind CSS used for frontend styling
The live deployed website can be viewed here:
A video showing the website can be viewed here:
Like this project
Posted Oct 14, 2024
Custom stock market monitoring website built with Python, MongoDB, Tailwind CSS, and NextJS.
