- Uso Independiente
- Con Connect SDK
Si desea usar este paquete sin @0xsequence/connect, puede hacerlo siguiendo los pasos a continuación.
1
Instale las librerías requeridas
npm install @0xsequence/hooks @tanstack/react-query wagmi
# or
pnpm install @0xsequence/hooks @tanstack/react-query wagmi
# or
yarn add @0xsequence/hooks @tanstack/react-query wagmi
2
Obtenga una clave de acceso para su proyecto
Obtenga la clave de acceso de su proyecto desde el Sequence Builder.
3
Envuelva su aplicación con los proveedores requeridos
[config.ts]
import { mainnet, polygon } from "wagmi/chains"
import { createConfig, http } from "wagmi"
import { QueryClient } from "@tanstack/react-query"
const wagmiConfig = createConfig({
chains: [mainnet, polygon],
transports: {
[mainnet.id]: http('https://mainnet.example.com'),
[polygon.id]: http('https://polygon.example.com'),
},
})
const queryClient = new QueryClient()
export { wagmiConfig, queryClient }
[main.tsx]
import React from "react";
import ReactDOM from "react-dom/client";
import "./index.css";
import App from "./App";
import { SequenceHooksProvider } from "@0xsequence/hooks";
import { WagmiProvider } from "wagmi";
import { queryClient, wagmiConfig } from "./config";
import { QueryClientProvider } from "@tanstack/react-query";
function Dapp() {
return (
<WagmiProvider config={wagmiConfig}>
<QueryClientProvider client={queryClient}>
<SequenceHooksProvider config={{ projectAccessKey: "AQAAAAAAAJbd_5JOcE50AqglZCtvu51YlGI" }}>
<App />
</SequenceHooksProvider>
</QueryClientProvider>
</WagmiProvider>
);
}
ReactDOM.createRoot(document.getElementById("root")!).render(
<React.StrictMode>
<Dapp />
</React.StrictMode>
);
export default Dapp;
4
Comience a usarlo
Ahora puede comenzar a usar hooks como useGetCoinPrices.
Si desea usar este paquete con @0xsequence/connect, puede hacerlo siguiendo los pasos a continuación.
1
Instale y configure Connect SDK
Siga los pasos aquí.
2
Instale Hooks SDK
npm install @0xsequence/hooks
# or
pnpm install @0xsequence/hooks
# or
yarn add @0xsequence/hooks
3
Envuelva su aplicación con el SequenceHooksProvider
[main.tsx]
import React from "react";
import ReactDOM from "react-dom/client";
import "./index.css";
import App from "./App";
import { config } from "./config";
import { SequenceConnect } from "@0xsequence/connect";
import { SequenceHooksProvider } from "@0xsequence/hooks";
function Dapp() {
return (
<SequenceConnect config={config}>
<SequenceHooksProvider config={config.connectConfig}>
<App />
</SequenceHooksProvider>
</SequenceConnect>
);
}
ReactDOM.createRoot(document.getElementById("root")!).render(
<React.StrictMode>
<Dapp />
</React.StrictMode>
);
export default Dapp;
4
Comience a usarlo
Ahora puede comenzar a usar hooks como useGetCoinPrices.