Learn Courses My Dashboard

Wildsparrow's journal (monthly challenges)

After successfully participating in the first CWC monthly challenge (weather app), I decided to participate in every monthly challenge. Thus, I will dedicate this journal to all current and future monthly challenges.

Let’s start with the May challenge: A stock tracker app.

Thinking about all the possibilities you could show with stocks and my current SwiftUI knowledge :smiley: , here is my plan for the app:

  • One page app. No pop ups, overlays or similar
  • No assets: All graphics should be done by using shapes and colors.
  • Showing the most relevant data of stocks in a tile, i.e. stock name, current price, day high/low, annual high/low
  • Add stock to tiles, removes stocks from tiles. Probably 5 tiles with stocks. When in removing mode, “-” should appear on the top right corner of the tiles. Nice to have: Tiles should shake during this process. For adding stocks: There should be a text field in a tile and a “+” sign.
  • (If I can figure out how) Graph showing the closing prices of the last week (maybe month or year - will decide during coding)

Layout:

2 Likes

Awesome plan. Looking forward to How you do it.

1 Like

I couldn’t spend a lot of time in the last couple of days for programming, but as I will be on vacation next week, I should be able to finish this project within the next couple of days.

For the background, I looked into this and adapted the code to my needs: https://youtu.be/YhhGx0pLOnk
The theme is based on the main colors of the Nasdaq, green, purple, blue.
Looks better in reality, but for easy showing I created a GIF which lacks some smooth color transitions.

The stock tiles (all read Apple at the moment) are scrollable horizontally.

For the line chart, I imported GitHub - AppPear/ChartView: ChartView made in SwiftUI and placed it on top of a black rectangle.

Things to do:

  • Get the data from a stock API (maybe https://marketstack.com )
  • Fill in the stock tiles with real data (creating an array with the “add ticker symbol” and “remove” buttons)
  • Pass the data to the line chart
  • Alter the line chart based on the weekly, monthly or yearly data
1 Like