Skip to content

Latest commit

 

History

History
73 lines (43 loc) · 4.86 KB

Examples.md

File metadata and controls

73 lines (43 loc) · 4.86 KB

Examples

Example Projects

Thinking in React

nwb-thinking-in-react implements the example from the Thinking in React tutorial using nwb for development and testing.

React Tutorial

nwb-react-tutorial implements the chat app from the React Tutorial using nwb's Express middleware to develop using nwb 0.12's default configuration on the tutorial's own server.

The same server is used to serve up a Webpack development build or a production build if one exists.

Bootstrap 4 with Sass

Yelp Clone

react-yelp-clone takes the app created in the Build a Yelp Clone React tutorial and uses nwb for its development tooling, with a custom nwb.config.js to support the same setup.

Check out the diff to see the effect using nwb has on the amount of devDependencies and configuration which needs to be managed.

Github Issues

react-nwb-github-issues is a clone of the ember-cli github-issues-demo demo app, showing development of a React app from scratch using nwb.

Selected commits of interest:

Note: this example app initially tries to stick close to the original version commit-by-commit for the sake of comparison, by using async-props, which is currently in pre-release.

Other Examples

Kendo UI For React with nwb

Tutorial video by Cody Lindley of creating a new React app with nwb and getting started with Kendo UI components, auto-installing new dependencies from the development server and doing some Babel stage config via nwb.config.js:

Kendo UI For React with nwb on YouTube

Good tip from this video: use -- to pass additional flags to npm run commands: npm start -- --auto-install.

Automatically installing dependencies from npm

nwb v0.7 added an --auto-install flag to nwb serve which automatically installs and saves missing dependencies from npm using NpmInstallPlugin.

nwb serve --auto-install example

Creating and customising a new React app

Just after nwb v0.6 was released, someone on Reactiflux asked this question:

hey guys, i need to prove a concept quickly, i need a boilerplate with react and some kind of mobile ui framework like ratchet, does anyone know of a good boilerplate like that?

This video shows the resulting example of using nwb to create a new React app project, installing Ratchet from npm and using its CSS, and using the nwb config file to configure Babel with a plugin to make it more convenient to copy and paste HTML samples from Ratchet's docs:

nwb v0.6.0 example on YouTube