Fullstack Stock Ticker Charting App Retrospective


The fullstack stock ticker charting app allows the user to search for stock prices by ticker symbols. It uses ChartJS to chart the results and uses socket.io to update in real time any browsers viewing the application. I used a stock market API called AlphaAdvantage to query for stock prices.

This was my favorite of all of the freeCodeCamp backend projects. I think mostly because of how fun web sockets are to work with. There was also no need to store anything in a database, so that simplified things quite a bit.

Code Review

The simplest part of this project was the actual web socket portion of it. This is a fairly straightforward websocket connection, so it felt a bit like all I was doing was passing the API data through the socket and back to my project. I found web sockets to be very fun to work with, and was excited to get my app updating in real time in second browser.

This was also the first time I'd used ChartJS. It made a lot of since after working with D3 and ngx-charts in previous projects. I'm sure there is refactoring that could be done on the ChartJS and web socket code to improve them.

Future Improvements

There are a few places that could use some love. When the user searches for a stock ticker, a little card is appended to the DOM below the chart in the browser window where they performed the search. I didn't pass that through the websocket, so you don't see those cards in the 'listening' browser windows.

The AlphaAdvantage API seems like it moves at a crawl. They gave the option to pay for faster API access, but I couldn't find a good replacement at the time that was free to use. It would be nice to replace that with something that doesn't take so long.

  • Pass ticker cards through the socket to display those properly in all browser windows.
  • Find a better stock market API that runs faster than AlphaAdvantage.