Realm React Native 1.0: Realm Mobile Platform Support
Today, we’ve got two announcements for the React Native community. First, after nearly a year of open source collaboration, Realm React Native has reached 1.0, marking a key milestone as a powerful object database, and a foundation for great reactive apps. We’re also very excited to announce that the Realm Mobile Platform now supports React Native. With just a few lines of code, React Native developers can now build exciting new experiences on top of our realtime platform.
When we launched the beta of Realm React Native early last year, we found lots of uptake from React Native’s passionate developer community, and from companies like TaskRabbit. Because Realm is a cross-platform database, you can build apps that reuse more code, making your data layer more maintainable and less fragile. And Realm’s live objects and collection notifications mean that your app really is reactive — it responds in realtime as the Realm-backed data updates. To see how easy it is to get started, just check out our Realm React Native documentation.
But Realm is more than just a client-side database. With the release of Realm React Native 1.0, React Native developers can now build powerful new apps on top of the Realm Mobile Platform. By connecting to the Realm Object Server and then creating synced Realms in your app, your Realm-backed objects will automatically sync whenever their properties change, while still being stored locally for offline use. The Realm Mobile Platform also gives you tools for handling conflict resolution, user authentication, and customizable permissions, so that you have all you need to build compelling, collaborative experiences.
The Professional and Enterprise Editions also include Event Handling, which lets you write reactive server-side JavaScript code. Now, you can bring reactive principles across your whole codebase, ensuring that your app responds predictably whenever and wherever user data changes.
It’s easy to integrate your own React Native app with the Realm Mobile Platform. Authenticate a user, connect to the Realm Object Server, then reactively update your app’s UI with this code sample:
import React, { Component } from 'react';
import { Text } from 'react-native';
import Realm from 'realm';
import { ListView } from 'realm/react-native';
export default class DogsView extends Component {
constructor(props) {
super(props);
// Initialize the component with an empty data source
const ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2});
this.state = { dataSource: ds };
}
componentWillMount() {
// `this.props` contains the username and password passed to the DogsView instance
Realm.Sync.User.login('https://my-realm-server.com', this.props.username, this.props.password, (error, user) => {
let realm = new Realm({
schema: [ { name: 'Dog', properties: { name: 'string' } } ],
sync: { user, url: 'realms://my-realm-server.com/~/dogs'}
});
// Once the user is logged in and we have a synced realm,
// reset the DataSource with all the Dog objects in the realm.
// Also subscribe for changes on the Dogs collection and refresh the UI when they occur
const dogs = realm.objects('Dog');
this.setState({ realm, dataSource: this.state.dataSource.cloneWithRows(dogs) });
dogs.addListener(() => this.forceUpdate());
});
}
render() {
return (<ListView dataSource={this.state.dataSource} renderRow={(item) => <Text>{item.name}</Text>} />);
}
}
To get started with the Realm Mobile Platform, check out our documentation. Start making something your users will really love — across all their devices, whether they’re online or offline.