react-esnext

Official React tutorial rewritten in ES.next

3 years after

React + ES.next = ♥

A step-by-step example of how to leverage ES6+/ES2015+ in React by rewriting (an adapted version of) the official React tutorial.

To run completed app

Assuming you have a version of node installed, install nvm and then close & reopen your terminal.

Install the latest stable version of node:

nvm install node

Fork this react-esnext repo and create a local clone (be sure to replace YOUR-USERNAME with your own):

git clone https://github.com/YOUR-USERNAME/react-esnext.git

Change to final directory:

cd react-esnext/final

Install all of the dependencies:

npm install

Start API server (running at http://localhost:3000/):

npm run start:api

In a separate console window/tab, start the web server (in the same directory):

cd react-esnext/final
npm run start

Once the initial bundle is built, visit http://localhost:8080/.

Exercises

Each step in the workshop builds on top of the previous one. You can begin at the Start. Afterwards follow these steps:

  1. Modules
  2. Classes
  3. Block scoping
  4. Destructuring
  5. Arrow functions
  6. Enhanced object literals
  7. Spread operator
  8. Promises

Related Repositories

react-boilerplate

react-boilerplate

:fire: A highly scalable, offline-first foundation with the best developer exper ...

express-react-views

express-react-views

This is an Express view engine which renders React components on server. It rend ...

mobx-react

mobx-react

React bindings for MobX ...

react-rails-starterkit

react-rails-starterkit

Starter repository for React on Rails. Fork it! ...

eslint-config-xo-react

eslint-config-xo-react

ESLint shareable config for React to be used with eslint-config-xo ...


Top Contributors

benmvp