Skip to content

Commit c114f7e

Browse files
alexandratranalexandratran
authored
SDK section improvements (#2064)
* Update SDK connect guides * add get started button * updates to sdk intro + redirects * address feedback * move llm prompt and update copy
1 parent d971941 commit c114f7e

22 files changed

+174
-131
lines changed

‎sdk-sidebar.js‎

Lines changed: 13 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -4,33 +4,21 @@
44
const sidebar = {
55
sdkSidebar: [
66
{
7-
type: 'category',
7+
type: 'doc',
88
label: 'Introduction',
9-
collapsible: false,
10-
collapsed: false,
11-
items: [
12-
'introduction/welcome',
13-
'introduction/supported-platforms',
14-
'introduction/supported-networks',
15-
'introduction/llm-prompt',
16-
{
17-
type: 'link',
18-
label: 'Try demo dapp',
19-
href: 'https://metamask-sdk-examples.vercel.app/',
20-
},
21-
],
9+
id: "index",
2210
},
2311
{
2412
type: 'category',
25-
label: 'Quickstart',
13+
label: 'Connect to MetaMask',
2614
collapsible: false,
2715
collapsed: false,
2816
items: [
29-
'quickstart/javascript-wagmi',
30-
'quickstart/javascript',
31-
'quickstart/javascript-dynamic',
32-
'quickstart/javascript-web3auth',
33-
'quickstart/react-native',
17+
'connect/javascript-wagmi',
18+
'connect/javascript',
19+
'connect/javascript-dynamic',
20+
'connect/javascript-web3auth',
21+
'connect/react-native',
3422
],
3523
},
3624
{
@@ -69,7 +57,11 @@ const sidebar = {
6957
label: 'Reference',
7058
collapsible: false,
7159
collapsed: false,
72-
items: ['reference/sdk-options'],
60+
items: [
61+
'reference/llm-prompt',
62+
'reference/supported-platforms',
63+
'reference/sdk-options',
64+
],
7365
},
7466
],
7567
}

sdk/quickstart/javascript-dynamic.md renamed to sdk/connect/javascript-dynamic.md

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,11 @@
11
---
2-
sidebar_label: Dynamic SDK integration
2+
sidebar_label: Dynamic SDK
33
description: Quickstart guide for using MetaMask SDK and Dynamic SDK.
44
toc_max_heading_level: 2
5+
keywords: [connect, MetaMask, Dynamic, SDK, dapp]
56
---
67

7-
# MetaMask SDK + Dynamic SDK integration
8+
# Connect to MetaMask using Dynamic SDK
89

910
Get started with MetaMask SDK and [Dynamic SDK](https://docs.dynamic.xyz/introduction/welcome).
1011
You can set up the SDKs in the following ways:
@@ -19,7 +20,7 @@ You can set up the SDKs in the following ways:
1920

2021
Features include:
2122

22-
- **MetaMask SDK built into Dynamic** - Use MetaMask SDK features directly within the Dynamic SDK.
23+
- **MetaMask SDK built into Dynamic** - Use MetaMask SDK features directly within Dynamic SDK.
2324
- **Wallet connection** - Connect to MetaMask wallet with enhanced features.
2425
- **Mobile experience** - Optimized for both desktop and mobile users.
2526
- **TypeScript support** - Full type safety and modern development experience.

sdk/quickstart/javascript-wagmi.md renamed to sdk/connect/javascript-wagmi.md

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,11 @@
11
---
22
description: Quickstart guide for using the SDK with a JavaScript and Wagmi dapp.
33
toc_max_heading_level: 2
4+
sidebar_label: JavaScript + Wagmi (recommended)
5+
keywords: [connect, MetaMask, JavaScript, Wagmi, SDK, dapp]
46
---
57

6-
# JavaScript + Wagmi (recommended)
8+
# Connect to MetaMask using JavaScript + Wagmi
79

810
Get started with MetaMask SDK in a JavaScript and Wagmi dapp.
911
You can set up the SDK in the following ways:

sdk/quickstart/javascript-web3auth.md renamed to sdk/connect/javascript-web3auth.md

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,11 @@
11
---
2-
sidebar_label: Web3Auth SDK integration
2+
sidebar_label: Web3Auth SDK
33
description: Quickstart guide for using MetaMask SDK and Web3Auth SDK.
44
toc_max_heading_level: 2
5+
keywords: [connect, MetaMask, Web3Auth, SDK, dapp]
56
---
67

7-
# MetaMask SDK + Web3Auth SDK integration
8+
# Connect to MetaMask using Web3Auth SDK
89

910
Get started with MetaMask SDK and [Web3Auth SDK](https://web3auth.io/docs/).
1011
You can set up the SDKs in the following ways:
@@ -18,7 +19,7 @@ You can set up the SDKs in the following ways:
1819

1920
Features include:
2021

21-
- **MetaMask SDK built into Web3Auth** - Use MetaMask SDK features directly within the Web3Auth SDK.
22+
- **MetaMask SDK built into Web3Auth** - Use MetaMask SDK features directly within Web3Auth SDK.
2223
- **Web3Auth social login** - Enable users to sign in with an email or social media account.
2324
- **Wallet connection** - Connect to MetaMask wallet with enhanced features.
2425
- **Mobile experience** - Optimized for both desktop and mobile users.

sdk/quickstart/javascript.md renamed to sdk/connect/javascript.md

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,13 @@
11
---
22
description: Quickstart guide for using the SDK with a JavaScript dapp.
3+
sidebar_label: JavaScript
4+
keywords: [connect, MetaMask, JavaScript, SDK, dapp]
35
---
46

57
import Tabs from "@theme/Tabs";
68
import TabItem from "@theme/TabItem";
79

8-
# JavaScript
10+
# Connect to MetaMask using JavaScript
911

1012
Get started with MetaMask SDK in your JavaScript dapp.
1113

sdk/quickstart/react-native.md renamed to sdk/connect/react-native.md

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,13 @@
11
---
22
description: Quickstart guide for using the SDK with a React Native dapp.
3+
sidebar_label: React Native
4+
keywords: [connect, MetaMask, React, Native, SDK, dapp]
35
---
46

57
import Tabs from "@theme/Tabs";
68
import TabItem from "@theme/TabItem";
79

8-
# React Native
10+
# Connect to MetaMask using React Native
911

1012
Get started with MetaMask SDK in your React Native or Expo dapp.
1113

‎sdk/index.md‎

Lines changed: 84 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,84 @@
1+
---
2+
slug: /
3+
description: Introduction page for MetaMask SDK documentation.
4+
keywords: [connect, MetaMask, SDK, integrate, dapp]
5+
---
6+
7+
import Button from '@site/src/components/elements/buttons/button'
8+
import CardList from '@site/src/components/CardList'
9+
10+
# Seamlessly connect to MetaMask using the SDK
11+
12+
MetaMask SDK enables a fast, reliable, and seamless connection from your dapp to the MetaMask extension and MetaMask Mobile.
13+
With the SDK, you can easily onboard users and interact with their accounts on desktop or mobile, across all EVM networks.
14+
15+
<p align="center">
16+
<Button
17+
as="a"
18+
href="connect/javascript-wagmi"
19+
label="Get started with the SDK"
20+
icon="arrow-right"
21+
style={{
22+
'--button-color-hover': 'var(--general-black)',
23+
'--button-text-color-hover': 'var(--general-white)',
24+
}}
25+
/>
26+
</p>
27+
28+
## Why use the SDK?
29+
30+
MetaMask SDK gives your dapp a powerful upgrade:
31+
32+
- **Cross-platform, cross-browser support** - One integration covers both desktop and mobile, all major browsers, and the MetaMask Mobile app—streamlining your user onboarding and eliminating edge cases.
33+
- **Mobile connection that just works** - Say goodbye to clunky "open in in-app browser" flows.
34+
The SDK enables a native connection from any mobile browser (Safari, Chrome, etc.) directly to MetaMask Mobile, using secure deeplinking and session management.
35+
- **Production-ready, battle-tested** - MetaMask SDK is used in high-volume dapps across DeFi, NFTs, gaming, and more—ensuring stability, speed, and a smooth developer experience.
36+
- **Multichain-ready by design** - Today, the SDK supports all EVM networks.
37+
Coming soon: Seamless connection to non-EVM chains like Solana and Bitcoin.
38+
Futureproof your dapp with a single integration.
39+
40+
## Supported platforms and libraries
41+
42+
MetaMask SDK is available in a variety of ways to make integration as easy as possible.
43+
You can access it directly via npm, through popular developer libraries like Wagmi, or as part of popular convenience libraries.
44+
45+
<CardList
46+
items={[
47+
{
48+
href: 'connect/javascript-wagmi',
49+
title: 'JavaScript + Wagmi (recommended)',
50+
description: 'Use the CLI or template to set up the SDK in a Next.js and Wagmi dapp.',
51+
},
52+
{
53+
href: 'connect/javascript',
54+
title: 'JavaScript',
55+
description: 'Set up the SDK in a JavaScript dapp.',
56+
},
57+
{
58+
href: 'connect/javascript-dynamic',
59+
title: 'Dynamic SDK',
60+
description: 'Use the CLI or template to set up Dynamic SDK in a Next.js dapp. Use MetaMask SDK features with Dynamic.',
61+
},
62+
{
63+
href: 'connect/javascript-web3auth',
64+
title: 'Web3Auth SDK',
65+
description: 'Use the CLI or template to set up Web3Auth SDK in a Next.js dapp. Use MetaMask SDK features with Web3Auth.',
66+
},
67+
{
68+
href: 'connect/react-native',
69+
title: 'React Native',
70+
description: 'Set up the SDK in a React Native or Expo dapp.',
71+
},
72+
{
73+
href: 'https://onboard.blocknative.com',
74+
title: 'Web3-Onboard',
75+
description: 'Use SDK features with Web3-Onboard.',
76+
buttonIcon: 'external-arrow',
77+
}
78+
]}
79+
/>
80+
81+
:::tip Build embedded wallet experiences that work seamlessly with MetaMask
82+
Introducing our latest [Embedded Wallets SDK](connect/javascript-web3auth.md) (Web3Auth), you can now onboard users
83+
instantly and design seamless onchain experiences with social logins, passkeys and more.
84+
:::

‎sdk/introduction/supported-networks.md‎

Lines changed: 0 additions & 27 deletions
This file was deleted.

‎sdk/introduction/welcome.md‎

Lines changed: 0 additions & 43 deletions
This file was deleted.

sdk/introduction/llm-prompt.md renamed to sdk/reference/llm-prompt.md

File renamed without changes.

0 commit comments

Comments
 (0)