React for WordPress developers

REACTWordCamp Prague 2016

Borek Bernard

Typical WordPress developer,2016

JS?

THE GOOD OLD DAYS

PHP MySQL

THE GOOD OLD DAYS

PHP MySQL

jQuery

THE GOOD OLD DAYS

PHP MySQL

jQueryBackbone

Underscore.js

PHP MySQLReact API

WHAT IS REACT

• View library from Facebook• Short word for many things (remember “HTML5”?)

webpackBabel

Fluxredux

Relay

flow

GraphQL

npm

POWERED BY REACT

• Parts of Facebook (Messenger, Groups App, …)• Instagram• Netflix• Airbnb• Uber.com• Twitter mobile• Calypso• …

WHY REACT?I S I T J U S T FA S H I O N ?

• Simple, focused•Universal• Backed by big players

REACT NATIVE

REACT FOR WORDPRESS DEVELOPERS

TWO USE CASES

1. More pleasant admin experiences

2. Rich frontend UIs / apps

ADMIN UI’S

• Calypso• VersionPress•MainWP / ManageWP / …

RICH FRONTEND’S

•WordPress as an application platform

“Headless WordPress”• Examples:

–Nomadbase–Mobile apps

DEMO

DEMO RECAP

Source: https://facebook.github.io/react/docs/thinking-in-react.html

OTHER NOTES

CHALLENGES (WP)

1. Themes?1. SEO?2. First-time load?

2. Server-side rendering?“isomorphic apps”

CHALLENGES (REACT)• Things are changing•Data flows not entirely solved yet (Flux, redux, relay, …)

but still:It’s a safe bet

OPPORTUNITY FOR YOU• 2016:

–React getting stable–WP REST API getting stable and into

core (hopefully)•Opportunity:

–Not many WP devs know JS yet–Kick-ass UIs– Innovative ways to interact with WP

LEARN JAVASCRIPT, DEEPLY

Matt Mullenweg, State of the Word 2015

Thank you!@borekb + awesome guys @versionpress