{"id":16871319,"url":"https://github.com/blueromans/ReactNativeMeteorClient","last_synced_at":"2025-11-12T18:30:16.793Z","repository":{"id":59567100,"uuid":"537957592","full_name":"blueromans/ReactNativeMeteorClient","owner":"blueromans","description":"Meteor Client For React Native","archived":false,"fork":false,"pushed_at":"2022-10-29T11:24:06.000Z","size":78,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-02-13T11:54:06.415Z","etag":null,"topics":["android","ios","javascript","meteor","meteor-client","mongo","npm-package","react-native","socket","websocket"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/blueromans.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.MD","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2022-09-17T23:55:36.000Z","updated_at":"2022-10-29T11:19:14.000Z","dependencies_parsed_at":"2023-01-21T00:15:45.630Z","dependency_job_id":null,"html_url":"https://github.com/blueromans/ReactNativeMeteorClient","commit_stats":null,"previous_names":["blueromans/react-native-meteor"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/blueromans%2FReactNativeMeteorClient","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/blueromans%2FReactNativeMeteorClient/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/blueromans%2FReactNativeMeteorClient/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/blueromans%2FReactNativeMeteorClient/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/blueromans","download_url":"https://codeload.github.com/blueromans/ReactNativeMeteorClient/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":239201652,"owners_count":19599076,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["android","ios","javascript","meteor","meteor-client","mongo","npm-package","react-native","socket","websocket"],"created_at":"2024-10-13T15:08:02.140Z","updated_at":"2025-11-12T18:30:16.727Z","avatar_url":"https://github.com/blueromans.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# @blueromans/react-native-meteor\n\n This project was adapted from [react-native-meteor](https://github.com/inProgress-team/react-native-meteor) by inProgress Team to be more up to date and focused. This documentation has been revised to be more coherent, dependencies have been updated, and the API has been brought closely in-line with Meteor.\n\n If you are moving from that package to this one, you may find certain parts are missing which were deemed to be outside the scope of this package (ListViews), they were removed/deprecated in meteor core, or they are outdated methods of connecting Tracker with your componenets (connectMeteor, composeWithTracker and createContainer).\n\n\u003c!-- TOC depthFrom:1 depthTo:6 withLinks:1 updateOnSave:1 orderedList:0 --\u003e\n\n- [Supporting The Project](#supporting-the-project)\n- [Installation And Setup](#installation-and-setup)\n  - [React Native](#react-native)\n    - [Caveats](#caveats)\n  - [Android](#android)\n- [Example Usage](#example-usage)\n  - [withTracker](#withtracker)\n  - [useTracker](#usetracker)\n- [External Usage](#external-usage)\n- [Demo](#demo)\n- [Reactive Data Sources](#reactive-data-sources)\n- [API](#api)\n  - [Subscriptions](#subscriptions)\n  - [Collections](#collections)\n  - [Meteor.is/Environment/](#meteorisenvironment)\n- [DDP connection](#ddp-connection)\n  - [Meteor.connect(url, options)](#meteorconnecturl-options)\n    - [Arguments](#arguments)\n  - [Meteor.ddp](#meteorddp)\n  - [Meteor.disconnect()](#meteordisconnect)\n- [Meteor Methods](#meteor-methods)\n- [Additional Packages](#additional-packages)\n  - [ReactiveDict](#reactivedict)\n  - [Accounts](#accounts)\n  - [React Meteor Data](#react-meteor-data)\n- [Development](#development)\n- [Contribution](#contribution)\n\n\u003c!-- /TOC --\u003e\n\n## Supporting The Project\n\nFinding the time to maintain FOSS projects can be quite difficult. I am myself responsible for over 30 personal projects across 2 platforms, as well as Multiple others maintained by the [Meteor Community Packages](https://github.com/meteor-community-packages) organization. Therfore, if you appreciate my work, I ask that you either sponsor my work through GitHub, or donate via Paypal or Patreon. Every dollar helps give cause for spending my free time fielding issues, feature requests, pull requests and releasing updates. Info can be found in the \"Sponsor this project\" section of the [GitHub Repo](https://github.com/copleykj/react-native-meteor)\n\n## Installation And Setup\n\n```sh\nnpm i --save @blueromans/react-native-meteor\n```\n\n### React Native\n\nWhile this package was originally intended soely for React Native, it can now be used in other environments as well. Because of this, when using this package with React Native you will need to install the `netinfo` and `async-storage` plugins provided by `@react-native-community` and then import parts of React Native that help this package optimally use React Native features, and pass them to the `configureOptionalDeps` method provided by this package.\n\n```sh\nnpm i --save @react-native-community/netinfo @react-native-community/async-storage\n```\n\n```js\nimport Meteor, { Mongo, useTracker, configureOptionalDeps } from '@blueromans/react-native-meteor';\nimport NetInfo from '@react-native-community/netinfo';\nimport Storage from '@react-native-community/async-storage';\nimport { unstable_batchedUpdates as batchedUpdates } from 'react-native/Libraries/Renderer/shims/ReactNative';\n\nconfigureOptionalDeps({ InteractionManager, batchedUpdates, NetInfo, Storage });\n```\n\n#### Caveats\n\nCalling `configureOptionDeps` will cause `Meteor.isReactNative` to be set to true. To stop this from happening in cases where you aren't using React Native, but want to configure an alternative Storage or NetInfo, pass `isReactNative: false` along with the rest of the options.\n\n```js\nconfigureOptionalDeps({ Storage: localForage, isReactNative: false });\n```\n\n### Android\n\nAdd the following permission to your AndroidManifest.xml file for faster reconnects to the DDP server when your device reconnects to the network.\n\n```xml\n\u003cuses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\" /\u003e\n```\n\nIf running an android emulator you have to forward the port of your meteor app.\n\n```shell\nadb reverse tcp:3000 tcp:3000\n```\n\n## Example Usage\n\n### withTracker\n\n```javascript\n\nimport React, { Component } from 'react';\nimport { View, Text } from 'react-native';\nimport Meteor, { withTracker } from 'react-native-meteor';\nimport TodosCollection from '../api/todo';\n\nMeteor.connect('ws://192.168.X.X:3000/websocket'); //do this only once\n\nclass App extends Component {\n  renderRow(todo) {\n    return (\n      \u003cText\u003e{todo.title}\u003c/Text\u003e\n    );\n  }\n  render() {\n    const { todos, todosReady } = this.props;\n\n    return(\n      \u003cView\u003e\n          {todosReady ? todos.map(renderRow) : \u003cView\u003eLoading...\u003c/View\u003e}\n      \u003c/View\u003e\n    )\n  }\n}\n\nexport default withTracker(params=\u003e{\n  return {\n    todosReady: Meteor.subscribe('todos').ready(),\n    todos: TodosCollection.find({done: false}, { sort: { createdAt: -1 }}),\n  };\n})(App);\n```\n\n### useTracker\n\n```javascript\n\nimport React, { Component } from 'react';\nimport { View, Text } from 'react-native';\nimport Meteor, { useTracker } from 'react-native-meteor';\nimport TodosCollection from '../api/todo';\n\nMeteor.connect('ws://192.168.X.X:3000/websocket'); //do this only once\n\nconst renderRow = (todo) =\u003e {\n  return (\n    \u003cText\u003e{todo.title}\u003c/Text\u003e\n  );\n}\nexport default () =\u003e {\n  const { todos, todosReady } = useTracker(() =\u003e {\n    return {\n      todosReady: Meteor.subscribe('todos').ready(),\n      todos: TodosCollection.find({done: false}, { sort: { createdAt: -1 }}),\n    };\n  });\n\n  return(\n    \u003cView\u003e\n        {todosReady ? todos.map(renderRow) : \u003cView\u003eLoading...\u003c/View\u003e}\n    \u003c/View\u003e\n  )\n}\n```\n\n## External Usage\n\nI've put a bit of time into being able to make use of this package outside of React Native. I can't guarantee perfection, but it seems to work well within a CodeSandbox project. Feel free to fork the following sandbox and give it a go.\n\n[![Edit @blueromans/react-native-meteor Test Sandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/blueromansreact-native-meteor-test-sandbox-by9ly?fontsize=14\u0026hidenavigation=1\u0026theme=dark)\n\n## Demo\n\nA very simple demo, replicating the CodeSandbox project above, is available in the demo folder of the GitHub Repo. Make sure you have Expo installed and then from the `demo` folder run `expo start`.\n\n---\n\n## Reactive Data Sources\n\nThese reactive sources can be used inside `withTracker` and `useTracker`. They will be populated into your component if they change.\n\n- [Meteor.subscribe()](https://docs.meteor.com/api/pubsub.html#Meteor-subscribe)\n- [Mongo.Collection(collectionName, options)](https://docs.meteor.com/api/collections.html#Mongo-Collection)\n  - [.find(selector, options)](https://docs.meteor.com/api/collections.html#Mongo-Collection-find)\n  - [.fndOne(selector, options)](https://docs.meteor.com/api/collections.html#Mongo-Collection-findOne)\n- [Meteor.user()](https://docs.meteor.com/api/accounts.html#Meteor-user)\n- [Meteor.userId()](https://docs.meteor.com/api/accounts.html#Meteor-userId)\n- [Meteor.loggingIn()](https://docs.meteor.com/api/accounts.html#Meteor-loggingIn)\n- [Meteor.status()](https://docs.meteor.com/api/connections.html#Meteor-status)\n- [ReactiveDict()](https://docs.meteor.com/api/reactive-dict.html)\n\n---\n\n## API\n\n### Subscriptions\n\n- [Meteor.subscribe()](https://docs.meteor.com/api/pubsub.html#Meteor-subscribe)\n\n```javascript\nimport Meteor, { Tracker } from '@blueromans/react-native-meteor';\n\nconst handle = Meteor.subscribe('blueromans.friends');\n\nTracker.autorun(() =\u003e{\n    if(handle.ready()){\n        console.log('Subscription ready...');\n        handle.stop();\n    }\n});\n```\n\n### Collections\n\nCollections work almost exactly like they do inside your Meteor app. To create a new collection you call `new Mongo.Collection('collectionName', options)`. Currently only the `transform` option will be used. If you are sharing code between apps, other options will be ignored. The only potential issue that may arise here is if you use the `connection` option. Only the default connection is currently supported. If you have use for multiple connections, PR's and FR's are welcome.\n\n- Mongo.Collection(collectionName, options)\n  - [.find(selector, options)](https://docs.meteor.com/api/collections.html#Mongo-Collection-find)\n  - [.fndOne(selector, options)](https://docs.meteor.com/api/collections.html#Mongo-Collection-findOne)\n  - [.insert(doc, callback)](https://docs.meteor.com/api/collections.html#Mongo-Collection-insert)\n  - [.update(id, modifier, [options], [callback])](https://docs.meteor.com/api/collections.html#Mongo-Collection-update)\n  - [.remove(id, callback(err, countRemoved))](https://docs.meteor.com/api/collections.html#Mongo-Collection-remove)\n\nThese methods work offline. That means that elements are correctly updated offline, and when you reconnect to ddp, Meteor calls are taken care of.\n\n```javascript\nimport { Mongo } from '@blueromans/react-native-meteor';\nimport { Widget } from './models/widget';\n\nlet WidgetsCollection = Mongo.Collection(\"widgets\", {\n  transform: (document) =\u003e {\n    //make our documents instances of the Widget class\n    return new Widget(document);\n  }\n});\n\nconst aWidget = WidgetsCollection.findOne();\n\nconst cursorOfWidgets = WidgetsCollection.find();\n\nconst arrayOfWidgets = WidgetsCollection.find().fetch();\n```\n\n\n### Meteor.is/Environment/\n\nKeeping in line with Meteor's API, `isClient` is provided as well as a `isReactNative`, similar to how Meteor provides `isCordova` when code is running in a cordova build. `isServer` and `isCordova` are not provided as they will still be falsey when checking. These properties allow for code reuse across your codebases.\n\n- Meteor.isClient - True\n- Meteor.isReactNative - True\n\n## DDP connection\n\n### Meteor.connect(url, options)\n\nConnect to a DDP server. You only have to do this once in your app.\n\n#### Arguments\n\n- `url` **string** *required*\n- `options` **object** Available options are :\n  - autoConnect **boolean** [true] whether to establish the connection to the server upon instantiation. When false, one can manually establish the connection with the Meteor.ddp.connect method.\n  - autoReconnect **boolean** [true] whether to try to reconnect to the server when the socket connection closes, unless the closing was initiated by a call to the disconnect method.\n  - reconnectInterval **number** [10000] the interval in ms between reconnection attempts.\n\n### Meteor.ddp\n\nOnce connected to the ddp server, you can access every method available in [ddp.js](https://github.com/mondora/ddp.js/).\n\n- Meteor.ddp.on('connected')\n- Meteor.ddp.on('added')\n- Meteor.ddp.on('changed')\n\n### Meteor.disconnect()\n\nDisconnect from the DDP server.\n\n## Meteor Methods\n\n- [Meteor.call](http://docs.meteor.com/#/full/meteor_call)\n\n## Additional Packages\n\n### ReactiveDict\n\n```javascript\nimport { reactivedict } from 'react-native-meteor';\n```\n\nSee [documentation](https://atmospherejs.com/meteor/reactive-dict).\n\n### Accounts\n\n```javascript\nimport Meteor, { Accounts } from 'react-native-meteor';\n```\n\n- [Accounts.createUser](http://docs.meteor.com/#/full/accounts_createuser)\n- [Accounts.changePassword](http://docs.meteor.com/#/full/accounts_forgotpassword)\n- [Accounts.forgotPassword](http://docs.meteor.com/#/full/accounts_changepassword)\n- [Accounts.resetPassword](http://docs.meteor.com/#/full/accounts_resetpassword)\n- [Accounts.onLogin](http://docs.meteor.com/#/full/accounts_onlogin)\n- [Accounts.onLoginFailure](http://docs.meteor.com/#/full/accounts_onloginfailure)\n- [Meteor.user()](http://docs.meteor.com/#/full/meteor_user)\n- [Meteor.userId()](http://docs.meteor.com/#/full/meteor_userid)\n- [Meteor.loggingIn()](http://docs.meteor.com/#/full/meteor_loggingin)\n- [Meteor.loginWithPassword](http://docs.meteor.com/#/full/meteor_loginwithpassword) (Please note that user is auto-resigned in - like in Meteor Web applications - thanks to React Native AsyncStorage.)\n- [Meteor.logout](http://docs.meteor.com/#/full/meteor_logout)\n- [Meteor.logoutOtherClients](http://docs.meteor.com/#/full/meteor_logoutotherclients)\n\n### React Meteor Data\n\n```javascript\nimport { withTracker, useTracker} from 'react-native-meteor';\n```\n\nSee Meteor's  [react-meteor-data documentation](https://atmospherejs.com/meteor/react-meteor-data) for more info.\n\n---\n\n## Development\n\nThis package uses Rollup.js as it's bundler. Run `npm install --only=dev` to install dev dependencies and then run `npm run dev` to bundle the package and watch for changes.\n\nFor single, unwatched builds use `npm run build`\n\nFor developing and testing locally in a React Native project, you can use [wml](https://www.npmjs.com/package/wml) to link this package to your React Native project.\n\n## Contribution\n\nEslint configurations are provided for sanity. After cloning, you can run `npm install --only=dev`. This will install all necessary dependencies to enable linting in your code editor such as vscode.\n\nPull Requests, Feature Requests, and Bug Reports are welcome!\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fblueromans%2FReactNativeMeteorClient","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fblueromans%2FReactNativeMeteorClient","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fblueromans%2FReactNativeMeteorClient/lists"}