Using ES6 with React
Summary
The point of this presentation is to:
- Teach you React. It assumes no prior knowledge.
- Teach you JSX. It makes writing React so much more pleasant.
- Teach you (some) ES6. This presentation only assumes ES5 familiarity.
- Teach you React with ES6. It shows you the newer paradigm of coding React using ES6 classes.
- Teach you server-side rendering on React using Koa.
- Not teach you Flux. We won't be going over it during this workshop.
Presented at:
"Conference WiFi Mode"
WiFi at conferences is notoriously 💩ty. This presentation is made with that in mind. In order to switch to offline mode (which doesn't rely on the omdb API but instead serves dummy data) change all references of var omdb = require('omdb-client');
to var omdb = require('./fake-omdb-client');
. You may also have to mess with the paths to images a bit. I intend to fix that.
OMDb
The example app makes use of the OMDb API. I'd encourage you to donate to this cool project. I did to hopefully offset some of the costs that this will cost him. 😄
How it works
The completed project lives in the completed/ directory. I've left for you a skeleton of the project to code up in the empty/ directory. You can recreate the presentation without me there using speakersNotes.md.
Also, something tricky is that for the first bit, you'll need to symlink in font-awesome. ln -s node_modules/font-awesome/ empty/fa
should work (after you've ran npm install
.)
How to Run
- cd into completed or empty directory
iojs app.js
- Navigate to
localhost:3000
in web browser
Contributing
Please feel free to correct spelling errors, leave issues of how certain things are unclear (whether that's listening to me actually present this or just from reading,) or make PRs if you find a better way to teach or say something.
License
The project includes some images and info from Netflix shows and others that I pulled from the web that retain their original licenses. It also depends on varying projects that also retain their own licenses. For whatever code I have written, or whatever code that others commit and are merged into the project, are released under the MIT license.
Project Author
❤️ Brian Holt