React University: Sample Application with React, Node.js 4, and the Lightning Design System

React University is a sample project demonstrating how to build real-life applications with React, Node.js, and the Lightning Design System. React University is written using ECMAScript 6 at the client-side (leveraging Babel) and at the server-side (leveraging the new ES6 support in Node.js 4).

Watch the video for a quick walkthrough of the application:

Highlights

React

React University demonstrates how to build a React app using ES6 modules

It also demonstrates how to use React Router 1.0 (RC3 at the time of this writing)

Lightning Design System

The Lightning Design System is a new UI toolkit focused on business apps available from Salesforce as an open source project on GitHub. In addition to traditional components, it provides specialized components that are useful when manipulating data: activity timeline, data tables, record headers, etc. And in addition to UI components, it provides UI patterns to solve the common problems you face when building data-driven apps. The list of components used in this specific application includes:

DataGrid

Record Header

Record Home

Spinner

Toast

Node.js 4

The Node.js back-end exposes a set of REST services

It uses the new ES6 support available in Node 4.x

In particular it uses the built-in ES6 promises instead of the q module

Follow Me

is the meta tag in your index.html file necessary for to render aura components?

Jayme

Very nice & clean readable code!
Do you have any tips for when you’re developing, to reload the app whenever you change something in the code or do you run $ npm start && npm run build-client; each time again?

Right now there isn’t any validation present. What do you suggest as best practice?I guess for a real live app you need serverside validation anyhow. Would be nice to see how the flow would be and how you handle this in a clean way in react without having too much validation duplication.