Skip to main content

Salesforce Lightning and Fitbit

In this article let's see how to integrate Fitbit and Salesforce. Fitbit is the one of the popular health activity tracking device which will monitor your steps, calories, heart rate, distances walked and lot more features. Here we are going to build a simple Lightning component to display the Fitbit data in the salesforce. You will be learning about following in this article

  • How to connect with Fitbit API
  • How to use Auth. Provider and Named Credential for External application authentication process
  • How to integrate with Fitbit using Lightning Components
  • How to use Lightning Design Systems for the new Lightning Experiences
Step 1: Connect to Fitbit

Fitbit provides API access for developers to get your activity data from the external application.All your activity data from your Fitbit device will be synced with your Fitbit account when your device is connected to the Internet. In order to get those information, we have to authenticate with the Fitbit application. Authentication with the external web application in salesforce is made simple with the help of Auth. provider and Named credentials in the salesforce. As a first step, let's register an app in the Fitbit for the authentication flow

  • Go to https://dev.fitbit.com/apps
  • Click Register An App and fill all the mandatory fields
  • Make sure that you have entered Client in the "OAuth 2.0 Application Type "
  • Choose the default "access type" as "Read-only", since we are not going to write anything in Fitbit using this application
  • Leave the Callback URL as blank, we will add the value after the Step 2
  • Click save

It will display the client Id, consumer key and Authorization URLs for the application, which we will going to use in our next step for the authentication

Step 2: Auth. Provider and Named credentials

Let's add Fitbit registered application information in the salesforce external authentication provider for the authentications. Follow the below steps to create Auth. Provider and Named credentials

Auth. Provider:  Follow the below steps to add Auth.provider for the Fitbit
  • Setup > Security > Auth. Providers > Click New
  • Select the Provider Type as "Open Id Connect"
  • Enter the Name for the Auth. Provider
  • In the Consumer Key, copy and paste the OAuth 2.0 client Id from the Fitbit Register App
  • In the Consumer secret, copy and paste the Client(consumer) secret from Fitbit registered app
  • Add Authorize Endpoint URL as https://www.fitbit.com/oauth2/authorize
  • Add Token Endpoint URL as https://api.fitbit.com/oauth2/token
  • In the default, scopes add values as "activity profile settings heartrate location nutrition sleep social weight"
  • Click Save
Now copy the callback URL from the Auth. Provider and add in the Fitbit registered app callback URL information.



Name Credential: Follow the below steps to create named credential

  • Goto Setup > Security > Named Credential > Click New
  • Enter the Label as "Fitbit" [This name will be used in the code, if you are giving different name make sure to update the apex controller class]
  • Enter https://api.fitbit.com/ in the URL
  • In the Identity Type select "Named Principle"
    • Note: You can also choose "Per User" in the Identity type if you selected then follow this link to enable this Named credential for the users whom you want to enable.
  • Select "OAuth 2.0" in the Authentication Protocol
  • In the Authentication Provider click the lookup icon and selected [select or selected] the Auth. provider which we created in the previous step
  • Enable the checkbox "Start Authentication Flow on Save"
  • Click Save
  • Now it will open the Fitbit login page. 
  • Login with your Fitbit credentials and allow the access

Step 3: Lightning Components and Lightning Design system

We have used the Lightning Design system for the UX which gives the native salesforce new Lightning experiences to our page. You can find more details about Lightning Design System in this Link - https://www.lightningdesignsystem.com/

Apex controller Below apex controller class method to send the HTTP request to get the Fitbit user details

Lightning Component Lightning helper to call the apex controller class and assign the value to the component attribute

Lightning Design system Below is the Lightning design system code for the card view

Below is the final output of the Lightning app



The complete source code of the Lightning components available here - https://github.com/Karanraj/Lightning-Fitbit

Summary:
Congrats! We have developed a lightning app which integrates with your Fitbit device. You have also used the salesforce new Lightning design system for the UI.

Related Resources

Comments

  1. This concept is a good way to enhance the knowledge.thanks for sharing. please keep it up salesforce Online Training Bangalore

    ReplyDelete

Post a Comment

Popular posts from this blog

Avoid Duplicate Records Using Flow

In this blog post lets see how to avoid duplicate records in Salesforce using the powerful feature – Flow , As the word says, flow easily flows to fulfill the requirements with ease. ☺  Many think of appexchange solutions and source code to avoid the duplicate record in salesforce, But the method I'm going to explain here is completely different and very simple. It helps you to reduce your code and can easily rebuild for other objects with different field logic with simple clicks. Lets jump into the solution, we will use flow to check duplicate record logic and use apex trigger to initiate the Flow whenever a record is created or updated. Visual Work Flow : [Click] First we will create the Flow to check the duplicate records based on the name and store the result in the variable. In this example, we will use the Account object for the dupe check. Step 1  : Create a new visual flow with the Name ‘ DuplicateAccountCheck ' Step 2  : Click and drag the RecordLookup into t

Export records from List view – ListView API

As part of the Winter’15 release salesforce introduced the List View API features which helps us to get details and records of list views for an object. I was started exploring more about the List view API and trying to build an use case using that. So I searched about List View in the IdeaExchange site then found that many users are looking for a solution to export records to excel directly from the list view. I built a solution for that Idea, which helps user to download all the records directly from the List view for both standard and custom object. You don’t have to make any change in the code to use this functionality for different objects. All you need is to create a custom button for that object as mentioned below. Lets take an example for Account object 1. Go to Setup –> Accounts –> Buttons, Links and Actions 2. Click ‘New Button or Link' 3. Enter  Label, Name and select display type as ‘List Button’ 4. Content source as “Onclick Javascript” and paste the

Lightning Picklist Path Component

Create your custom path for picklist field in any standard and custom objects. The new lightning picklistpath component in Winter18 helps us to display the picklist field progress similar to the lightning path. The path is rendered as a horizontal bar with one chevron for each picklist item, this component doesn't have key fields or guidance information and doesn't display the mark complete button similar to the lightning path.  <lightning:picklistPath aura:id="picklistPath" recordId="{!v.recordId}" picklistFieldApiName="status" / > The picklist path will display the progress based on the recordId and picklistApiName attribute value. Specify the API name of the picklist field in the picklistAPIName attribute which you want to display in the page layout and specify the Salesforce record ID in the recordID attribute so it renders the current value for the field in the page.   In this example, the status field in the case object disp