Comment on page
Your First dApp
This tutorial shows you how to create a basic React dApp and use the Vault+ SDK to connect with the Vault+.
- 1.Create a React dApp & Install Dependencies
- 2.Integrate your dApp with Vault+
- 3.Read credential and schema data from Vault+
- 1.Create a React project
npx create-react-app your-first-dapp-react
cd your-first-dapp-react
- 2.Install the required dependencies
@serv-official/vault-sdk - For connecting and communicating with Vault+
npm install @serv-official/vault-sdk
Next we check whether or not the user currently has Vault+ installed if they do then we try and establish a connection and read the account's public blockchain address.
import Serv from "@serv-official/vault-sdk";
const [isReady, setIsReady] = useState();
useEffect(() => {
connectVault();
}, []);
const connectVault = async () => {
const isReady = await Serv.isReady();
if (!isReady) {
downloadVault();
} else {
throw new Error(
"Please install the Vault+ extension to use this awesome dApp!"
);
}
const Vault = await Serv.connectVault();
if (!Vault) {
throw new Error("Vault+ not connected.");
}
if (Vault.address.length > 0) {
// Application logic starts here
} else {
throw new Error("Did not receive public key.");
}
};
Now that your dApp is connected to Vault+ you can add any of the more complex code examples or Vault+ and Blockchain SDK functions to your dApp.
After connecting to Vault+ feel free to call any of the functions listed in the Vault+ SDK documentation to create whatever flow is necessary for your dApp.
Last modified 8mo ago