A simple retail inventory management application built with Couchbase Lite for web and mobile (iOS and Android) featuring real-time sync capabilities with Couchbase Capella App Services.
- 📱 Offline-First: Ability to operate in disconnected mode without an Internet connection with Couchbase Lite as a local database.
- 🔄 Real-Time Sync: Opportunistically sync data, in uni-directional or bi-directional mode with backend Couchbase Capella clusters via Capella App Services. Data is synced across iOS, Android and JS app via App Services.
- 🔄 Peer-to-Peer Sync: Sync data directly between iOS and Android apps over a local network
- 🏪 Multi-Platform Support: Support for iOS, Android and web. Note that Couchbase Lite supports a broader range of platforms including C, Java, .NET, React Native, Ionic, Flutter etc.
A demo video where we are able to sync data between two android devices and an iPhone with CouchbaseLite's P2P.
P2P_demo_android-android-ios.mp4
The complete setup of the demo would look like this:
Note
You are not required to go through the entire setup. Depending on the app and functionality of interest, you can proceed with just the setup required for just that app and functionality.
These are common set of instructions that you must follow to setup the cloud backend regardless of whether you are running iOS, Android and web versions of the app.
Although instructions are specified for Capella App Services, equivalent instructions apply to self-managed Sync Gateway as well.
-
Create a couchbase cluster on Capella by following these instructions.
-
Create a bucket named "supermarket" cluster on Capella by following these instructions.
-
Create two scopes named "NYC-Store" and "AA-Store" in the bucket by following these instructions.
-
In each scope, create three collections named "inventory", "profile" and "orders" respectively by following these instructions.
-
At end of the steps, your cluster configuration should look something like
. You have probably not yet imported any data, so your collections will show no documents.
-
Download and unzip sample dataset from demo-dataset.zip
-
Follow instructions to import the data set into corresponding scope/collection via inline mode.
Note
When importing data, Select the Field option to map doc Id.
-
Create App Services named "supermarket-appservice" (you can name it anything) that is linked to supermarket cluster by following these instructions
-
Create two App Endpoints corresponding to the two scopes. This is an example for AA store. Name App Endpoints as "supermarket-aa" and "supermarket-nyc" by following these instructions.
The configuration of App Endpoint should look like this:
- Configure two App Users corresponding to the two stores (one in each App Endpoint) by following these instructions.You can choose any password. If you would like to run the app with prefilled demo credentials, you must use the password mentioned below. This will make more sense when you setup the individual apps later.
- user=[email protected] / password=P@ssword1 (this is created in App Endpoint supermarket-aa)
- user=[email protected] / password=P@ssword1 (this is created App Endpoint supermarket-nyc)
The configuration of App User should look something like this:
- Go to the "connect" tab and record the public URL endpoint. You will need it when you setup your apps later
If you are trying out the web application, you will need to configure App Endpoints to enable CORS. Skip this section if you are only testing mobile apps. Repeat these steps for each of the App Endpoints
-
Enable CORS on your App Endpoint from the Settings Page by following these instructions
-
Set Origin as "http://localhost:8080". This corresponds to the URL that is running the web app. Make sure the ports match as well
-
Set Login Origin as "http://localhost:8080". This corresponds to the URL that is running the web app. Make sure the ports match as well
-
Set Allowed Headers as "Authorization". This corresponds to the URL that is running the web app. Make sure the ports match as well
The repo is organized as follows
-
iOS: This folder includes source code corresponding to the iOS version of the retail application. Follow the instructions in the README.md file in the folder to build and run the iOS app. That folder also includes instructions to run the app in peer-to-peer mode.
-
Android: This folder includes source code corresponding to the Android version of the retail application. Follow the instructions in the README.md file in that folder to build and run the Android app. That folder also includes instructions to run the app in peer-to-peer mode.
-
web: This folder includes source code corresponding to the web version of the retail application. Follow the instructions in the README.md file in that folder to build and run the web app.