search

arqex / react-router-boilerplate

A react boilerplate with, react-router, babel, hot-loader, freezer-js
MIT License
0 stars 0 forks source link

Doesn't actually use freezer.js #1

Open delaneyj opened 9 years ago

delaneyj commented 9 years ago

Was curious in this version to see how freezer.js interacted with react-router's state but while freezer.js is included in dependencies but not actually used at all.

arqex commented 9 years ago

Hi @delaneyj

I use this repo as a personal boilerplate. In my projects I always use freezer so that's why it's there, but you can fork the repo and take freezer out if you like it.

Cheers

delaneyj commented 9 years ago

Heh, no I actually was only interested in the boilerplate BECAUSE of freezer.js. There are plenty of examples of react/react-router together. I was curious about how you use freezer.js with react-router. Like do you control the router state with freezer?

arqex commented 9 years ago

Nice question!

I make work freezer-js and react router separately. Whenever the url changes, and a new react page component will be loaded, I start fetching the needed data from the server. The magic happens in the main app component. It detects url changes in the componentWillReceiveProps method, then it sets a loading flag in the freezer state and trigger all the freezer events needed to fetch the data.

If the loading flag is true, instead of rendering the Router component you can render that loading message.

Lately I've been playing also with components that fetch their own data declaratively, so I use a similar strategy on component level:

http://arqex.com/1058/define-the-data-to-fetch-declaratively-with-react

As you can see, in the way I use them together, they don't interact directly.

Have you thought a better way of using them together?