Skip to content
Merged
Show file tree
Hide file tree
Changes from 4 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion src/components/NavDropdown/Products.html
Original file line number Diff line number Diff line change
Expand Up @@ -108,7 +108,7 @@ <h2>Extend and scale</h2>
</svg>
</span>
<div>
<h2>Metamask SDK</h2>
<h2>MetaMask SDK</h2>
<p>Seamlessly connect your dapp to MetaMask extension and mobile.</p>
</div>
</a>
Expand Down
2 changes: 1 addition & 1 deletion src/pages/quickstart/builder/choices.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ export const METAMASK_SDK = 'METAMASK_SDK'

// Product choices
export const PRODUCTS: DisplayChoice[] = [
{ key: METAMASK_SDK, displayName: 'Metamask SDK' },
{ key: METAMASK_SDK, displayName: 'MetaMask SDK' },
{ key: EMBEDDED_WALLETS, displayName: 'Embedded Wallets' },
]

Expand Down
Original file line number Diff line number Diff line change
@@ -1,7 +1,9 @@
### Connect and use provider
### Connect and use the provider

Connect to MetaMask and get the provider for RPC requests.

`MMSDK.connect()` handles cross-platform connection (desktop and mobile), including deeplinking.

Use `provider.request()` for arbitrary [JSON-RPC requests](/wallet/reference/json-rpc-methods) like `eth_chainId` or `eth_getBalance`, or for [batching requests](../guides/batch-requests.md) via `metamask_batch`.
Use `provider.request()` for arbitrary [JSON-RPC requests](/wallet/reference/json-rpc-methods) like
`eth_chainId` or `eth_getBalance`, or for [batching requests](/sdk/guides/batch-requests) via
`metamask_batch`.
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
### Initialize the MetaMask SDK
### Initialize MetaMask SDK

The MetaMask SDK can be initialized with the following options:
Initialize MetaMask SDK with these options:

- `dappMetadata` - Ensures trust by showing your dapp's name, url, and iconUrl during connection.
- `infuraAPIKey` - Enables read-only RPC and load‑balancing.
- `dappMetadata` - Displays your dapp's name, URL, and icon URL during connection.
- `infuraAPIKey` - Enables the read-only RPC and load‑balancing.
Original file line number Diff line number Diff line change
Expand Up @@ -6,4 +6,4 @@ Install the MetaMask SDK package in your React project.
npm install --save @metamask/sdk
```

[![Npm package monthly downloads](https://badgen.net/npm/dm/@metamask/sdk)](https://www.npmjs.com/package/@metamask/sdk) [![](https://data.jsdelivr.com/v1/package/npm/@metamask/sdk/badge)](https://www.jsdelivr.com/package/npm/@metamask/sdk)
[![npm package monthly downloads](https://badgen.net/npm/dm/@metamask/sdk)](https://www.npmjs.com/package/@metamask/sdk) [![](https://data.jsdelivr.com/v1/package/npm/@metamask/sdk/badge)](https://www.jsdelivr.com/package/npm/@metamask/sdk)
Original file line number Diff line number Diff line change
@@ -1,8 +1,9 @@
### MetaMask SDK - React Quickstart
### MetaMask SDK - React quickstart

Seamlessly connect to MetaMask Wallet using the MetaMask SDK in your React application.
This quickstart shows you how to connect a React application to the MetaMask wallet using
MetaMask SDK.

Start by cloning the React Quickstart application.
Clone the React quickstart application.

```shell
npx degit MetaMask/metamask-sdk-examples/quickstarts/react mm-react-quickstart
Expand Down
Original file line number Diff line number Diff line change
@@ -1,3 +1,3 @@
### Disconnect from MetaMask Wallet
### Disconnect from MetaMask

Use the `MMSDK.terminate()` method to disconnect from MetaMask.
16 changes: 16 additions & 0 deletions src/pages/quickstart/styles.module.css
Original file line number Diff line number Diff line change
@@ -1,3 +1,19 @@
.stepBody a {
color: var(--ifm-link-color);
font-weight: 500;
text-decoration: underline;
text-decoration-color: var(--ifm-link-color);
text-decoration-thickness: .1rem;
text-underline-offset: .4rem;
transition: color var(--ifm-transition-fast) var(--ifm-transition-timing-default);
}
.stepBody a:hover,
.stepBody a:focus {
color: var(--ifm-link-hover-color);
text-decoration: underline;
text-decoration-color: var(--ifm-link-hover-color);
}

.container {
width: 100%;
height: 100%;
Expand Down
Loading