<p>Good question, this is one that many people are curious about as the only real way to interact with the Cardano blockchain is through cardano-node, but obviously a dApp user visiting a website isn't going to run their own node to submit transactions and interact with smart contracts themselves.</p>
<p>In my view, Yoroi looks <em>best positioned</em> at the moment to become the MetaMask of Cardano but as always, look into things for yourself and determine the best solution for your particular use-case.</p>
<p><a href="https://www.emurgo.io/blog/emurgo-launches-beta-version-of-yoroi-wallet-dapp-connector" rel="nofollow noreferrer">https://www.emurgo.io/blog/emurgo-launches-beta-version-of-yoroi-wallet-dapp-connector</a></p>
<p>As you can see dApp Browser integration is slated for sometime 2021, I think this is the direction you should look. Also worthy of looking into is the ATALA Prism which also seeks to provide DIDs (Digital Identities) on the cardano blockchain and I'm assuming will at some point try and provide some dApp connector solution for the browser.</p>

CC BY-SA 4.0
2021-06-27T21:44:58.883Z
2021-06-27T21:44:58.883Z
intrinsic-values
<p>I guess after 1 year, this deserves a more up-to date answer. There are two ways you can integrate with a browser wallet, you can take a server-based approach and a client-based one.</p>
<h2>Server Constructed Transaction</h2>
The First way is to have a back-end that will create the transaction and send the CBOR result to the front-end so the wallet can sign it and send it back to be submitted.
<p>This is what you would do with the PAB, for example, and it's what DJED is using in their testnet. The problem is that if a lot of users are requesting a transaction at the same time, it will overload your back-end.</p>
<p>Other than the PAB you can use basically any tool that supports creating a cardano transaction. For me, pycardano has been really useful since I am more familiar with Python than Haskell and the PAB is just not very well documented right now in my opinion. You can see an example <a href="https://github.com/cffls/pycardano/tree/f5e03ccd7acf79eabff10baf01c54e184ca7423d/examples/full_stack" rel="noreferrer">here</a>.</p>
<h2>Client Constructed Transaction</h2>
The second way would be to do everything in the client-side. So you would build the transaction, sign and submit from the user browser. The drawback here is that the front-end application get's a little bit more heavy and there is not a great support for plutus and smart contracts with the current tools.
<p>The most used tool right now is the cardano-serialization-lib and you can see an example of a transaction being fully built on the client side <a href="https://github.com/Berry-Pool/spacebudz/blob/main/src/cardano/market/index.js" rel="noreferrer">here</a>.</p>
<p>As I said, it doesn't offer great support for plutus right now (if any) and you would need to use a custom module for doing most of the things (like in the example I mentioned). There are some other tools, though, that could be more useful depending on the case: <a href="https://github.com/dcSpark/cardano-multiplatform-lib" rel="noreferrer">cardano-multiplatform-lib</a> from dcspark and <a href="https://github.com/Berry-Pool/lucid" rel="noreferrer">lucid</a> from alessandro are the ones that come to my mind.</p>

CC BY-SA 4.0
2022-05-06T12:22:00.010Z
2022-05-06T12:22:00.010Z
Mateus
<p>I'm familiar with using the Plutus Playground and Plutus TraceEmulator library to configure the wallet actions for the endpoints of a smart contract.  These simulators are great for testing the smart contract interactions.</p>
<p>I'd like to understand how a real-world DApp would integrate with user wallets. If the DApp front-end is a web-app running in the browser, would the app require users to set up something like a MetaMask plugin to link their wallets and give permission to the DApp to submit operations from their wallet?  Is there another way to let user grant access to a wallet node?  In general, how does the DApp front-end get access to user wallets and will the DApp front-end need to be deployed on the same machine as the wallet is running?</p>

CC BY-SA 4.0
2021-10-25T07:19:44.170Z
If you've found an answer to this, please post it. I'll be looking into it too soon.
marcel_g
CC BY-SA 4.0
2021-10-31T09:05:05.463Z
@marcel_g, no, not yet.  I'd like to build a simple example of using a wallet connector, but have some server-side exploration work planned next. Pls let me know, what wallet connectors you try and how it goes.
Kurt Hartmann
<decentralized-applications>
How does DApp front-end integrate with user wallets?
# How does DApp front-end integrate with user wallets?

(Asked by: username_0 on 2021-06-27)

I'm familiar with using the Plutus Playground and Plutus TraceEmulator library to configure the wallet actions for the endpoints of a smart contract. These simulators are great for testing the smart contract interactions.

I'd like to understand how a real-world DApp would integrate with user wallets. If the DApp front-end is a web-app running in the browser, would the app require users to set up something like a MetaMask plugin to link their wallets and give permission to the DApp to submit operations from their wallet? Is there another way to let user grant access to a wallet node? In general, how does the DApp front-end get access to user wallets and will the DApp front-end need to be deployed on the same machine as the wallet is running?

**Tags:** decentralized-applications
> **Comments:**
> **username_1**: If you've found an answer to this, please post it. I'll be looking into it too soon.  
> **username_0**: @marcel_g, no, not yet.  I'd like to build a simple example of using a wallet connector, but have some server-side exploration work planned next. Pls let me know, what wallet connectors you try and how it goes.  

---

## 2 answers

### Answer by username_2 on 2021-06-27. Score: 4 | Accepted answer

Good question, this is one that many people are curious about as the only real way to interact with the Cardano blockchain is through cardano-node, but obviously a dApp user visiting a website isn't going to run their own node to submit transactions and interact with smart contracts themselves.

In my view, Yoroi looks *best positioned* at the moment to become the MetaMask of Cardano but as always, look into things for yourself and determine the best solution for your particular use-case.

<https://www.emurgo.io/blog/emurgo-launches-beta-version-of-yoroi-wallet-dapp-connector>

As you can see dApp Browser integration is slated for sometime 2021, I think this is the direction you should look. Also worthy of looking into is the ATALA Prism which also seeks to provide DIDs (Digital Identities) on the cardano blockchain and I'm assuming will at some point try and provide some dApp connector solution for the browser.


---

### Answer by username_3 on 2022-05-06. Score: 6

I guess after 1 year, this deserves a more up-to date answer. There are two ways you can integrate with a browser wallet, you can take a server-based approach and a client-based one.

## Server Constructed Transaction

The First way is to have a back-end that will create the transaction and send the CBOR result to the front-end so the wallet can sign it and send it back to be submitted.

This is what you would do with the PAB, for example, and it's what DJED is using in their testnet. The problem is that if a lot of users are requesting a transaction at the same time, it will overload your back-end.

Other than the PAB you can use basically any tool that supports creating a cardano transaction. For me, pycardano has been really useful since I am more familiar with Python than Haskell and the PAB is just not very well documented right now in my opinion. You can see an example [here](https://github.com/cffls/pycardano/tree/f5e03ccd7acf79eabff10baf01c54e184ca7423d/examples/full_stack).

## Client Constructed Transaction

The second way would be to do everything in the client-side. So you would build the transaction, sign and submit from the user browser. The drawback here is that the front-end application get's a little bit more heavy and there is not a great support for plutus and smart contracts with the current tools.

The most used tool right now is the cardano-serialization-lib and you can see an example of a transaction being fully built on the client side [here](https://github.com/Berry-Pool/spacebudz/blob/main/src/cardano/market/index.js).

As I said, it doesn't offer great support for plutus right now (if any) and you would need to use a custom module for doing most of the things (like in the example I mentioned). There are some other tools, though, that could be more useful depending on the case: [cardano-multiplatform-lib](https://github.com/dcSpark/cardano-multiplatform-lib) from dcspark and [lucid](https://github.com/Berry-Pool/lucid) from alessandro are the ones that come to my mind.


---

