Stock Updates

Stock Market Updates Lightning Component

Posted on Updated on

Hi All,

In this article, I will be showing you how to build a stock quote Lightning Component with HighChartTable chart and Yahoo’s YQL(Yahoo Query Language) web service.You can use this component to see Stock Market Updates of any Company and of any StockExchange provided by Yahoo API.Sometimes this API may not work like other APIs but do not worry it will start working.

YQL is like SOQL language that allows you to query, filter and combine data from multiple sources across both the Yahoo! network and other open data sources.Yahoo made things easy on us by providing a very intuitive console for accessing data via the API.You can read complete documentation about YQL.HighChartTable charts are used to represent your data as Charts and Graphs.HighChartTable chart can not be used for commercial purpose.

Screenshot_2015-08-12-19-40-00 Screenshot_2015-08-12-19-39-39

Send me an email on balkishan.kachawa@gmail.com for StockUpdates component package.

Installation Instructions

Follow the steps below to install the Stock Update component and create the application in your own Developer Org.

Step 1: Install the Component

  1. Enable Lightning Components in your new Developer Org:
    In Setup, click Develop > Lightning Components, check the Enable Lightning Components checkbox, and click Save.

Step 2: Enter Sample Data

  1. Click the StockSymbols tab and enter your favourite Company’s records with their Symbol and Stock Exchange Name.
    For example, enter the following values:

Salesforce :
Company : Salesforce,
Symbol : CRM
StockExchange : NYSE

Apple
Company : Apple,
Symbol : AAPL
StockExchange : NASDAQ

Google
Company : Google,
Symbol : GOOG
StockExchange : NASDAQ

Step 3: Add the StockUpdates Component to the Salesforce1 Menu

  1. In Setup, select Administer > Mobile Administration > Mobile Navigation
  2. Select StockUpdates in the Available list
  3. Click the Add button to add the StockUpdates tab to the Selected list
  4. Click the Up button to move the StockUpdates tab closer to the top of the menu and Click Save

Step 4: Test the Component in the Salesforce1 Application

  1. In Salesforce, remove the part of the URL that comes immediately after salesforce.com and append /one/one.app to the URL immediately after salesforce.com
  2. This starts the Salesforce1 Application simulator
  3. Click the menu button in the upper left corner
  4. Select Stock Updates in the menu
  5. Select any company from drop down list

Final result will look like this :

So That’s It Simple 🙂