React Native + Meteor: react-native-meteor vs. meteor-client-bundler

If you’ve spent any time looking into building an app with React Native and Meteor you’ve likely come across the package react-native-meteor. You may have also come across meteor-client-bundler which is a newer entry in the game.

So what are they?

Each package is designed to allow you to easily connect to and work with a Meteor server, via DDP, from a client that isn’t integrated with the Meteor build tool.

They do this in different ways, each with benefits and drawbacks.

react-native-meteor

This package integrates within your React Native app and is designed specifically for React Native. The goal is to provide a one-to-one match of the client side Meteor functionality. Having built multiple apps on this package I can tell you it does this well.

This project is completely independent of Meteor — it’s just aware of the DDP protocol exposed by Meteor and makes easy to use wrappers around DDP to access it. That means it depends on third party code to do some things (minimongo, tracker, etc).

Benefits

This is a battle tested package. I’ve used it on multiple React Native + Meteor projects and know numerous other who have done the same.
API closely matches that of the Meteor client API meaning that it’s easy to use.
Just about everything works and works well. Not much left to be desired.
Get up and running quickly. Minimal configuration. Once installed from NPM you can get things going in no time.
Simple. I love simple.
Great learning resources. 😄

Drawbacks

API is slightly different than that of the “real” Meteor client. There are some small differences you need to be aware of, but they’re clearly documented
Dependence on third party packages. react-native-meteor uses some third party packages that don’t have the same kind of support/battle testing that it does on Meteor. They work well but it’s something to be aware of.
OAuth is going to be a pain.
Maintenance. This is an open source package where people are maintaining it on the side.

Getting Started

If you’re interested in getting up and running with a React Native + Meteor stack that uses react-native-meteor check out the boilerplate I’ve put together.

Thank you to everyone that has made this package a reality and continues to put the time into maintaining it. #ThankOSSMaintainers

meteor-client-bundler

Unlike react-native-meteor this package is designed to work for any client — it was actually built when getting an Ionic app to work with Meteor.

It also works in a different way — it’s a command line tool that will bundle the Meteor client code and put it into your React Native project rather than being a package that simply “speaks” DDP to communicate with a Meteor server. So whenever you change something in your Meteor app you’ll want to re-bundle the client side code.

Benefits

Takes the actual client side Meteor code and injects it into your React Native app making sure you’re running exactly what’s on the Meteor server.
Use the “real” packages coming from Meteor.

Drawbacks

Potential mismatch of code injected between what’s running on the Meteor server and what’s on your user’s app.
Dependence on the DOM. There is some work in progress to get things going out of the box but it will take time. There are third-party solutions to get it running today.
OAuth is going to be a pain.
Setup can be a bit trickier, at least it was for me.
Maintenance. This is an open source package where people are maintaining it on the side.

Getting Started

To get up and running with a React Native + Meteor stack using meteor-client-bundler check out this boilerplate.

Thank you to everyone that has made this package a reality and continues to put the time into maintaining it. #ThankOSSMaintainers

In Conclusion

I think both are solid solutions. They approach the problem in different ways and they’ve each got their benefits and drawbacks. Nothing is going to be perfect so weigh the pros and cons, make a decision, and when you run into an issue contribute back to the project.

If neither solution works for you you can always manage the ddp connection directly!

If you’re interested in a course on building a location based app using the React Native + Meteor stack check out my course Learn React Native + Meteor (new lower prices!). We cover usage of react-native-meteor in the course but also have a great community you can be a part of and discuss the possibility of using meteor-client-bundler instead.