Developing React Redux Apps In Salesforce’s Visualforce

rajaraodv
rajaraodv
Mar 30, 2016 · 5 min read

React App Development — Difference

The Development Setup

Configuration

How It Works

In Production

<! — Uncomment and use the below for production to point to final static resource “reactreduxblog”(bundle.js) →
<! — <script src=”{!URLFOR($Resource.reactreduxblog)}”/> →

AJAX Calls — Visualforce Remote Objects

<apex:remoteObjects>
<apex:remoteObjectModel name=”Post__c” jsShorthand=”Post”
fields=”Id, Name, Categories__c, Content__c” />
</apex:remoteObjects>

Promise-ify Remote Objects

export function getPosts() {
return new Promise((resolve, reject) => {
var post = new SObjectModel.Post();
// Use the Remote Object to query
post.retrieve({limit: 10 }, function(err, records, event) {
if (err) {//Promise Reject
return reject({data: {message: err.message}, status:400});
}
...
...
return resolve({data: {records: posts}}); //Promise Resolve
});
});
}

Get Started — Sample App:

Live App (Same App on Heroku w/ more features):

Get Started — Development Setup

My Other Blogs

ES6

WebPack

Draft.js

React And Redux :

Salesforce

rajaraodv

Written by

rajaraodv

Trying to make Web development simple. Former Developer Advocate @Salesforce, VMware (node.js); Engineer @ Yahoo, Zimbra. Twitter: @rajaraodv

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade