Using facebookincubator/create-react-app instead of boilerplate

[lopezjurip]

Even when https://github.com/FormidableLabs/spectacle-boilerplate seems to be a good starting point, it has a lot of code for a simple presentation.

I was able to make presentation/index.js from spectacle-boilerplate work with https://github.com/facebookincubator/create-react-app and now the presentation source code is much more compact and easy to follow.

Currently there is problem when loading external css code, but it has been patched and maybe it will come with the next release.

Steps (when create-react-app gets updated):

npm install -g create-react-app

create-react-app my-app
cd my-app

npm install --save normalize.css spectacle

• Copy spectacle-boilerplate/presentation/index.js to my-app/src/App.js
• Copy spectacle-boilerplate/assets/interactive.js to my-app/src/interactive.js
  • Change import Interactive from "../assets/interactive"; to import Interactive from "./interactive"; in my-app/src/App.js.
• Copy the rest of spectacle-boilerplate/assets to my-app/assets.

I had to remove raw-loader because it's not bundled by default

{/*
          <CodePane
              lang="jsx"
              source={require("raw!../assets/deck.example")} // :(
              margin="20px auto"
            />
*/}

Run my-app with npm start.

[kenwheeler]

We are working on a CLI tool much like CRA, but that also includes presentation specific features like remote sync.

[jonasws]

Any update on the progress of said CLI tool, @kenwheeler?

[kenwheeler]

@jonasws expect it pretty soon. It will likely be based off of https://github.com/FormidableLabs/builder-init/

[karlhorky]

Now that create-react-app is going away (it's turning into a launcher), I opened an issue to remove the create-react-app option from the tutorial in the docs and consider moving to Next.js:

• Remove create-react-app option, Add new option 1 using Next.js? #1260