Use Poi to Build an Index.js with Modern JavaScript Features

Customize Poi's Default index.html Template

Configure Poi for Advanced Template Control

Build a Vue App with Poi

Customize Babel to Build a React App with Poi

Compile CSS or Sass with Poi

Use Markdown as React Components by Adding a Webpack Loader to Poi

Build and Analyze Your JavaScript Bundles with Poi

Use Poi Presets from npm to Skip Configuration

Setup PostCSS and Tailwind with Poi

Make Webpack Easy with Poi

Developing React with Poi is as easy as adding the `babel-preset-react-app` to a .babelrc and installing React. This lesson will walk you through that quick process and get your React app up-and-running.

https://app.egghead.io/api/v1/lessons/react-customize-babel-to-build-a-react-app-with-poi/subtitles

Instructor: [00:00] Switching over to React is as easy as installing React and ReactDOM, then, install babel-preset-react app. I like the babel plug-in react require, and save these as devDependencies. I'll delete this, add a babelrc, which poi will automatically pick up.

[00:24] Say my presets are React app, and my plug-ins are React require. Then, go into my index, I'll select all, import from ReactDOM. We'll need to grab the render method. I can skip importing React because of the React require plug-in.

[00:45] Then, say render. We'll pass in a div, say React, and then, we'll get the element by ID of app. Hit save there, run poi, and we have a React app, which will auto-reload anytime I make a change.

Customize Babel to Build a React App with Poi

Share this video with your friends

Course

Make Webpack Easy with Poi