Amplify DataStore provides a programming model for leveraging shared and distributed data without writing additional code for offline and online scenarios, which makes working with distributed, cross-user data just as simple as working with local-only data.
Note: this allows you to start persisting data locally to your device with DataStore, even without an AWS account.
GoalTo setup and configure your application with Amplify DataStore and use it to persist data locally on a device.
PrerequisitesTo get started, first create a new React app with vite using the following commands:
To use Amplify, you must first initialize it for use in your project. If you haven't already done so, run this command:
The base structure for a DataStore app is created by adding a new GraphQL API to your app.
The CLI will prompt you to configure your API. Select GraphQL as the API type and reply to the questions as shown below. Conflict detection is required when using DataStore to sync data with the cloud.
? Please select from one of the below mentioned services:
? Here is the GraphQL API that we will create. Select a setting to edit or continue:
? Here is the GraphQL API that we will create. Select a setting to edit or continue:
`Authorization modes: API key (default, expiration time: 7 days from now)`
? Choose the default authorization type for the API
? Enter a description for the API key:
? After how many days from now the API key should expire (1-365):
? Configure additional auth types?
? Here is the GraphQL API that we will create. Select a setting to edit or continue:
`Conflict detection (required for DataStore): Disabled`
? Enable conflict detection?
? Select the default resolution strategy
? Here is the GraphQL API that we will create. Select a setting to edit or continue:
? Choose a schema template
`Single object with fields (e.g., âTodoâ with ID, name, description)`
Troubleshooting: Cloud sync will fail without the conflict detection configuration. To enable it for an existing project, run amplify update api and choose Enable conflict detection (required for DataStore).
Next, install the Amplify library dependencies in your project by running:
Idiomatic persistenceDataStore relies on platform standard data structures to represent the data schema in an idiomatic way. The persistence language is composed by data types that satisfies the Model interface and operations defined by common verbs such as save, query and delete.
The first step to create an app backed by a persistent datastore is to define a schema. DataStore uses GraphQL schema files as the definition of the application data model. The schema contains data types and relationships that represent the app's functionality.
Sample schemaFor the next steps, let's start with a schema for a small blog application. Currently, it has only a single model. New types and constructs will be added to this base schema as more concepts are presented.
Open the schema.graphql file located by default at amplify/backend/{api_name}/ and define a model Post as follows.
Now you will to convert the platform-agnostic schema.graphql into platform-specific data structures. DataStore relies on code generation to guarantee schemas are correctly converted to platform code.
Like the initial setup, models can be generated either using the IDE integration or Amplify CLI directly.
Code generation: Platform integrationWhen using npx amplify-app, an npm script named amplify-modelgen should be added to your package.json. You can generate model code with the following command.
The following files will be generated.
The .d.ts are TypeScript declaration files. If your project does not use TypeScript, do not worry, those files can still provide most editors a better developer experience, with a more accurate auto-complete and realtime type checking. Worst case scenario they will just be ignored.
Models can also be generated using the Amplify CLI directly.
In your terminal, make sure you are in your project/root folder and execute the codegen command:
You can find the generated files at amplify/generated/models/.
When the aws-amplify/datastore dependency is added to the project, the plugin is automatically initialized when you start using it.
Now the application is ready to execute persistence operations. The data will be persisted to a local database, enabling offline-first use cases by default.
Even though a GraphQL API is already added to your project, the cloud synchronization will only be enabled when the API plugin is initialized and the backend provisioned. See the Next steps for more info.
Writing to the databaseTo write to the database, create an instance of the Post model and save it.
To read from the database, the simplest approach is to query for all records of a given model type.
Next stepsCongratulations! Youâve created and retrieved data from the local database. Check out the following links to see other Amplify DataStore use cases and advanced concepts:
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4