Skip to main content



This guide goes through the process of integrating MetaMask into your dApp so that users of your dApp can click on a Connect to Neon button and be prompted to connect to your dApp via MetaMask in an intuitive and accessible manner.

This guide assumes proficiency in JavaScript.

Full JavaScript code

This code is also available on CodeSandbox.

import detectEthereumProvider from "@metamask/detect-provider";

const configure = async () => {
const provider = await detectEthereumProvider({ mustBeMetaMask: true });
if (provider) {
try {
await provider.request({ method: "eth_requestAccounts" });
await provider.request({
method: "wallet_addEthereumChain",
params: [
chainId: "0x" + (245022934).toString(16),
chainName: "Neon Mainnet",
nativeCurrency: {
name: "NEON",
symbol: "NEON",
decimals: 18
rpcUrls: [""],
blockExplorerUrls: [""]
} catch (e) {
console.error("configure provider error", e);
} else {
alert("Please install MetaMask");

export default function App() {
return (
<div className="App">
<button onClick={configure}>Connect</button>
Was this page helpful?