Storing data

The Minis platform provides a few different ways to store data associated with a user. This guide will walk you through the different options and when to use each.

Anchor to Async storageAsync storage

The useAsyncStorage hook provides a way to store data in the device's local storage. It's a simple and easy way to store data that persists across sessions, but it will be deleted if the user uninstalls the Shop app.

HookLearn more about the useAsyncStorage hook

Using async storage

import {useEffect} from 'react'

import {useAsyncStorage} from '@shopify/shop-minis-react'

export default function MyComponent() {

const {getItem, setItem, removeItem, getAllKeys, clear} = useAsyncStorage()

useEffect(() => {

async function handleStorageOperations() {

// Get an item from storage

const value = await getItem({key: 'myKey'})

console.log({value})

// Set an item in storage

await setItem({key: 'myKey', value: 'Hello, World!'})

// Remove an item from storage

await removeItem({key: 'myKey'})

// Get all keys in storage

const keys = await getAllKeys()

console.log({keys})

// Clear all items from storage

await clear()

}

handleStorageOperations()

}, [getItem, removeItem, setItem, getAllKeys, clear])

}

Anchor to Secure storageSecure storage

The useSecureStorage hook provides a way to store credentials and other sensitive data in the device's secure storage. It's a more secure way to store data that persists across sessions, but it will be deleted if the user uninstalls the Shop app.

HookLearn more about the useSecureStorage hook

Was this page helpful?