Welcome to Reactforce!

Learn how to quickly integrate the two cool kids on the block

What is Reactforce?

Reactforce (tm) is my current working title (trademark pending... please don't sue me Meta or Salesforce!) that provides architecture, education, tooling, boilerplate, and even support for using ReactJS as the front end technology layer on Salesforce.com applications.

As a Certified Technical Architect I have built front-ends on Salesforce for ten plus years using many different technologies. I started with Visualforce, Aura, LWC, Angular, JQuery, third party tools, and finally and especially ReactJS. I have found the rendering speed, UI responsiveness, developer community, rapid development process, and open-source solutions in ReactJS to be highly effective in building world-class user front-end experiences while leveraging the power of the most powerful SaaS/PaaS which is Salesforce.com.

This project had inception more than 6 years ago when I was presented with the challenge of building a "Customer Portal" on Salesforce using Community licenses and a team of React developers. The results were astounding. We designed, built, and implemented a customer portal that had all the benefits of a 100% custom build, a 99.999% SLA backend, with easy access to business critical data. This was all done with an aggressive timeline and a small budget.

Since then (2017) I have been implementing different forms of this architecture for a number of clients, be it financial services, healthcare, or consumer products. Each project has had its own challenges, but ultimately each project has individual success along a number of common factors:

1. Significantly reduced technical complexity of the landscape architecture

2. Effective and imperative Separation of Concerns between Front-End and Back-End teams and components

3. Loosely coupled but highly coordinated technical building block architecture utilizing common environments, data, and processes across a project

4. Simple and predictable website upgrades via deployment of a Single Page Application (SPA) ReactJS script via a Salesforce.com static resources

5. Relatively expedited time to market for a custom portal without the need to replicate data to another data store

6. Relatively lower total cost-of-ownership (which is of course use case specific depending on the usage)

7. Relatively lower operational and support cost by leveraging existing Salesforce.com support infrastructure

8. Wider access to developer resources who can deliver market-leading solutions without having to learn every component of the Salesforce.com product architecture

The Reactforce solution attempts to provide a solution for all of the above use cases. This documentation website is one of the key artifacts to ensure I never have to look a client in the eye that previously spent $100M dollars to do what I can recreate using this framework within a few hours.

The entire scope of the Reactforce solution includes the following components:

1. The Reactforce Command Line Interface - a SFDX Plugin designed to easily deliver the ReactJS and Salesforce boilerplate code necessary to quickly launch a new React application

2. The Reactforce Developer Experience - tooling and processes to ensure React developers feel right at home with local development servers, fully functional Salesforce development environments, rapid development cycles supported by Hot Reloading, and simple packaging and deployment of build artifacts

3. The Reactforce contributor experience - the tool and basic templates will be (eventually) open sourced and I would love some help if you would like to contribute.

4. The Reactforce Help Website - congrats you found it!

5. The Reactforce Examples - fully functional Reactforce solutions that you can use to learn, clone, and modify for your own purposes!

6. The Reactforce Premium Solutions - coming soon - premium templates, support and consulting services to help jump start your next Reactforce app.

Want to jump right in?

Follow the quickstart in order to build your first Reactforce app in less than 5 minutes:

Quick Start

Want to deep dive?

Here is the official Reactforce Reference documentation:

(WIP) Reactforce Reference