web3 is inseparable from several concepts, smart contracts, blockchain, front-end interaction
1. Smart contracts can directly interact with blocks in the blockchain;
2. The front end can interact with smart contracts through npm libraries such as web3.js/ethers.js;
To put it bluntly, for the front end, web3 and web2 only have a change in the docking object, from the back-end API interface to the smart contract. This requires us to understand the smart contract Solidity .
1. Some basic concepts of web3
| Provider | Provider (provider) is an abstract class used to connect to the Ethereum network, providing a read-only form to access the blockchain network and obtain the state on the chain. | |
| Signer | Signer (signer) usually has some way of direct or indirect access to private keys, can sign messages and manage the ether currency in your account in authorized network to conduct transactions. | |
| Contract | Contract (contract) is an abstraction that runs on the Ethereum network to represent a specific contract in reality, and applications can use it like a JavaScript object. |
2. Conceptual distinction
Web2 and Web3 are two different concepts, they are different in technology and application level.
Web2 refers to the second generation of the Internet, that is, the infrastructure and applications of the modern Internet. Web2 is characterized by a centralized architecture, and users need to rely on centralized service providers to access and manage network resources. Web2 is mainly used in information transmission, social networking, e-commerce, online entertainment and other fields.
Web3 refers to the third-generation Internet, also known as the decentralized Internet. Web3 is characterized by a decentralized architecture, which implements decentralized applications through distributed technology and encrypted currency support. The goal of Web3 is to create a more free, secure, open and transparent Internet, which can be applied to digital identity, decentralized finance, decentralized applications and other fields.
For front-end developers, the difference between Web2 and Web3 is mainly at the technical and application levels. The development of Web2 applications mainly relies on traditional Web technologies, such as HTML, CSS, and JavaScript. The development of Web3 applications requires more knowledge of blockchain technology, decentralized technology, and smart contract programming. At the same time, the development of Web3 applications also needs to pay more attention to user privacy and security considerations.
In short, Web2 and Web3 are both development stages of the Internet, and their application scenarios and technical characteristics are very different. For front-end developers, it is necessary to choose an appropriate development method and technology stack according to application requirements and technical background.
3. The difference between the front end
In web2, we use API to interact with the backend, add, delete, modify and query data, and in web3 we also need to interact with data.
In web3, we need to use libraries such as Ethers/web3 to interact with intelligent contracts through ABI. In the process of interacting with the blockchain, we need to pay a certain amount of gas fees. Gas is a consumable, used for interactive consumption.
Remarks: gas fee = gas amount required for the transaction * unit price of gas (it is a dynamic number according to the network)
In short, for the front end, don’t be afraid, just change the interaction object , understand the basic concepts of the web, and understand the ABI interface of the contract.
4. To develop a Dapp, what needs to be prepared for the front end?
Developing a Dapp (decentralized application) needs to consider many aspects, including front-end, back-end, smart contracts, etc. Here are some things to prepare for front-end developers:
-
-
Web3.js: Web3.js is a JavaScript library that provides an API to interact with the Ethereum blockchain. When developing a Dapp, you need to use Web3.js to interact with the smart contract, such as calling functions in the contract, reading variables in the contract, and so on.
-
MetaMask: MetaMask is a browser plugin that provides an easy way to connect to the Ethereum blockchain and interact with smart contracts. When developing a Dapp, you need to install the MetaMask plugin and use it to connect to the Ethereum network.
-
Solidity: Solidity is a smart contract programming language, which is used to write Ethereum smart contracts. When developing a Dapp, you need to understand Solidity and write smart contracts to implement business logic.
-
Remix: Remix is a browser-based Solidity IDE that provides an integrated development environment for writing, testing, and deploying smart contracts. When developing a Dapp, you can use Remix to write and test smart contracts.
-
Truffle: Truffle is a development framework for building Ethereum Dapps, including smart contract compilers, testing frameworks, deployment tools, etc. When developing a Dapp, you can use Truffle to compile, test and deploy smart contracts.
-
IPFS: IPFS is a distributed file storage and transmission protocol, which can be used to store static resources of Dapp, such as HTML, CSS, JavaScript files, etc. When developing a Dapp, you can use IPFS to store and transmit static resources to improve the reliability and accessibility of the application.
-
Front-end frameworks such as React, Vue, and Angular: When developing the front-end interface of a Dapp, you can use front-end frameworks such as React, Vue, and Angular to quickly build the interface and implement complex business logic.
-
In short, to develop a Dapp, front-end developers need to master Web3.js, MetaMask, Solidity, Remix, Truffle, IPFS and other technologies, and need to use front-end frameworks to implement complex business logic. At the same time, the development of Dapp also needs to be coordinated with the backend and smart contracts to realize a complete Dapp.