Best choice for React Webpack Starter

react
1

I’m maybe two notches above being a newbie–>borderline junior dev. I’m thinking of using a boilerplate to get up and running with Webpack and React before investing in a project that will take a moderate amount of time for me to build. I’ve been playing around with:

* jedwards1211/meteor-webpack-react

*thereactivestack/kickstart-flowrouter

*taskandtool/saas-starter

What do you feel about junior devs using boilerplates? Have you looked at these boilerplates or others in this genre? Which if any do you prefer? Why?

Do you feel that having Redux or some Flux package in a boilerplate is important.

1 Like
2

I think that https://github.com/thereactivestack boilerplates and packages are most promising. I personally like it most. I see that now it will be even more modular. Cool stuff!

3

I was asking myself the same questions. I agree, I think kickstart-* seems pretty good. Of course with Meteor 1.3 you can use ES6 modules, so I’m not sure there’s a huge win with using webpack (you want code splitting?)

I’m also not convinced if I want to use Flow router instead of React router. If you are using blaze of course you can’t use React router for that… but react router seems better supported in the react world.

As far as Redux or Flux, I still haven’t found a reason to use it, since I’m using livequery/livedata (getMeteorData in React), so far does everything I need, and it seems simpler than Flux!

4

And one more if you also want Meteor-React-Redux-Webpack. It’s nascent with zero stars but if jedwards1211/meteor-webpack-react and davezuko/react-redux-starter-kit had a child, this would be it.

Also, I started this Google Sheet for comparison. Feel free to edit and make comments.

5

Nice @dbhandel . I added kickstart-hugeapp and a column for code splitting (not sure which of the other ones have this).

Maybe you could help me understand the advantage of using Flux/Redux along with Meteor? I guess I should take a look and study these two redux starter kits you mention… all the examples I’ve seen about Flux seems to be kind of pointless.

Ok, the meteor-react-redux-starter-kit… first I can’t get it to run (I get different errors, ultimately I think it didn’t run because: Cannot find module ‘cssnano’, because npm install probably crapped out). And it’s not even a meteor project, but if npm install/npm start actually worked, I wouldn’t mind.

But looking at the project, I see it initializes two meteor collections, Users and Posts… which never get used anywhere. How am I supposed to actually use data in this React-Redux paradigm? Am I supposed to use getMeteorData(), or not?

The reducers and the store… I can’t figure out what any of that actually is for. Just tell me what is the point? I’m getting kind of tired of hearing about Flux because I don’t see it actually solves any real-world problem!

6

Sorry @vonwao but I’m not knowledgeable enough to explain why meteor-react-redux-starter-kit won’t run for you. It does for me. I’m sure that you followed the instructions:

The users and posts collections appear to be orphans/artifacts from jedwards1211/meteor-webpack-react which was merged into this repo. IT has no meaning otherwise that I can see.

I’m the wrong guy to defend the use of Flux/Redux in Meteor projects. That’s just way over my head. Here’s the best article that I’ve read that advocates for using Redux in Meteor apps.

Cheers

7

Thanks @dbhandel. That article is good… Arunoda has a knack for cutting through the BS and getting to the real issues.

I also found the other thread A neat diagram comparing Meteor, Flux, and Relay very interesting about the meteor and tracker vs redux issue.

Although I still haven’t seen a good demo that combines Meteor+React+Redux, maybe soon.

8

There is a demo with meteor + redux here: https://github.com/AdamBrodzinski/meteor-redux-example

I haven’t used it for anything, though; I’ve just taken a look at the source code to get my feet wet with Redux. It uses Blaze instead of React, but it might still be valuable for you to see how Redux was setup.

There is another one here (https://github.com/AdamBrodzinski/meteor-flux-leaderboard) that uses Meteor, React, and Alt. Might be another one to look at if you are curious.

9

I was using thereactivestack/kickstart-flowrouter with success until I tried to start my app today - I am getting a strange error:

While processing files with webpack:webpack (for target os.osx.x86_64): entry/server/webpack.conf.js: Cannot find module 'babel-runtime/helpers/interop-require'

This error is thrown when installing NPM dependencies for the web bundle. Unfortunately I dont really understand enough about webpack in general to try to debug this, so for the time being I’ll try a different repo.

EDIT: I cloned the repo from scratch and now it builds properly… must have been something I did wrong when adding my own npm modules. Webpack can be tricky…

10

A very very lightweight alternative to get you started with Meteor, React, Webpack and react-router: https://github.com/pors/kickstart-mini

1 Like