从 Web2 起点探索 Coinbase API
对从哪里开始使用 Web3 感到困惑?开始使用 Coinbase 开发者工具
Image from 关注
1977年,我心中那个有抱负的音乐家在看了电影《星球大战》后想学钢琴。我的目标是学习如何演奏每个人都在谈论的电影的主题,所以我买了乐谱。我们家里有一架钢琴,是我祖父母送给我们的礼物。
当我看到页面上的所有注释时,10岁版本的我很快就不知所措了:
我想我可以从更简单的开始,所以我开始在钢琴凳上筛选文件。然后我发现了这个很酷的音符图表模板,它非常适合钢琴的琴键。我找不到完全匹配的,但是 这里 是一个例子:
这对我来说改变了游戏规则。我把所有其他的音乐都扔回钢琴凳上,开始工作,学习如何演奏《星球大战》。在很短的时间内,我学会了在没有一节课的情况下演奏那首歌(和钢琴)。
这让我想知道为什么这样的“模板”并不存在于生活的各个方面。
新技术的 Catch-22
新的语言、平台、框架和设计模式都有一个共同的要求——开发人员的接受和采用。大多数情况下,大多数人都有另一个共同挑战:比预期更陡峭的学习曲线。
对我来说,Web3 目前处于这种状态,尽管我已经在我的“ 从全栈开发人员转变为 Web3 先锋 “ 出版物。
前沿开发人员已经在使用 Web3 做伟大的事情。但是接下来的一百万开发者——比如我——想要开始而不感到不知所措和沮丧呢?我们如何找到一种方法让他们使用 Web3?
我想找到一个用于 Web3 开发的帮助模板,我在开始探索 Coinbase SDK .
Coinbase SDK/API
根据维基百科, 币库 是一家美国上市公司,自 2012 年 6 月起运营加密货币交易平台。与我所写的类似 马基塔 , Coinbase 提供了一系列应用程序编程接口 (API) 和软件开发工具包 (SDK),供有兴趣构建专注于数字货币的应用程序的开发人员使用。
一个这样的例子是 Coinbase 钱包 SDK .
对于本出版物,我想完成以下任务:
- 使用 React 创建一个简单的 Web3 应用程序
- 将我的钱包浏览器扩展与 Dapp 集成
- 允许用户使用 Coinbase 钱包 SDK 进行捐赠
使用 Coinbase 钱包 SDK 创建 Web3 应用程序
首先,我们可以使用 React CLI 创建一个名为 coinbase-wallet-example 的 React 应用程序:
npx create-react-app coinbase-wallet-example
创建 React 应用程序后,我使用以下命令更改为 coinbase-wallet-example 目录:
cd coinbase-wallet-example
由于较新版本的 create-react-app 不再包含 polyfill 支持——这是使用的必要要求 web3.js
正确 - 这需要旧版本的 react-scripts:
npm install --save-exact [[email protected]](/cdn-cgi/l/email-protection)
由于我们将构建一个 Web3 示例,因此使用 npm 安装了 web3 框架(可以找到其他选项 这里 ):
npm 安装 web3
接下来,使用 npm 安装 Coinbase Wallet SDK(其他选项可以找到 这里 ):
npm install @coinbase/wallet-sdk
使用 胖的 区块链开发套件,我创建了一个名为 coinbase 钱包示例
:
接下来,我切换到 Ropsten 测试网络并记下项目的密钥和 URL:
现在,我们只需要包含以下代码来初始化 Coinbase 钱包 SDK 和 Web3 对象:
从'导入 CoinbaseWalletSDK[ @coinbase/wallet-sdk](https://twitter.com/coinbase/wallet-sdk) '
从“web3”导入 Web3; const APP_NAME = 'coinbase-wallet-example';
常量 APP_LOGO_URL = './coinbase-logo.png';
常量 DEFAULT_ETH_JSONRPC_URL = '[ https://ropsten.infura.io/v3/56f](https://ropsten.infura.io/v3/56f) ... d69';
常量 DEFAULT_CHAIN_ID = 3; // 1=以太坊(主网),3=Ropsten,5=Gorli
在 - 的里面 使用效果()
在我的应用程序的方法中,我包含了初始化 Coinbase 钱包和 Web3 的必要代码:
const coinbaseWallet = new CoinbaseWalletSDK({
应用名称:APP_NAME,
appLogoUrl:APP_LOGO_URL,
}); 常量 walletSDKProvider = coinbaseWallet.makeWeb3Provider(
DEFAULT_ETH_JSONRPC_URL,
DEFAULT_CHAIN_ID
); const web3 = new Web3(walletSDKProvider);
对于这个非常简单的示例,我们不会利用智能合约,而是提供一个目标地址来发送捐款:
const DONATION_ADDRESS = '0x7 ... c94';
为了降低风险,将更新代码以设置 捐赠地址
到正在使用的钱包的连接地址。
DONATION_ADDRESS = 帐户;
这意味着代码将向发送者发送资金,只留下从用户钱包中提取的汽油费。 React Dapp 将允许用户连接他们的钱包,然后提供捐赠金额(使用 WEI 单位),然后按下捐赠按钮将资金发送到 捐赠地址
.
这个简单 Dapp 的完整源代码如下所示:
运行基于 React 的 Dapp 就像使用以下命令一样简单:
npm 开始
结论
自 2021 年以来,我一直在努力遵循以下使命宣言,我认为它适用于任何 IT 专业人士:
“将时间集中在提供扩展知识产权价值的特性/功能上。将框架、产品和服务用于其他一切。”
— J.维斯特
我在介绍中引用的笔记图表模板被证明是我生命中的一个关键点。这颗隐藏在我们钢琴长凳上的宝石不仅让我能够演奏《星球大战》主题曲,还提升了我演奏音乐的能力。这个简单的模板和学习的愿望最终为我进入 伯克利音乐学院 以及参与多部音乐作品的能力。
Coinbase API 和 SDK(或开发人员工具)为渴望在新兴 Web3 世界中起步的开发人员提供了类似的目的。开发人员可以将这些模块包含到他们的应用程序中并快速开始,而不会陷入细节中。
在这两种情况下,笔记图表模板和 Coinbase 开发人员工具都遵循我的使命宣言,允许个人继续专注于他们的主要目标——无论是第一次学习弹钢琴,还是使用 Web3 做一些很酷的事情。
如果您对本出版物的源代码感兴趣,可以在 GitLab 上的以下地址找到它:
[
John Vester / coinbase-wallet-example · GitLab
coinbase-wallet-example 存储库是基于 React 和 web3 构建的简单 web3 Dapp 示例,以说明它是多么容易......
gitlab.com
](https://gitlab.com/johnjvester/coinbase-wallet-example)
有一个非常棒的一天!
版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明
本文链接:https://www.qanswer.top/38412/46032111
标签:wallet,Web3,开发人员,Web2,coinbase,API,Coinbase,SDK From: https://www.cnblogs.com/amboke/p/16715089.html