狗哥区块链与AI精品内容集@NonceGeek

2025年03月28日更新 75 人订阅
原价: ¥ 20 限时优惠
专栏简介 「造」最关键的是什么?| Hackathon 漫游指南(贰) Why Hackathon?| Hackathon 漫游指南(壹) 设计「众人维护」的 BuidlerBoard | BeWater.xyz Movement 白皮书中文版 Rebuidl RSS 生产因素与反生产因素 | 独立黑客创业手册(陆) 组织 | 独立黑客创业手册(伍) 生产 | 独立黑客创业手册(肆) 销售 | 独立黑客创业手册(叄) 最优先的能力 | 独立黑客创业手册(贰) 为什么从独立黑客开始 | 独立黑客创业手册(壹) Aptos Token Object V2 | Move dApp 极速入门(贰拾肆) 可編程交易塊 | Move dApp 極速入門(貳拾叁) Aptos 密鑰輪換 | Move dApp 極速入門(貳拾貳) Aptos 对象模型 | Move dApp 极速入门(贰拾壹) Aptos Moveflow SDK使用指南 | Move dApp 极速入门(贰拾) Sui 上简单 Swap 的实现 | Move dApp 极速入门(拾玖) 用 Elixir 交互 Aptos | Move dApp 极速入门(拾捌) Sui 链上数据查询 | Move dApp 极速入门(拾柒) SUI 合约测试攻略 | Move dApp 极速入门(拾陆) Sui 数据类型详解 | Move dApp 极速入门(拾伍) Airdropper Contract in Aptos | Move dApp 极速入门(拾肆) Sandwich合约源码解析 | Move dApp 极速入门(拾叁) Sui 极速上手 | Move dApp 极速入门(拾贰) scaffold-aptos 脚手架 | Move dApp 极速入门(拾壹) 对 DID Document 的思考 | Move dApp 极速入门(九) DID中地址聚合器的实现 | Move dApp 极速入门(八) 值的存取应用3.0 | Web3.0 dApp 开发(五) 合约数据类型综述 | Move dApp 极速入门(四) 操作资源 | Move dApp 极速入门(三) 第一个 Move dApp | Move dApp 极速入门(二) Hello Move | Move dApp极速入门(一) Staker | Web3.0 dApp 开发(九) Token 自动售卖机 | Web3.0 dApp 开发(七) SVG NFT 全面实践 | Web3.0 dApp 开发(六) 值的存取应用2.0 | Web3.0 dApp 开发(四) 值的存取应用1.0 | Web3.0 dApp开发(三) Scaffold-eth 快速上手 | Web3.0 dApp 开发(二) eth.build 快速上手 | Web3.0 dApp 开发(一) 1 小时理解比特币系统 【NonceGeek Workshop 0x01总结】基于链上数据生成游戏地图 Remix 完全本地化部署 NFT:实体与虚拟载体的主与辅 | 狗哥的元宇宙思辨(一) Web3Camp 内容大全@NonceGeek 用 Python 创建一条 Pow 区块链(上) 区块链与共识机制演变史 基于 Etherscan 实现 Blockchain Syncer 【论文分享】去中心化社会:寻找 Web3 的灵魂(上) 【论文分享】去中心化社会:寻找 Web3 的灵魂(下) Ted Yin | 2021 年的区块链基础设施将是什么? 0. 公链、联盟链与分布式未来(全文) 基于 Infura 与 Web3py 部署调用 Hello 合约全过程 | 以太坊开发极速入门 太上中的基因设计与Binary | 函数式与区块链(一) 理解以太坊合约数据读取过程 | 函数式与区块链(二) Hello, Ink! | 用 Rust 写智能合约(一) Mapping 数据结构 | 用 Rust 写智能合约(二) 用 Rust 程序和 Webase 交互 | Rust 学习笔记(四) 用 Sqlite 存储 WeId | Rust 学习笔记(五) 链上注册WeId与错误处理 | Rust 学习笔记(六) WeId 链上创建与本地存储的完整闭环 | Rust 学习笔记(七) 以太坊上的核心开发者 Austin | 以太坊上的最佳开发实践 1. FISCO BCOS 开发环境节点搭建全攻略 伪代码简述 ECDSA 签名过程 | 联盟链开发 WeIdentity 源码分析 | 狗哥解码 WeIdentity 源码分析 | 狗哥解码 FISCO BCOS 介绍 | 联盟链开发 给Remix升个级 | 联盟链开发 2. 控制台的安装与使用 3. 【实验】补全一个区块链应用 4. 控制台的Web化 5. Web化控制台2.0:打造团队共用区块链学习平台 6. 使用脚手架快速搭建 Java DApp 【视频+文字】分布式思维 Rebuidl RSS (EN)

eth.build 快速上手 | Web3.0 dApp 开发(一)

  • 李大狗
  • 发布于 2021-09-19 15:33
  • 阅读 8180

炫·酷·神·器

Eth.build 简介

Eth.build 是一个聚焦于 Web3.0 的教育型沙盒,具备如下特性——

  • 无代码拖拽式编程
  • 完全开源
  • 可视化地直观地理解以太坊的工作方式

主页地址:

https://eth.build/

Youtube 学习频道:

https://www.youtube.com/playlist?list=PLJz1HruEnenCXH7KW7wBCEBnBLOVkiqIi

Repo 地址:

https://github.com/austintgriffith/eth.build

Eth.build 极速上手

加载现成的教学案例

点击「learn more」,会弹出很多现成的教学案例,可点击按钮进行加载或查看教学视频!

build_1.png

build_2.png

build_3.png

基础操作实践:以以太坊余额抓取为例

build_4.png

这是一个简单的例子,实现了从以太坊抓取余额的功能。

我们可以通过这个例子来学习eth.build的使用。

STEP 0x01. 创建 Text Block

通过INPUT>TEXT创建一个文本输入框。INPUT是输入组件的集合。

build_5.png

STEP 0x02. 创建 Balance Block

通过WEB3>BALANCE创造一个余额查询块,WEB3是一系列以太坊WEB3功能的实现,和ether.js中的实现等价。

build_6.png

观察这个Block,会发现抽象来看它由三部分组成:输入INPUTS、处理(隐藏)和输出OUTPUTS,因此,这些 Blocks,从计算机的角度可以看做是函数Functions的可视化。

STEP 0x03. 链接 Text 与 Balance

我们将 Text 的输出连上 Balance 的输入,这两个 Block 就链接起来了。

build_7.png

STEP 0x04. 输入一个地址!

随便找到一个地址,将其复制到Text中,我们会发现Balance的输入变成了数字。

build_8.png

STEP 0x05. Wei to ETH

但这是一个整数,因为这个数字的单位是wei,我们可以将其转换为ETH,所以我们再添加两个Block——

Utils>From Wei」和「DISPLAY>WATCH」。Utils 是通用组件的集合,DISPLAY 是输出组件的集合。

build_9.png

STEP 0x06. Show it to ur FRIENDS!

好了,你已经完成了你的第一个eth.build作品,你可以把它 show 给你的朋友!

build_10.png

SAVE > Share,你会获得一个网址,你可以把这个网址发给你的朋友,他打开就能见到你的作品:

build_11.png

STEP 0x07. 本地保存

也许你需要把它保存在本地,以便于之后的加载。

Save>Download」和「Load>Load From File」可以满足你的需求。

进阶玩法

无代码以太坊区块链浏览器:

https://eth.build/build#3c50b1af5fd2956e808ac4d3132a9d063b8e2f9eac3b44d3971fe83165d5d0b8

这是一个无代码版本的以太坊区块链浏览器!

通过这个例子我们可以康康eth.build有哪些进阶玩法。

build_12.png

0x01. 修改属性值

build_13.png

通过Properties的修改,我们可以给BUTTONWATCH等Block修改名称等属性值,这样就呈现更加友好。例如我会用0x01等标记上按钮的点击顺序。

build_14.png

0x02. 标题与个人二维码

通过「DISPLAY>TITLE」我们能给作品显眼地标记上自己的大名。

build_15.png

除此之外,我们还能通过TextQR的组合在作品上加上个人二维码!

build_16.png

从微信下载个人二维码后,通过草料二维码(https://cli.im/deqr)将二维码转换为`URL`,输入`Text`中即可

build_17.png

eth.build快速上手就到这里,这个「神器」还有很多玩法可以挖掘🤩。



slogan.jpeg

点赞 1
收藏 3
分享
本文参与登链社区写作激励计划 ,好文好收益,欢迎正在阅读的你也加入。

0 条评论

请先 登录 后评论