【初识Web3】如何入坑区块链前端


theme: fancy

开启掘金成长之旅!这是我参与「掘金日新计划 · 12 月更文挑战」的第1天,点击查看活动详情

初识 Web3

Web3.0(即运行在区块链技术上的去中心化互联网)。

因为最近要做一个智能合约靶场的项目,准备开始拓展一下自己的技术栈。所以今天我们开始学习 Web3 的内容。学习一门新的技术,首先要了解前置知识。

前置知识

如果你想入坑 web3,那么我建议你先尝试学习以下内容。

  1. 区块链原理。建议在B站搜索并学习: 北京大学肖臻老师《区块链技术与应用》公开课
  2. 了解Web2,掌握一定的前端开发技术,包括JavaScript语言和网页开发技术(HTML-CSS-JS以及Vue.js或React.js等前端开发工具)

预期学习内容

  1. 学习Solidity语言的简单语法以及智能合约。
  2. 掌握智能合约开发的一些工具,如测试工具 Ganach ,部署工具 TruffleHardHat
  3. 学习去中心化应用DApp(decentralized application)。
  4. 学习MetaMask加密钱包知识以及开发所需调用的API。
  5. 学习Web3.jsEthers.js连接去中心化应用。
  6. 实战区块链-web3项目。

Web3.js概述

  • 智能合约开发:solidity语言编写合约,部署上链
  • 网站/客户端开发:前端与区块链上的智能合约进行交互,读写数据

Web3 是对 JSON RPC 请求的封装。

Web3.js 库是一个 JavaScript 库,是以太坊官方提供的和节点交互的 JavaScript-SDK,可以帮助开发者使用 HTTP 或者 IPC 与本地或者远程的以太坊节点进行交互。

包含以下几个库:

  • web3-eth:用来与以太坊区块链和智能合约进行交互。
  • web3-shh:用来控制 whisper协议 与 p2p 通信,以及广播。
  • web3-bzz:用来与 swarm协议 交互。
  • web3-utils:包含了一些DApp开发应用的功能。

通过 Web3.js 库,可以连接任何暴露了 RPC 层的以太坊节点,可以让你通过节点执行很多与区块链进行交互的任务,例如:

  • 以太坊转账
  • 读写智能合约中的数据
  • 创建智能合约
  • 发送交易

基础环境

  1. 安装 Nodejs 环境。
  2. 全局安装 web3 库:npm install -g web3

设置开发工具和所需知识库

  1. 在你的浏览器上下载 MetaMask钱包 插件。它是浏览器连接区块链的通道,可以管理你的所有数字资产。另外对于开发人员来说要学习MetaMask提供的API,帮助你所开发的程序与钱包进行连接。
  2. Ganache个人区块链:Ganache – Truffle Suite
  3. Remix智能合约编译部署工具:Remix – Ethereum IDE。首次加载可能会有些慢,请耐心等待。通过Remix你可以编写并编译智能合约,而无需通过繁杂的操作安装相关环境。
  4. web3.js库,提供前端JavaScript与区块链智能合约连接的API:Getting Started — web3.js 1.0.0 documentation (web3js.readthedocs.io)
  5. ether.js库,相比web3js更简洁:Documentation (ethers.io)
  6. Etherscan以太坊区块链浏览器:Ethereum (ETH) Blockchain Explorer (etherscan.io)
  7. Truffle 或 HardHat
  8. OpenZeppelin(智能合约开发与审计方向)
  9. Defi(去中心化金融方向)

连接到以太坊网络

要访问以太坊网络,首先需要连接到 Ethereum 节点:

  1. 使用 GethParity 运行自己的 Ethereum 节点。但这样需要从区块链下载大量数据并保持数据同步,十分麻烦。
  2. 使用 Ganache 以太坊节点仿真软件,它会在内存中创建一条测试链,便于开发者进行开发和调试。Ganache – Truffle Suite

总结

安装完成上述软件,你就可以开始简单的 web3 项目的搭建了。接下来我会介绍web3.js库的一些常用API以及上述工具的使用,带你进入 web3 的世界。

© 版权声明
THE END
喜欢就支持一下吧
点赞10 分享
评论 抢沙发
头像
欢迎您留下宝贵的见解!
提交
头像

昵称

取消
昵称表情代码图片

    暂无评论内容