Getting Started with Mesh and React

Install Mesh React

Mesh provide a collection of useful UI components, so you can easily include web3 functionality and convenient utilities for your application.

To start, install mesh-react:

npm install @meshsdk/react

Next, let's add MeshProvider to the root of the application.

Setup MeshProvider

React Context allows apps to share data across the app, and MeshProvider allows your app to subscribe to context changes. If you use the CLI to initialize your project, MeshProvider has been added in the root component. Otherwise, you can wrap MeshProvider at the root of your application, for example in Next.js:

import { MeshProvider } from "@meshsdk/react";

function MyApp({ Component, pageProps }: AppProps) {
  return (
    <MeshProvider>
      <Component {...pageProps} />
    </MeshProvider>
  );
};

Now your application is ready, explore the available UI components and wallet hooks and start using them in your application.