From 484f605552adc725df744028d04e65b9b72b7ee7 Mon Sep 17 00:00:00 2001 From: Dan Forbes Date: Tue, 4 Jun 2024 09:44:33 -0700 Subject: [PATCH 1/3] More Improvements to the Introduction Page --- .../guides/getting_started/introduction.md | 50 +++++++++++++------ docs/docusaurus.config.js | 2 +- 2 files changed, 37 insertions(+), 15 deletions(-) diff --git a/docs/docs/guides/getting_started/introduction.md b/docs/docs/guides/getting_started/introduction.md index 019baa1faa1..714d10635b0 100644 --- a/docs/docs/guides/getting_started/introduction.md +++ b/docs/docs/guides/getting_started/introduction.md @@ -10,22 +10,19 @@ Web3.js is a robust and flexible collection of **TypeScript and JavaScript** lib This documentation is the entrypoint to Web3.js for developers. It covers [basic](/guides/getting_started/quickstart) and [advanced](/guides/smart_contracts/mastering_smart_contracts) usage with examples, and includes comprehensive [API documentation](/api) as well as guides for common tasks, like [upgrading](/guides/web3_upgrade_guide/x/) from older versions. -## Features of Web3.js v4 +## Using These Docs -- Flexible - - ECMAScript (ESM) and CommonJS (CJS) builds - - [Plugins](/guides/web3_plugin_guide/) for extending functionality -- Efficient - - Modular, [package](/#packages)-based design reduces unneeded dependencies - - [Tree shakable with ESM](/guides/advanced/tree_shaking) - - Use of native [BigInt](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/BigInt) (instead of large [BigNumber](https://mikemcl.github.io/bignumber.js/) libraries) - - Efficient ABI [encoding](/api/web3-eth-abi/function/encodeFunctionCall) & [decoding](/api/web3-eth-abi/function/decodeParameter) -- Developer-Friendly - - [Dynamic contract types](/guides/smart_contracts/infer_contract_types/) & full API in TypeScript - - Custom output [formatters](https://docs.web3js.org/api/web3-utils/function/format) - - In compliance with the [Ethereum JSON-RPC Specification](https://ethereum.github.io/execution-apis/api-documentation/) +There is a lot to learn about Web3.js! Here are some tips for developers of different skill levels. Remember, you can always [reach out directly](/guides/feedback/#urgent-questions-or-concerns) with Discord or Twitter if you're feeling stuck. + +### For Beginner Web3.js Developers + +New Web3.js developers should proceed to the [Quickstart](/guides/getting_started/quickstart) section to learn how to get started with Web3.js. Once you understand the basics, you may want to consider learning more about [providers](/guides/web3_providers_guide/), [wallets and accounts](/guides/wallet/), [smart contracts](/guides/smart_contracts/), and how to [use Web3.js with the Hardhat development environment](/guides/hardhat_tutorial/). -## Packages +### For Intermediate & Advanced Web3.js Developers + +If you're already familiar with Ethereum and Web3.js development, you may want to review the Web3.js [package structure](#packages--plugins) and proceed directly to the [package-level documentation](/libdocs/ABI) and [API documentation](/api). Application developers may wish to review the [Web3.js configuration guide](/guides/web3_config/) or learn how to use Web3.js with tools like the [MetaMask](/guides/wallet/metamask) wallet or the [WalletConnect](/guides/wallet/web3_modal_guide/) wallet selection modal. Don't forget to review the [list of available plugins](https://web3js.org/plugins) or even [learn how to build your own Web3.js plugin](/guides/web3_plugin_guide/plugin_authors)! + +## Packages & Plugins Web3.js is a modular collection of packages, each of which serves a specific needs. This means developers don't need to install the entire Web3 library for most use cases. Instead, necessary packages are selectively installed for a more efficient development experience. Here is an overview of a selection of available packages: @@ -61,6 +58,31 @@ Web3.js is a modular collection of packages, each of which serves a specific nee - [**Web3 RPC Methods:**](/api/web3/namespace/rpcMethods) functions for making RPC requests to Ethereum using a given provider +### Plugins + +Web3.js supports [plugins](/guides/web3_plugin_guide/), which are another way to encapsulate capabilities that support a specific need. There are plugins that exist to support native features, like those described by [EIPs](https://eips.ethereum.org/) as well as plugins that are designed to support specific smart contracts, middleware, or even other Ethereum-compatible networks. Visit the [Web3.js plugins homepage](https://web3js.org/plugins) to view a list of the most important Web3.js plugins, which includes: + +- [EIP-4337 (Account Abstraction) Plugin](https://www.npmjs.com/package/@chainsafe/web3-plugin-eip4337) + +- [EIP-4844 (Blob Transactions) Plugin](https://www.npmjs.com/package/web3-plugin-blob-tx) + +- [zkSync Plugin](https://www.npmjs.com/package/web3-plugin-zksync) + +## Features of Web3.js v4 + +- Flexible + - ECMAScript (ESM) and CommonJS (CJS) builds + - [Plugins](/guides/web3_plugin_guide/) for extending functionality +- Efficient + - Modular, [package](/#packages)-based design reduces unneeded dependencies + - [Tree shakable with ESM](/guides/advanced/tree_shaking) + - Use of native [BigInt](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/BigInt) (instead of large [BigNumber](https://mikemcl.github.io/bignumber.js/) libraries) + - Efficient ABI [encoding](/api/web3-eth-abi/function/encodeFunctionCall) & [decoding](/api/web3-eth-abi/function/decodeParameter) +- Developer-Friendly + - [Dynamic contract types](/guides/smart_contracts/infer_contract_types/) & full API in TypeScript + - Custom output [formatters](https://docs.web3js.org/api/web3-utils/function/format) + - In compliance with the [Ethereum JSON-RPC Specification](https://ethereum.github.io/execution-apis/api-documentation/) + ## Advantages Over Other Libraries - **Extensive Documentation and Community**: Web3.js is one of the most established Ethereum libraries, which means it benefits from extensive documentation and a large, active community. Web3.js is widely adopted and has been thoroughly tested in various production environments, and is compatible with a broad range of other tools and services in the Ethereum ecosystem. diff --git a/docs/docusaurus.config.js b/docs/docusaurus.config.js index de35f444c47..2fff620f657 100644 --- a/docs/docusaurus.config.js +++ b/docs/docusaurus.config.js @@ -123,7 +123,7 @@ const config = { { to: '/libdocs/ABI', activeBasePath: '/libdocs', - label: 'Documentation', + label: 'Packages', position: 'left', }, { From 393b145fbde66318d83daff071acd631880dcfdf Mon Sep 17 00:00:00 2001 From: Dan Forbes Date: Wed, 5 Jun 2024 06:06:57 -0700 Subject: [PATCH 2/3] Move Features of Web3.js v4 Section Back to Original Location --- .../guides/getting_started/introduction.md | 30 +++++++++---------- 1 file changed, 15 insertions(+), 15 deletions(-) diff --git a/docs/docs/guides/getting_started/introduction.md b/docs/docs/guides/getting_started/introduction.md index 714d10635b0..d206f316904 100644 --- a/docs/docs/guides/getting_started/introduction.md +++ b/docs/docs/guides/getting_started/introduction.md @@ -10,6 +10,21 @@ Web3.js is a robust and flexible collection of **TypeScript and JavaScript** lib This documentation is the entrypoint to Web3.js for developers. It covers [basic](/guides/getting_started/quickstart) and [advanced](/guides/smart_contracts/mastering_smart_contracts) usage with examples, and includes comprehensive [API documentation](/api) as well as guides for common tasks, like [upgrading](/guides/web3_upgrade_guide/x/) from older versions. +## Features of Web3.js v4 + +- Flexible + - ECMAScript (ESM) and CommonJS (CJS) builds + - [Plugins](/guides/web3_plugin_guide/) for extending functionality +- Efficient + - Modular, [package](/#packages)-based design reduces unneeded dependencies + - [Tree shakable with ESM](/guides/advanced/tree_shaking) + - Use of native [BigInt](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/BigInt) (instead of large [BigNumber](https://mikemcl.github.io/bignumber.js/) libraries) + - Efficient ABI [encoding](/api/web3-eth-abi/function/encodeFunctionCall) & [decoding](/api/web3-eth-abi/function/decodeParameter) +- Developer-Friendly + - [Dynamic contract types](/guides/smart_contracts/infer_contract_types/) & full API in TypeScript + - Custom output [formatters](https://docs.web3js.org/api/web3-utils/function/format) + - In compliance with the [Ethereum JSON-RPC Specification](https://ethereum.github.io/execution-apis/api-documentation/) + ## Using These Docs There is a lot to learn about Web3.js! Here are some tips for developers of different skill levels. Remember, you can always [reach out directly](/guides/feedback/#urgent-questions-or-concerns) with Discord or Twitter if you're feeling stuck. @@ -68,21 +83,6 @@ Web3.js supports [plugins](/guides/web3_plugin_guide/), which are another way to - [zkSync Plugin](https://www.npmjs.com/package/web3-plugin-zksync) -## Features of Web3.js v4 - -- Flexible - - ECMAScript (ESM) and CommonJS (CJS) builds - - [Plugins](/guides/web3_plugin_guide/) for extending functionality -- Efficient - - Modular, [package](/#packages)-based design reduces unneeded dependencies - - [Tree shakable with ESM](/guides/advanced/tree_shaking) - - Use of native [BigInt](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/BigInt) (instead of large [BigNumber](https://mikemcl.github.io/bignumber.js/) libraries) - - Efficient ABI [encoding](/api/web3-eth-abi/function/encodeFunctionCall) & [decoding](/api/web3-eth-abi/function/decodeParameter) -- Developer-Friendly - - [Dynamic contract types](/guides/smart_contracts/infer_contract_types/) & full API in TypeScript - - Custom output [formatters](https://docs.web3js.org/api/web3-utils/function/format) - - In compliance with the [Ethereum JSON-RPC Specification](https://ethereum.github.io/execution-apis/api-documentation/) - ## Advantages Over Other Libraries - **Extensive Documentation and Community**: Web3.js is one of the most established Ethereum libraries, which means it benefits from extensive documentation and a large, active community. Web3.js is widely adopted and has been thoroughly tested in various production environments, and is compatible with a broad range of other tools and services in the Ethereum ecosystem. From e4ba0aab7925f4601e05fd9d6ada2b09461fc7d4 Mon Sep 17 00:00:00 2001 From: Dan Forbes Date: Wed, 5 Jun 2024 06:16:55 -0700 Subject: [PATCH 3/3] Fix Broken Link --- docs/docs/guides/getting_started/introduction.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/docs/guides/getting_started/introduction.md b/docs/docs/guides/getting_started/introduction.md index d206f316904..0ccdbced97e 100644 --- a/docs/docs/guides/getting_started/introduction.md +++ b/docs/docs/guides/getting_started/introduction.md @@ -31,7 +31,7 @@ There is a lot to learn about Web3.js! Here are some tips for developers of diff ### For Beginner Web3.js Developers -New Web3.js developers should proceed to the [Quickstart](/guides/getting_started/quickstart) section to learn how to get started with Web3.js. Once you understand the basics, you may want to consider learning more about [providers](/guides/web3_providers_guide/), [wallets and accounts](/guides/wallet/), [smart contracts](/guides/smart_contracts/), and how to [use Web3.js with the Hardhat development environment](/guides/hardhat_tutorial/). +New Web3.js developers should proceed to the [Quickstart](/guides/getting_started/quickstart) section to learn how to get started with Web3.js. Once you understand the basics, you may want to consider learning more about [providers](/guides/web3_providers_guide/), [wallets and accounts](/guides/wallet/), [smart contracts](/guides/smart_contracts/smart_contracts_guide), and how to [use Web3.js with the Hardhat development environment](/guides/hardhat_tutorial/). ### For Intermediate & Advanced Web3.js Developers