¿Web3.0 es muy amigable con el front-end?

innovador

Recientemente, web3.0las voces se están volviendo más fuertes y locas. Para nuestro front-end, ¿qué tecnología necesitamos tener?

Primero, permítanme presentarles cómo web3.0se deriva

La Internet

Primero hablemos de lo que es la web. En 1989, un grupo técnico liderado por Tim Berners-Lee en el CERN (Instituto Europeo de Física de Partículas) presentó un nuevo protocolo para Internet y un sistema de documentos que usa el protocolo. El sistema se llama The La World Wide Web, denominada WWW (World Wide Web), es lo que ahora conocemos como "Internet". Su propósito es permitir que los científicos de todo el mundo utilicen Internet para intercambiar sus documentos de trabajo. Las tecnologías que utiliza son principalmente HTML, URI, URL, HTTP, etc., y puede mostrar el contenido de la página web de forma estática. eso somos nosotros

Web1.0

Por lo general, la Web 1.0 se refiere a la Internet de la década de 1990 y principios de la de 2000. Para decirlo sin rodeos, es Internet compuesto por blogs, tableros de mensajes y sitios web de portales tempranos como AOL y CompuServe.Los sitios web como Sina, Sohu y Netease con los que estamos familiarizados en China son los productos de esa época. En Web1.0, las páginas web estáticas se leen básicamente de forma pasiva y los protocolos de construcción de páginas web utilizan HTTP, FTP, etc. En el caso de Web1.0, el contenido de las páginas web es de solo lectura y estático, similar a las revistas, que solo se pueden ver pero no modificar o interactuar. Bajo la Web 1.0, los usuarios son únicamente consumidores de información (páginas web) y no pueden interactuar con ellas. Web1.0 es también un acceso a Internet dial-up, con una banda ancha promedio de 50k.

En general, Web1.0 es de solo lectura y descentralizado.

Web 2.0

Y Web2.0 salió a la luz alrededor de 2005. El significado general de la Web 2.0 es que los usuarios pueden crear y publicar su propio contenido en páginas web, participar activamente en Internet y no simplemente leer páginas web pasivamente. Los fondos finales y el control de toda la página web todavía están ocupados por el propietario de la página web. Las redes sociales como Facebook, Twitter y YouTube también son productos de esta época. Por supuesto, la proliferación de contenido generado por el usuario de esta manera también ha creado un monopolio natural, que también conducirá a varios problemas: 1. Los datos del usuario están centralizados 2. Los datos del usuario no son portátiles 3. Los datos del usuario se venden

总而言之，Web2.0 是读写并存的

Web3.0

Web3.0 是一个去中心化的网络，通过将权力和数据集中到用户手中，而不是某个公司所独有。将数据分布到网络上其中内含去中心化的区块链技术。Web3.0 这个词语已存在多年了，只是在过去一年才开始流行起来。使用 Web3，网络是去中心化的，因此没有权威机构对其进行控制，并且构建在网络之上的去中心化应用程序（dapps）是开放的。去中心化网络的开放性意味着任何一方都无法控制数据或限制访问。任何人都可以在未经中央公司许可的情况下构建和连接不同的 dapp。

Web3.0 的主要特点包括如下几点：

语义 Web——它是 Web3.0 的关键，使机器易于处理数据。
AI——AI是影响 Web3.0 技术流行的主要关键因素之一。它使机器通过大量的Web数据变得更加智能，以满足用户的需求。
3D图形——Web3.0 已经超越了传统的互联网，因为它的三维技术，它提供了一个比2D更现实的三维在线世界。
无处不在——同时存在或无处不在的概念，移动设备的兴起日益增加，许多人更容易随时随地访问互联网。
开放性和互操作性，这指的是在应用程序编程接口、数据格式、协议和设备与平台之间的互操作性方面的开放性。
全球数据存储库，这是一种跨程序和跨网络访问信息的能力。

总之：Web3.0 是读、写、拥有网络的一切。

介绍

对于我们前端开发者来说，我们应该掌握哪些技术或者应该了解什么呢？简单来说，web3 开发人员创建了分散的全栈应用程序，这些应用程序存在于区块链上并与之交互。下面简单得说一下。

我们先了解一下专业术语有哪些：

Web3：它是以太坊区块链 Ethereum blockchain 和你的智能合约 Smart Contracts 之间的连接。
以太坊 Ethereum：一个去中心化的开源区块链 blockchain，允许用户通过创建智能合约 creating smart contracts 与网络进行交互。它的原生加密货币是以太币。就市值而言，以太币是仅次于比特币的第二大最有价值的加密货币。它由 Vitalik Buterin 于 2013 年创建。
智能合约 Smart Contracts ：它们是存储在区块链上的计算机程序 computer programs ，在满足预定条件时运行。智能合约是用 Solidity 语言编写的。
去中心化 Decentralized ：数据状态不由中央实体 central entity、平台 platform 或个人 individual 收集
区块链：区块链网络是一种点对点连接，其中信息在多个设备之间共享，几乎不可能被黑客入侵。它是一种记录信息的系统，其方式使得很难或不可能更改保存在网络上的信息。
Solidity：一种用于编写智能合约 writing smart contracts 的面向对象 object-oriented 的编程语言。它用于在各种区块链平台上实施智能合约，最著名的是以太坊。Solidity 的语法类似于 javascript。要了解 Solidity，最好有 javascript 等编程语言的背景。直接跳入 Solidity 是一个坏主意
Dapp：代表去中心化应用程序 Decentralized App 。它们是在去中心化网络或区块链上运行其后端代码（主要用 Solidity 编写的智能合约）的应用程序。可以使用 react、vue 或 Angular 等前端框架构建 Dapps。
Bitcoin 比特币：世界上第一个被广泛应用的加密货币。
Crypto: 又称 Cryptocurrency，加密货币，一种去中心化的数字货币。
NFT： Non-Fungible Token，一种在链上被记录的、有所有权的数字资产。
DAO： Decentralized Autonomous Organization，去中心化的自治组织。
Metaverse元宇宙：一种由科技手段创造的虚拟世界的构想。
DeFi Decentralized Finance：去中心化金融系统。
Token 代币：可以理解为加密货币、NFT 等数字资产的统称。
GameFi： Game + DeFi，中文说法链游，游戏中的金融系统可通过加密货币和 NFT 映射到现实。

介绍完以上这些，我们再聊下区块链对于开发人员也是分类得。主要是核心区块链开发（核心区块链工程师负责区块链系统的架构和安全协议）和区块链软件开发（这些区块链开发人员利用核心区块链开发人员提供的设计架构创建 Dapp）。

开始

下面我们来点实在得，对于我们前端开发，我们想要开发驻留并与区块链交互的去中心化应用程序，就必须使用 web3.js 和 Ethers.js 库。

web3.js

web3.js 是一个JavaScript API库。要使 DApp 在以太坊上运行，我们可以使用web3.js库提供的web3对象。web3.js 通过RPC调用与本地节点通信，它可以用于任何暴露了RPC层的以太坊节点。web3 包含 eth 对象 - web3.eth（专门与以太坊区块链交互）和 shh 对象 - web3.shh（用于与 Whisper 交互）

添加web3

将 web3 引入到你的工程中，其实跟我们现有的引用方式基本一致

npm: npm install web3
bower: bower install web3
metor: meteor add ethereum:web3
vanilla: dist./web3.min.js

使用

然后你需要创建一个web3的实例，设置一个provider。为了保证你不会覆盖一个已有的provider，比如使用Mist时有内置，需要先检查是否web3实例已存在

if (!web3) {
  web3 = new Web3(web3.currentProvider);
} else {
  web3 = new Web3(new Web3.providers.HttpProvider("http://localhost:8545"));
}
复制代码

由于这套API被设计来与本地的RPC结点交互，所有函数默认使用同步的HTTP的请求。如果你想发起一个异步的请求。大多数函数允许传一个跟在参数列表后的可选的回调函数来支持异步

web3.eth.getBlock(48, function(error, result){
  if(!error)
      console.log(result)
  else
      console.error(error);
})
复制代码

API的具体目录可以点击查看

Ethers.js

为以太坊区块链及其生态系统提供一个小而完整的 JavaScript API 库它最初是与 ethers.io 一起使用，现在已经扩展为更通用的库。功能上基本和web3.js差不多。

特点如下：

将私钥保存在客户端，安全可信赖
可支持导入和导出的 JSON钱包文件（Geth，Parity和crowdsale）
从任何合同ABI创建JavaScript 元类对象，包括 ABIv2 和可读的 ABI
支持通过 JSON-RPC，INFURA ， Etherscan 或 MetaMask 连接到以太坊节点。
库非常小（压缩~88kb;未压缩284kb）

工具

当然除了上面这些，我们也会用到很多工具去完善我们的开发

Truffle: 提供了一个使用以太坊虚拟机编译和测试智能合约的开发环境，用作项目中的构建依赖项
Remix IDE: 编写和使用智能合约的完美环境，我们可以使用它直接从浏览器创建、修改和执行智能合约。它更像是一个编辑器
MetaMask: 一个 Chrome 扩展程序，可让您从浏览器连接到以太坊区块链网络
Ganache: 提供了一个本地区块链环境来测试您的智能合约

构建

我们想构建一个全栈 Dapp 如果您想为项目添加用户界面，react.js、vue.js 或 angular.js 是很好的 javascript 前端框架，因为它们可以使用 ethers.js 或 web3.js 轻松与区块链网络集成。有多种平台可让您在不编写代码的情况下创建完整的 Dapp比如：Bunz、Dapp builder、Atra io、Bubble io

结论

总的来说，Web3.0 不是一种技术，而是一个概念。我们前端开发者也不用很慌张，不管技术发展成什么样子，都会用到前端。我们可以利用我们 react.js、vue.js 或 angular.js 去为我们自己开发的 Dapp 应用去搭建属于我们自己的平台，也可以利用 nodejs 通过使用web3.js这个以太坊提供的工具包，来完成合约的编译，发布，合约方法调用的一整个流程。