Skip to content

A stock market portfolio application made with only vanilla JS

Notifications You must be signed in to change notification settings

nickmendezFlatiron/Signals

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

96 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Signals

Signals

Overview

Signals is a stock market tool for trading ,research, and analysis. Signals simplifies the fundamental uses of advanced trading tools into a user-friendly interface. No previous experience with any stock market tools is required. Use Signals to keep up to date with daily updated fundamental trading information and stock quotes, as well as real-time charting capabilities. Keep track of your favorite stocks and personal trades with localhost database.

Installation

Follow these instructions to fork and clone this repository

Run in terminal - json-server --watch db.json to setup localhost database

Note: Make sure to install node.js first

Signals Features

Signals Interface

1. Navigation Bar

  • Note : The tabs on the lefthand side of the navigation bar are features that I hopefully will be able to add into the Signals app as I learn more through the SE bootcamp.
  • The Toolbox consists of 2 different tools, formatted in a dropdown menu style. The Watchlist displays all of the different stocks you have added to your
  • The Search bar populates the Toolbox display (#3) with the top 5 best-matching stock symbols(ticker) based on keywords of your choice, in descending relevancy.

2. Main Display

  • The Main Display lists all relevant data for the selected stock, formally known as a stock quote. Select a stock by clicking on it in either the Search Results list or Watchlist in the Toolbox display area.
    • Green values indicate an increase compared to the previous day
    • Red values indicate a decrease compared to the previous day
  • Change charts by clicking on the top left corner of the chart, where the ticker is displayed, and enter the ticker indicated in section 2 next to Symbol.
  • The chart widget allows the user to technically analyze stock price action and plan trades through multiple indicators and timeframes
  • The Watchlist button allows a user to build a stock watchlist. The watchlist is stored in the localhost database "watchlist". The watchlist button is highlighted blue when the stock is added to the Watchlist. There is no limit to how many stocks a user can watch
  • The Buy/Sell dropdown allows you to execute simulated stock trades. Enter a quantity , select either "buy" or "sell" from the dropdown, and hit the "enter" button to execute the trade.

3. Toolbox Display

  • This area is where the information from the selected Toolbox tool is displayed. This area is automatically populated with a list of the top 5 search results whenever a user runs a new stock search.
  • Select Watchlist from the Toolbox to view all watched stock tickers.
  • Click on any of the listed stock tickers for an up to date stock quote

4. My Portfolio

  • My portfolio is built based on the trades executed by a user
  • Click the refresh button to update My portfolio in real time
  • My portfolio stores all of your positions in a local database "portfolio"
  • Displays the Ticker , Quantity of shares , and latest daily close price for that ticker

5. Trading History

  • Note: clearing the trading history will also clear all trades
  • Trade history displays every trade a user has executed.
  • Specifies the type of trade, the ticker traded, the quantity, and price at the time of the trade
  • Click on the refresh button to update your trade history in real time
  • Trading History stores all of your positions in a local database "trade-history"

Example

  • A user wants the latest information on Tesla , but does not know the ticker symbol.
  • User enters "Tesla" in the Search bar and selects the most relevant symbol (the first one)
  • Tesla, we now know as TSLA , has its latest stock quote populated in the main display
  • User wants to set up a trade based on price action. User enters TSLA into the chart widget and uses the tools and indicators to decide whether or not they want to execute a trade.
  • If user wants to execute a trade now, then they enter the quantity and select a trade type from the dropdown, and click enter
  • If user wants to execute a trade later, but doesn't want to search for TSLA again, then they add it to their watchlist by clicking on the watchlist button.
  • User believes TSLA is undervalued and buys 10 shares at market price. They submit their trade and click the refresh button on "My Portfolio" to see their current position in TSLA stock.

Future Ideas

  • My Signals tab : I'd like to build an easy way for people to build their own automated trade strategies because currently, the only way to develop algorithmic trade strategies is by knowing how to code. The barrier to entry is high , especially for those who would like automate their trades but do not have the time to learn to code. These automated trade strategies and alerts made by a user would be called Signals.
    • Also, I haven't found any platforms that allow you to execute such strategies against historical data. Ideally, a user can test their Signals against historical data before they made their Signal live.
  • Community tab : This is a forum style messageboard where Signals users can communicate ideas with one another , help one another with building their own Signals, and post discussions.
  • Marketplace : This is where users can buy, sell, and trade their Signals. I'd set up different price models and have some type of standardized performance rating system for all Signals listed on the Marketplace.

Sources

License

  • This app is free for everyone to use non-commercially

Contributors

About

A stock market portfolio application made with only vanilla JS

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published