Theoretical Stonk Plays Project

Video Preview


In this project, you can look at stock charts, search for different charts based on their ticker symbol, and switch between different chart displays. However, the main feature of this project is the ability to make theoretical stock plays, which simply put, allows you to mimic how an actual stock play would go based on actions like stock price changes or adjusting your position. Afterwards, once you finish a play, you can end it by selling the entire position to see your ending metrics, or you can go back in the play. Your position in this theoretical stock play is displayed on a chart for better visualization of how your play would perform, along with a table displaying all the changing data.

Tech Used

For this project I made use of Nextjs, Typescript, and TailwindCSS, but the star of this project was Zustand. I used Zustand for the complex state management and defining how actions like changing the stock price, for example, would mutate other state variables. These state mutations were recorded in a step array which is how I implemented a back button and was able to create a table of data and chart display. As for the regular stock chart we are able to query stock charts from, I used a third party API to get the stock aggregate data to build those charts, more specifically, I used the stock API and fetched the data from there using dynamic search urls based on the value of the search input which is by default SPY.

Key take away

In this project I learned a tremendous amount about working with state and third party APIs which was the main goal of this project, but I learned a little more than just that, let me say it like this. This project has been something I always wanted to create because I knew from when I used to trade stocks that I would love a tool like this. Sure there is paper trading, but that's not at all close to what this is, paper trading is fundamentally different it just let's you pretend like you're actually trading stocks, this let's you create an actual plan with steps and gives you instantaneous values and changes that make it truly useful to someone not trying to calculate these complex changes to their position to make a theoretical stock play. But I digress, the key take away I gained from this project was not only a greater understanding of state logic and APIs, but a better idea on what coding is all about, to make something you truly believe is useful.