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 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

Company : Apple,
Symbol : AAPL
StockExchange : NASDAQ

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 and append /one/ to the URL immediately after
  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 🙂

7 thoughts on “Stock Market Updates Lightning Component

    Neha said:
    August 13, 2015 at 7:15 am

    Stocksymbol is your custom object?? if yes i created 1 custom object but it was not available to add into avalable tab for salesforce1


    Neha said:
    August 13, 2015 at 10:30 am

    I have mailed you.. Please reply on that.


    Vishnu Vaishnav said:
    August 13, 2015 at 3:02 pm

    Reblogged this on Vishnu Vaishnav and commented:
    Reblogged To


    cloudmech said:
    August 23, 2015 at 3:03 pm

    Nice looking App. It’s unfortunate you didn’t include your component code as part of your blog. It would have been much more useful to those of us who have an interest in developing Lightning Components.


      balkishankachawa responded:
      August 24, 2015 at 4:39 am

      Thanks for your words.I have mentioned in this article that you can send me an email if you need complete package.
      I will give you package link on your email id(


    jayanth said:
    September 30, 2015 at 9:42 am

    please send me the package code on my email


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s