You may have noticed that meteor.com now has an Angular beginner tutorial to go alongside the Blaze one. The next natural step is to have one for React!
I have just finished writing a first version, and I would love some feedback on the content. Please post a comment here or a pull request to the repo!
One thing that I would like though is if it included layouts and url routing as well. I don’t know how to handle urls when using React in a Meteor app. How do I have multiple layouts?
I’m sure this tutorial will be the best way to learn React on the web pretty soon, congratulations!
Wow It’s very surprising. Thank you for the announcement
Are you planning to support React Native as well when it is ready for supporting android ?
I think that Meteor + official React&React Native will change a lot of things as not only for fast webapp/mobile development but also for easier scale-out and maintainable applications.
Interesting tutorial, probably the inner React component Task should comminicate to the parent App/TaskList to persist the data and not call Tasks.insert(..) directly.
I think this is a reasonable way to go, there are just a couple considerations:
People need to learn about binding functions for this; is it really worth it?
Is the app actually more maintainable with this? What are the chances that you would want the Task component to operate on a collection that isn’t Tasks?
There is more code to explain, since we need to pass the callbacks in from App, although this might not be a big issue
What you say is correct. Personally i think people should start to think about MeteorReact components and pure React components separation since the beginning.
Some advantages I think:
one or less components dependent on db api, minimongo miniredis
Easier component testing in isolation?
More affinity and interoperability with the react components that already exist
I see - what you’re saying is that it’s valuable to have components that can work in isolation of Meteor, and that you should minimize the number of components in your app that contain data loading/manipulating logic. That makes sense to me. I’ll see what it takes to refactor that part.
I think that overall the tutorial looks good so far. I know that I am probably sounding like a broken record at this point, but I really feel that these tutorials should include how to best handle routing. Now I don’t know if MDG wants to officially endorse something like FlowRouter for the time being, but in my mind routing should be one of the first things covered when learning a new web framework. Not knowing how to handle routing “the right way” when coming into a new framework can be a major road block for a lot of people.
@sashko This was a great tutorial and I got to know React a bit better from it! Sorry I don’t have better feedback, but this means that it’s nearly perfect (at least for me).
Step 5 - while I know this is more a meteor tutorial than a React one, it might be worth covering how this.props.task._id gets assigned (data-reactid).
Step 7 - it’s not clear from the text what meteor install-sdk ios and meteor add-platform ios do.
From the command names I’d guess install-sdk downloads and installs on this system, and I only need to do that once, and that add-platform adds it to this particular project?
Finally (and guessing you know this) steps 2-5 reference App.jsx and Task.jsx in the links to github, whereas the tutorial is all about simple-todos-react.jsx.
So I talked to a couple people, and it looks like Routing might make it into the tutorial soon. Probably not in this version, but hopefully in the near future. I agree that it’s a basic concern for a wide range of apps.
