Migrate to create-react-app

[just-boris]

• [x] replace configuration with react-scripts
• [x] find a workaround to load text files
• [x] test deployment process
• [ ] update documentation nothing to update, everything works as before 🐱

---

create-react-app is a standard project template for React. It provides you module bundling, developer server with hot-loading and other modern features with zero configuration.

Getting rid of all config files for this repo will probably help to focus on the main purpose of this project.

See issue https://github.com/facebookincubator/create-react-app/issues/737 for more details

[ryan-roemer]

Hi @just-boris,

Thanks for your interest in spectacle-boilerplate and your willingness to do some leg work to help move things along.

To help you avoid doing a lot of work that might get thrown out later, could you do us a favor and post a list of changes you'd like to make to this repo first so that we can review and help guide your efforts as appropriate?

The reason I ask is for very basic things like style for instance. All our projects use / are being upgraded to https://github.com/FormidableLabs/eslint-config-formidable which includes thing like requiring dash-casing for filenames (we've had extensive and numerous negative experiences with JS file casing on case-insensitive file systems). So right out of the gate, we're going to need our code styles and conventions to govern things here.

Additionally, we're looking at potentially different / multiple generator / boilerplate options, which may or may not include CRA. So it would be great and likely much more efficient for you to just have a bullet point proposal / discussion first.

Thanks!

[just-boris]

Updated the top comment to show the list what's left to do.

The question about lint config is a bit tricky. First of all, create-react-app includes CaseSensitivePathsPlugin for webpack, which makes case-check for files. Basically, CRA checks for common issues, like unused variable or reference to unknown variable.

So, if you still want to use eslint-config-formidable here, create-react-app is not for you. But if this boilerplate intended to create a presentation as much easy as possible, then zero-config build tool, such as create-react-app will be the best choice, even if it doesn't check best practices as well as you are doing for other projects.

[ryan-roemer]

@just-boris -- Fortunately, CRA is just one of many zero-config generators and while a wonderful one, looks like it has some unfortunate limitations both hard (loading text files which spectacle absolutely needs to do) and soft (allowing us to maintain our code style standards across all our projects and not force us to arbitrarily switch).

Thanks for your investigation and efforts!

[gaearon]

allowing us to maintain our code style standards across all our projects and not force us to arbitrarily switch

To be clear, lint rules in CRA should have no style rules (if you find one, file an issue). They only show warnings for actual mistakes (like invalid typeof comparison or an undefined variable). This is because we show lint warnings interactively in a very prominent way, so style rules would be annoying. You can still add a lint step with your own config if you want to.

[just-boris]

By this time I have finished code changes, so the built version of boilerplate with create-react-app is now available on http://brainy-stone.surge.sh/

[just-boris]

So, now there is only one question left: is it okay to left code style out of control?

And I think this is okay, because this is not a library, this is boilerplate, a sample project that helps users to start making presentations. The project setup should be fast, reliable and simple.

This is why I intially opened this PR, because I beleive that create-react-app perfectly fits here. You have to create many presentations from time to time and it would be a real pain resolve tools setup every time when you are working on presentation, not at actual web-app. You just have wonderful react-scripts package as dev-dependency that does all job for you and doesn't matter how.

Also I'd like to learn about possible alternatives here, but anyway, the build-process it point that should be improved there.

[just-boris]

I have compared install time with create-react-app and current master branch

• create-react-app: 1m 22s
• current master: 2m 5s

Faster install time is also can be a concern.

[just-boris]

Hello! Have you come up with any conclusion?

So far I have created an actual presentation using react-scripts boilerplate: http://catatron.com/test-workshop/

And I think that I had much more time to work on actual content rather than care about webpack on other parts of infrastructure setup.

[ryan-roemer]

@just-boris -- We're doing a big overhaul of Spectacle and this is on the list, but will be informed by the needs / decisions of the main Spectacle project, so no definite timeline. Probably sometime this month.

That said, my hunch is that we will likely go with a bespoke templating / boilerplating solution that gives us a little more flexibility on our end and abides by our conventions a bit more. But, in any case we now have a baseline of "least configuration" and "execution speed" by which to benchmark any solution we do choose!