React
An Overview
What is React?
A Javascript Library created by Facebook (and the
community) to build user interfaces
Ideas behind React
• Declarative nature
• Reduced scope
• Portability
• Expressivity
• Performance
• Unidirectional data flow
• Flux
Support and use
• Facebook, Instagram, Whatsapp
• Nextflix
• New York Times
• Yahoo
• Dropbox
• Wordpress (*)
• 5th most stared project in Github
• 8th most forked project of 2017
What does it look like?
https://reactjs.org/
DEMO TIME
How to install/use React?
No Babel, No NPM, No Problem:
https://codepen.io/gaearon/pen/
ZpvBNJ?editors=0010
With node installed and want to build
an application with it?
npm install -g create-react-app
create-react-app my-app
cd my-app/
npm start
Quick test-drive:
Copy-Paste this HTML
Strengths Weaknesses Opportunities Threats
Flux as an emergent
frontend architecture
Component base as a way
of encapsulation and code
redistribution
Library approach enables a
better distributed
collaboration
JSX as a means to reduce
context-switching
Usage of the latest ES
specification
Company’s track record of
dubious licensing ( BSD +
Patents )
With a big company backing
the project, there’s a
tendency for less agility and
over-specification
Diversity of the NPM
ecosystem
JavaScript as a cross-
environment language that
enables entering the mobile
market
Help the language standards
to evolve faster by pushing
the community to adopt
them earlier
W3C Web Components Spec
being drafted could direct
some users away to
competitors with a more
similar approach
Too much noise going
around in the community
might turn off those used to
a more stable environment
JSX and build process might
be overwhelming for some
new starters
Thanks!

React - An Overview

  • 1.
  • 2.
    What is React? AJavascript Library created by Facebook (and the community) to build user interfaces
  • 3.
    Ideas behind React •Declarative nature • Reduced scope • Portability • Expressivity • Performance • Unidirectional data flow • Flux
  • 4.
    Support and use •Facebook, Instagram, Whatsapp • Nextflix • New York Times • Yahoo • Dropbox • Wordpress (*) • 5th most stared project in Github • 8th most forked project of 2017
  • 5.
    What does itlook like? https://reactjs.org/
  • 6.
  • 7.
    How to install/useReact? No Babel, No NPM, No Problem: https://codepen.io/gaearon/pen/ ZpvBNJ?editors=0010 With node installed and want to build an application with it? npm install -g create-react-app create-react-app my-app cd my-app/ npm start Quick test-drive: Copy-Paste this HTML
  • 8.
    Strengths Weaknesses OpportunitiesThreats Flux as an emergent frontend architecture Component base as a way of encapsulation and code redistribution Library approach enables a better distributed collaboration JSX as a means to reduce context-switching Usage of the latest ES specification Company’s track record of dubious licensing ( BSD + Patents ) With a big company backing the project, there’s a tendency for less agility and over-specification Diversity of the NPM ecosystem JavaScript as a cross- environment language that enables entering the mobile market Help the language standards to evolve faster by pushing the community to adopt them earlier W3C Web Components Spec being drafted could direct some users away to competitors with a more similar approach Too much noise going around in the community might turn off those used to a more stable environment JSX and build process might be overwhelming for some new starters
  • 9.

Editor's Notes

  • #5 Wordpress is pending review due to licensing drama - https://ma.tt/2017/09/on-react-and-wordpress/ Cool data - https://octoverse.github.com/ https://github.com/search?q=stars:%3E1&s=stars&type=Repositories
  • #7 https://codepen.io/gaearon/pen/ZpvBNJ?editors=0010
  • #9 Licensing - https://medium.com/@raulk/if-youre-a-startup-you-should-not-use-react-reflecting-on-the-bsd-patents-license-b049d4a67dd2 Flux - https://facebook.github.io/flux/