{"id":16298863,"url":"https://github.com/braden1996/react-native-replicache","last_synced_at":"2025-04-09T20:13:37.694Z","repository":{"id":65962396,"uuid":"602226745","full_name":"Braden1996/react-native-replicache","owner":"Braden1996","description":"Plug-in React Native compatibility bindings for Replicache.","archived":false,"fork":false,"pushed_at":"2024-07-28T13:51:44.000Z","size":1926,"stargazers_count":86,"open_issues_count":3,"forks_count":5,"subscribers_count":5,"default_branch":"master","last_synced_at":"2025-04-09T20:13:30.551Z","etag":null,"topics":["expo","react","react-native","real-time","replicache","typescript"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Braden1996.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-02-15T19:04:34.000Z","updated_at":"2025-04-03T16:31:12.000Z","dependencies_parsed_at":"2023-03-03T22:30:44.471Z","dependency_job_id":"c54800e3-5918-4926-b1ca-9a7b150e92db","html_url":"https://github.com/Braden1996/react-native-replicache","commit_stats":{"total_commits":35,"total_committers":5,"mean_commits":7.0,"dds":0.3142857142857143,"last_synced_commit":"230813a87bd1925e94db3cb40d4177a7ba05c5a6"},"previous_names":[],"tags_count":5,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Braden1996%2Freact-native-replicache","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Braden1996%2Freact-native-replicache/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Braden1996%2Freact-native-replicache/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Braden1996%2Freact-native-replicache/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Braden1996","download_url":"https://codeload.github.com/Braden1996/react-native-replicache/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248103872,"owners_count":21048245,"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":["expo","react","react-native","real-time","replicache","typescript"],"created_at":"2024-10-10T20:45:47.252Z","updated_at":"2025-04-09T20:13:37.674Z","avatar_url":"https://github.com/Braden1996.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# React Native Replicache\n\n\u003e Plug-in React Native compatibility bindings for [Replicache](https://replicache.dev/).\n\n\u003chttps://user-images.githubusercontent.com/5165963/219898954-f5e94045-69bf-4c33-84e8-7d152c6f2c32.mov\u003e\n\n## Replicache version compatibility\n\n- 1.0.0 : replicache \u003c= 14.2.2\n- 1.3.0 : replicache \u003e= 15\n\n## Why is this needed?\n\nReplicache enables us to build applications that are performant, offline-capable and collaborative. By default, it uses [IndexedDB](https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API) for client-side persistance. Unfortunately, this technology is not available in React Native and is only supported in web-browsers.\n\nThankfully, Replicache allows us to provide our own transactional data-store via [`kvStore`](https://doc.replicache.dev/api/interfaces/ReplicacheOptions#kvstoree). The goal of this project is to provide some implementations of such a store, along with some guidance in getting up and running with Replicache in React Native.\n\n## What are the strategies?\n\nReact Native has relatively good support for SQLite - which provides the [strict serializable](https://jepsen.io/consistency/models/strict-serializable) transactions that we require.\n\nIn particular, we provide the choice between three SQLite bindings:\n\n1. [`@react-native-replicache/react-native-expo-sqlite`](https://github.com/Braden1996/react-native-replicache/tree/master/packages/react-native-expo-sqlite)\n   - Backed by [`expo-sqlite`](https://docs.expo.dev/versions/latest/sdk/sqlite/)\n   - Supported in [Expo Go](https://expo.dev/client).\n2. [`@react-native-replicache/react-native-op-sqlite`](https://github.com/Braden1996/react-native-replicache/tree/master/packages/react-native-op-sqlite)\n   - Backed by [`react-native-op-sqlite`](https://github.com/OP-Engineering/op-sqlite)\n   - Better performance.\n\n### Any additional considerations?\n\nSome configuration is required to receive [poke](https://doc.replicache.dev/byob/poke) events from the server. In our example, [seen here](https://github.com/Braden1996/react-native-replicache/blob/master/packages/example/mobile-react-native/src/use-replicache.ts), we use a polyfill for Server Sent Events. These aren't built into React Native, but are really handy for a demo.\n\nYou most likely want to use web-sockets for this. This is relatively trivial with Pusher/Ably etc and similar to the web-app so we won't discuss that further here.\n\n## How can I install this?\n\n1. Install the following in your React Native project:\n   - `yarn add expo-crypto`\n   - Decide which SQLite binding is for you and install one of the following:\n     - `yarn add @op-engineering/op-sqlite @react-native-replicache/react-native-op-sqlite`\n     - `yarn add expo-sqlite @react-native-replicache/expo-sqlite`\n2. Ensure that you've polyfilled `crypto.getRandomValues` on the global namespace.\n   - See [here for an example](https://github.com/Braden1996/react-native-replicache/blob/master/packages/example/mobile-react-native/src/crypto-polyfill.ts).\n3. Pass in your chosen SQLite binding's React Native Replicache binding into Replicache's `kvStore` option.\n   - This will be one of the following, depending on the binding you chose:\n     - `createReplicacheOPSQLiteKVStore`\n     - `createReplicacheExpoSQLiteKVStore`\n   - See [here for an example](https://github.com/Braden1996/react-native-replicache/blob/master/packages/example/mobile-react-native/src/use-replicache.ts).\n\n## How can I experiment with this locally?\n\n### Prerequisites\n\n- Environment capable of developing iOS/Android applications (iOS is likely preferred).\n  - See [How to install React Native on Mac](https://dev-yakuza.posstree.com/en/react-native/install-on-mac/)\n    - or: [Setting up the development environment](https://reactnative.dev/docs/environment-setup)\n  - Note: Installing [Xcode](https://developer.apple.com/xcode/) from the [Mac App Store](https://apps.apple.com/us/app/xcode/id497799835?mt=12) tends to be unusually slow and buggy.\n    - Try download it from the [Apple website](https://developer.apple.com/xcode/) instead.\n\n### Instructions\n\n1. Clone the repository: `git clone https://github.com/braden1996/react-native-replicache.git`\n2. Install yarn dependencies from repo root: `yarn install`\n3. Perform an initial build: `yarn build`\n4. Install the example iOS app onto a simulator/emulator or connected physical device, e.g: `yarn workspace @react-native-replicache/example-mobile-react-native ios`\n5. Once the above has installed onto your device, you can cancel the now running [Metro bundler](https://facebook.github.io/metro/) and simply start dev for all workspaces: `yarn run dev`.\n\n### Tips\n\n- [Flipper](https://fbflipper.com/) has been configured for use with the example app.\n  - Download it to browser network requests etc\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbraden1996%2Freact-native-replicache","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbraden1996%2Freact-native-replicache","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbraden1996%2Freact-native-replicache/lists"}