/ltng-support-visualforce-to-lightning-canvas

Heroku component for demoing communicating between VIsualforce / Lightning / Heroku / etc.

Primary LanguageJavaScript

Overview

This is an example Node.JS canvas endpoint to demonstrate how to leverage Canvas Apps within Lightning Experience.

This allows for listening and dispatching canvas messages with Lightning Experience, so the end user experience is seamless.

Screenshot

For more information, please see the accompanying Salesforce project

Setting up

1. - Download the Salesforce Repository for the demo:

https://github.com/SalesforceCloudServices/ltng-support-visualforce-to-lightning/

2. - cd into the dx directory of that project and run sfdx force:source:push

3. - assign the demo permissionSet (to run the demo) - sfdx force:user:permset:assign -n ltng_LightningToVisualforceDemoParticipant

4. - create a heroku app for this project at https://heroku.com

ex: heroku create

5. - create the following heroku config settings for the heroku app:

ConfigDescriptionExample
CONSUMER_KEY The Consumer Key for the Connected App: ltng_DemoHerokuNodeJS_CanvasApp 3MVG9U_dUptXGpYI4288SBcTP2X...
CONSUMER_SECRET The Consumer Secret for the Connected App: ltng_DemoHerokuNodeJS_CanvasApp 12345678....
EXAMPLE_SIGNED_REQUEST Leave blank in production or replace with the post Signed Request 9Rpl6rE7R2bSNjoSfYdERk8nffmgtKQNhr5U/5eSJPI=.eyJjb250ZXh0Ijp7InVzZXIiOnsibGFuZ3V....

node-js-getting-started

note: cloned from - https://github.com/heroku/node-js-getting-started.git

A barebones Node.js app using Express 4.

This application supports the Getting Started with Node on Heroku article - check it out.

Lightning Design System

See the Heroku Platform section of the Lightning Design System

(tldr; download the Lightning Design System, place the assets folder in your public/web directory, and reference it in your page)

<link rel="stylesheet" type="text/css"
	href="/assets/lightningDesignSystem/styles/salesforce-lightning-design-system.css"
/>

Running Locally

Make sure you have Node.js and the Heroku CLI installed.

$ git clone git@github.com:heroku/node-js-getting-started.git # or clone your own fork
$ cd node-js-getting-started
$ npm install
$ npm start

Your app should now be running on localhost:5000.

Deploying to Heroku

$ heroku create
$ git push heroku master
$ heroku open

or

Deploy to Heroku

Documentation

For more information about using Node.js on Heroku, see these Dev Center articles: