Vue Stock Watcher

Simple Vue 3 web application for a user to add basic stock tickers to a dashboard. Based on the foreUP stock watcher spec, but also includes a dark theme I created that is activated when your device is set to dark mode.

I have also made a Svelte version of this app.

The stocks are hard-coded. Here are the ones included:

• GOOG
• YHOO
• AIG
• UWTIF
• DWTIF
• GRPN

Recommended IDE Setup

VSCode + Volar (and disable Vetur).

Customize configuration

See Vite Configuration Reference.

Project Setup

npm install

Compile and Hot-Reload for Development

npm run dev

Compile and Minify for Production

npm run build

Lint with ESLint

npm run lint

Questions I would have liked to ask a designer

• Is the mobile view of the stock supposed to be a clean division between the left and right side, or is each corner of the box independent? How is the maximum length of the stock names determined?
• Should the percent change always display to two decimal points or as few as are required?
• Any styles for states such as hover or focus?