Merge pull request #23 from Ramyromel/learn-tanstack-query

Learn how to use TanStack Query with React

docs/react/api/WagmiProvider.md

@@ -110,3 +110,29 @@ function App() {
 ```ts
 import { type WagmiContext } from 'wagmi'
 ```
+
+## Setting up the WagmiProvider
+
+To set up the `WagmiProvider` with the appropriate configuration, follow these steps:
+
+1. Import the `WagmiProvider` from the `wagmi` package.
+2. Create a configuration object using the `createConfig` function from the `wagmi` package.
+3. Wrap your application in the `WagmiProvider` and pass the configuration object as a prop.
+
+```tsx
+import { WagmiProvider, createConfig } from 'wagmi'
+
+const config = createConfig({
+  // Your configuration options here
+})
+
+function App() {
+  return (
+    <WagmiProvider config={config}>
+      {/** ... */}
+    </WagmiProvider>
+  )
+}
+```
+
+For more details on creating the configuration object, refer to the documentation in `docs/react/api/createConfig.md`.

docs/react/guides/error-handling.md

@@ -31,3 +31,9 @@ function App() {
 ```
 <<< @/snippets/react/config.ts[config.ts]
 :::
+
+Refer to the specific hook documentation for detailed usage and error handling examples. For instance, the `useBlockNumber` hook documentation in `docs/react/api/hooks/useBlockNumber.md` provides an example of how to handle errors using the `error` property.
+
+Ensure that you have set up the Wagmi configuration and wrapped your application in the `WagmiProvider` as shown in `docs/react/api/WagmiProvider.md`. This ensures that the context is properly set up for error handling and other functionalities.
+
+Utilize TanStack Query features like query invalidation, prefetching, and SSR as described in the `docs/react/guides/tanstack-query.md` to enhance your application's data fetching and caching capabilities, which can help in handling errors more effectively.