How to use lightning component on any external platform using Lightning Out Feature

Overview:

In this blog, we will go through steps for using Lightning Out to run Lightning Components outside of the Salesforce server. We will be running the lightning component on Localhost server.

Pre-requisites:

• Configuration in Salesforce for Connected App and CORS.
• Lightning Dependency App in Salesforce.
• We will be using the Node Js to make a server-side call.
• OpenSSL to create a Self-Signed Certificate.

Solution:

Follow the below steps to operate your lightning component from localhost.

Step 1: Whitelists the localhost URL in CORS from Salesforce

The Same-Origin-Policy restricts the browser to make a request to/from the same domain. So to make your origin (external application) able for sending XMLHttpRequest to Salesforce, we will have to whitelist domain of the external application in CORS from Salesforce as shown in the below screenshot.

Step 2: Create a Connected App in Salesforce  

From many ways to authenticate Salesforce from an external website, let's use the most secure way which is OAuth. To use OAuth, you need to create a Connected App. Connected App provides different types of permission settings to allow external websites to use after authentication. Do not forget to set the callback URL in your Connected App.

 

 

Step 3: Create Lightning Dependency App  

To make this app accessible outside of Salesforce, make sure you do not forget the below points, 

• The Lightning App must be globally accessible, which means that access must be defined as global. 
• The ltng:outApp must be extended to allow you to use it outside the lightning framework / Salesforce. 
• To make use of the Aura component as part of Lightning Out, it should be defined as the aura:dependency.
  
  

<aura:application access="Global" extends="ltng:outApp">
      <aura:dependency resource="c:LCSearchFirst" />     
      <aura:dependency resource="c:LCSearchDataTable"/>  
</aura:application> 

Step 4: Generate an X.509 Certificate using OpenSSL 

Generate a valid Self-Signed Certificate for localhost development by running two commands shown in a given reference link.

These commands will create .pem and .crt files, which we will use in the Node.js application to provide a secure connection between two servers.

Step 5: Create Node.js application to make a server call

Create a Node.js application that will use to run on the localhost to make a server call. In this application, use X509 and allow CORS for the localhost.

Step 6: Create a page to host Lightning Component 

To use the Lightning component in your external application, you need to import Lightning out JavaScript in the page hosting your Lightning component, refer to the below markup :  

<script src="https://YOURDomain.lightning.force.com/lightning/lightning.out.js"></script> 

Output:

You can find the complete source code of this blog post from Github

Conclusion:

    

By following the above steps, you can run or host any Lightning Component from your Salesforce server to the localhost. You can implement the same for other platforms also such as Heroku, SharePoint.

If you have any questions you can reach out our Salesforce Consulting team here.

Reimagine your sales process with Sales Cloud

Selling can be challenging. It’s like observing a complex process of human behavior that have no particular shortcut. Sales drive the business. You know that closing a sale is vital to your growth and success.  

Even the highest performing sales teams face obstacles in developing buyer relationships and effectively communicating with prospects and customers. What sets successful companies apart is their ability to overcome sales challenges.  

What if there Is a solution that makes this process easier for a sales guy! A single platform to manage end-to-end functioning of sales department, creating campaigns, managing customers contacts, triggering emails, reports and dashboard features and many more.   

Well here comes a wonderful enterprise product that is offered by Salesforce- SALES CLOUD.  

 

Source: - Salesforce.com/ Sales Cloud overview 

 

The aim of Salesforce Sales cloud is to automate the Sales process, facilitate both Sales manager and representatives. Relevant Sales cloud feature help to create a well-structured sales process, provides considerable customer details and maintain efficient customer communication via multiple channels. Sales cloud can bring your sales more value if it’s properly customized and configured. 

 

 

Source: - Salesforce customer success metrics survey 

 

Key Business Objectives Achieved by Salesforce Sales Cloud: 

-Get more deals 

Continuous improvement of campaigns depending on the market response and closure interactions with channel partners to get more deals. 

-Close more deals 

The accessibility of all the product and account information for customer’s needs makes it easier to drive a greater number of leads to closure.  

-Close deals faster 

Mobile apps and visual design of the workflows for business process approvals make it faster to close the deals. 

-Quicker Choices 

The accessibility of reports and dashboards give a detailed picture of the business scenario, further more expands the precision of sales forecasting. 

 

Key Features of Sales Cloud 

 

1)Account and Contact Management 

Gives Complete information about customers to trace all the previous discussions, conversations, mail Id’s and key contacts. 

2)Work Process and Approvals 

Helps simplify the approval process and automate business process using drag and drop interface. 

3)Opportunity Management 

Stay associated with the individuals and data you have to bring every deal to close. See quotes, competition, stage, products and much more. 

4)Sales Forecasting 

Gives accurate view of sales forecasting which can be adjusted based on real time data. 

5)Mobile 

Mobile Applications transform your cell phone into convenient work space. You can check dashboards, react to leads, call logs regardless of where you are. 

6)Sales Data 

Helps creating link between sales data and sales goals. Also helps in creating performance summaries. 

7)Lead Management 

While constantly upgrading your campaigns over each channel, track your leads. Helps assign lead to right people. 

8)Reports and Dashboards 

Helps create dashboards which can be deepen for further information. This will lead to make decisions faster. 

9)File sync and share 

For faster collaboration this feature will help you to search, share and find files faster. 

 

Some of the other Features: 

1)Email Integration 

Salesforce e-mail service accesses your Gmail and outlook inboxes to synchronize emails. Users can view contacts as well as calendars from any device after integration. It enables you to sell your products and services smatter with help of built-in intelligence. 

2)Salesforce Engage 

Salesforce CRM boosts customer engagement by sending personalized messages. Also allow monitoring campaigns performance. Thus, you can analyze most impactful element in your sales pipeline. 

3)Territory Management 

Helps to manage territory assignments, rules and new hierarchies. The assigned users can identify their colleagues with the help of territory rules.  

4)Partner and Channel Management 

Create the ecosystem of your partners quickly with app. Personalize partner recruitment, onboarding and sales with Partner Relationship Management (PRM). 

 

Salesforce Sales Cloud Edition: 

1)Essential Edition 

2)Professional Edition 

3)Enterprise Edition 

4)Unlimited Edition 

 

As you can assemble from the above that sales cloud is intended to help you to sell services and products as well as support those services and products. 

So, when are you adding Salesforce Sales Cloud into your workspace? 

Once in a while it would be reasonable to think about Binary Republik SFDC before stepping towards sales cloud. You can also look at our work page to see the expertise and the type of projects we have executed: -  https://salesforce.binaryrepublik.com/work/ 

 

 If you have any questions you can reach out our Salesforce Consulting team here.