Hi does anyone have any examples of using Meteor and React JS together. All the examples I’ve seen so far have been quite basic. What I’m really after is something that uses React + Iron Router + Templates.
many thanks
Dave
Meteor has blaze and over react(ivity) features build in
so why do you want to use reactjs?
I like the way React works and I know you can use it with Meteor so was just curious about what the experience was like. The problem is that I’ve only found some basic tutorials rather than anything than shows how you can integrate the two.
cheers
Dave
Hi, I’m interested in understanding how to use React & Meteor together as well. The closes thing I’ve seen is probably this: https://github.com/mystor/todomvc/tree/routecore/labs/architecture-examples/meteor-routecore
However, it doesn’t use Iron Router, it uses RouteCore. A neat caveat is that it does server side rendering as well…
Demo is here: http://todomvc-routecore.meteor.com/
It has three routes, /, /active, /completed. Unfortunately the code isn’t organized very well and it just in a single file.
I’ve just stumbled on that so I’m still researching and learning about it. I had been looking into https://github.com/hipertracker/meteor-reactjs which I think will play nicer with Iron Router if you’ve got a dependency on that. I assume you’d just hook into a template onCreated or onRendered events, though I haven’t had a chance to play with it too much yet.
Be sure and report back, I know the potential performance improvements for certain use cases could be useful to the Meteor community if a clean integration is discovered. Would also help to attract a lot of Front-End Engineers that are already familiar with React but not aware of Meteor if client & server side rendering is figured out.
</exhale> That turned into a longer post than I had anticipated - GL! 
1 Like
Thanks Matthew - I’ll look into it.
Now that would be great but I wonder what the chances of it actually happening are 
Sorry, replied to you over on the old Google Group, before I saw your post here… But I will restate:
Another vote for taking a look at https://github.com/mystor/meteor-routecore.
It’s got its own router, instead of iron-router. Templating is as usual the trickiest part. It’s got a somewhat hacky hook into Blaze templates, but I think you’d be better off sticking to the “React” way.
Only caveat I had was that the last commit was last November. But I did open an issue, and he replied to it.
@micmac, thanks for posting that issue link. I posted this list on that thread–all the meteor / react integration packages that I’m aware of:
- https://github.com/reactjs/react-meteor
- https://github.com/hipertracker/meteor-reactjs/
- https://github.com/avital/react-in-blaze
- https://github.com/ccorcos/meteor-reactor
- https://github.com/mystor/meteor-routecore
1 and 2 above apparently share a lot of code.
2 Likes
@shortlyportly - I threw together this quick proof of concept while playing around with @avital’s react in blaze - GitHub - matthewsimo/meteor-react-with-iron-router: Proof of concept. Use React & Iron Router
It basically just sprinkles in iron router and shows how you could load react components on a by-route basis. While quite contrived, it should get you started on one way of using both. 
Thanks everyone for all the pointers. I really like react-in-blaze (and the demo from matthew).
For those of you that have used React with Meteor - are there any gotchas or traps that I need to look out for?
cheers
Dave
I just discovered a great article by Tom Coleman,
Reactive User Interfaces
Creating maintainable interfaces with React & Meteor
2 Likes
I’m currently writing a Meteor + React + Iron Router app here: github.com/asm-products/coinvest-io
If you’d like to take a look, ask questions, etc. feel free. There’s also a #meteor channel on the Reactiflux Slack chat: http://reactiflux.com
I have wanted to try out react too. There are parts of my UI that would be easier as components. However React sucks for integrating with stuff like jquery that wants to touch the dom. I am going to see if I can use riot.js since their components seem to allow other stuff to touch the dom.
@curioussavage I would first try to embrace React and avoid jQuery. It’s amazing how quickly you’ll realize you don’t need jQuery any more, and your code will end up a lot cleaner and more maintainable.
Dave,
I just gave a short talk to the Meteor Cincinnati Meetup on Meteor & React.
Slides: http://slides.com/hellogerard/meteor-meet-react#/
Repo: https://github.com/Differential/todos-playground
Video: https://www.youtube.com/watch?v=cYrTLZ4kcsU&feature=youtu.be&t=9m32s
It was our first time recording the meetup. General video/audio isn’t bad, but it’s hard to read the code on the video. Sorry.
Gerard
3 Likes
Gerard
many thanks for the links. I’ll definitely be having a play tonight!
cheers
Dave
Thanks Idris. I’ll give it a look (and thanks for offering to answer my questions, etc).
cheers
Dave
Hi Idris - Are there any resources that can help a new comer learn about how to construct a simple app using React and Meteor. If there is can you kindly please let me know or do you have any suggestions how I can go about this - thanking in advance, Naseer.