Release candidate v9.7.0

.env.example

@@ -7,6 +7,8 @@
 # NEXT_PUBLIC_ALGOLIA_APP_ID=insertValue
 # NEXT_PUBLIC_ALGOLIA_SEARCH_KEY=insertValue
 # NEXT_PUBLIC_ALGOLIA_BASE_SEARCH_INDEX_NAME=insertValue
+
+# Github token for read-only use with api functions
 # NEXT_PUBLIC_GITHUB_TOKEN_READ_ONLY=insertValue
 
 # Etherscan API key (required for Etherscan API fetches)

.eslintrc.json

@@ -33,8 +33,8 @@
           ["^@/data"],
           // From the `constants` directory.
           ["^@/lib/constants"],
-          // From the `.storybook/utils` file
-          ["^@/storybook-utils"],
+          // `.storybook` directory and utils files`
+          ["^@/storybook","^@/storybook-utils"],
           // Parent imports. Put `..` last.
           ["^\\.\\.(?!/?$)", "^\\.\\./?$"],
           // Other relative imports. Put same-folder imports and `.` last.

.storybook/main.ts

@@ -1,3 +1,5 @@
+import path from "path"
+
 import TsconfigPathsPlugin from "tsconfig-paths-webpack-plugin"
 import type { StorybookConfig } from "@storybook/nextjs"
 
@@ -51,6 +53,11 @@ const config: StorybookConfig = {
           extensions: config.resolve.extensions,
         }),
       ]
+
+      config.resolve.alias = {
+        ...config.resolve.alias,
+        "@/storybook/*": path.resolve(__dirname, "./.storybook/"),
+      }
     }
 
     // This modifies the existing image rule to exclude .svg files

docs/review-process.md

@@ -42,7 +42,7 @@ Typographical and grammatical errors are medium-priority as small errors of this
 
 ### Adding products
 
-Adding new products is currently a low-to-medium priority (depending on the type of product). These pull requests often take a long time to review as we must extensively research products to ensure we not sending our users to any dubious or unsafe products.
+Adding new products is currently a low-to-medium priority (depending on the type of product). These pull requests often take a long time to review as we must extensively research products to ensure we are not sending our users to any dubious or unsafe products.
 
 **Timeline:** PRs should be closed or merged within 30 days of opening.
 

next.config.js

@@ -59,6 +59,14 @@ module.exports = (phase, { defaultConfig }) => {
       // Modify the file loader rule to ignore *.svg, since we have it handled now.
       fileLoaderRule.exclude = /\.svg$/i
 
+      config.module.rules.push({
+        test: /\.(mp3)$/,
+        type: "asset/resource",
+        generator: {
+          filename: "static/media/[name][ext]",
+        },
+      })
+
       return config
     },
     trailingSlash: true,

package.json

@@ -1,6 +1,6 @@
 {
   "name": "ethereum-org-website",
-  "version": "9.6.0",
+  "version": "9.7.0",
   "license": "MIT",
   "private": true,
   "scripts": {
@@ -57,6 +57,7 @@
     "ethereum-blockies-base64": "^1.0.2",
     "framer-motion": "^10.13.0",
     "gray-matter": "^4.0.3",
+    "howler": "^2.2.4",
     "htmr": "^1.0.2",
     "lodash.merge": "^4.6.2",
     "lodash.shuffle": "^4.2.0",
@@ -67,7 +68,7 @@
     "next-sitemap": "^4.2.3",
     "next-themes": "^0.3.0",
     "prism-react-renderer": "1.1.0",
-    "prismjs": "^1.27.0",
+    "prismjs": "^1.30.0",
     "react": "^18.2.0",
     "react-chartjs-2": "^5.2.0",
     "react-dom": "^18.2.0",

public/content/community/online/index.md

@@ -57,10 +57,11 @@ If you believe a community should be added or removed based on these guidelines,
 <SocialListItem socialIcon="webpage"><Link href="https://ethereum.stackexchange.com/">Ethereum Stack Exchange</Link> <i>- question and answer forum</i></SocialListItem>
 <SocialListItem socialIcon="webpage"><Link href="https://app.peera.ai/">Peera Community Forum</Link> <i>- decentralized question and answer forum</i></SocialListItem>
 
-## YouTube and X formerly (Twitter) {#youtube-and-twitter}
+## YouTube and X (formerly Twitter) {#youtube-and-twitter}
 
 <SocialListItem socialIcon="youtube"><Link href="https://www.youtube.com/c/EthereumFoundation">Ethereum Foundation</Link> - Keep up to date with the latest from the Ethereum Foundation</SocialListItem>
-<SocialListItem socialIcon="twitter"><Link href="https://x.com/ethereum">@ethereum</Link> - Official account of the Ethereum Foundation</SocialListItem>
+<SocialListItem socialIcon="twitter"><Link href="https://x.com/ethereum">@ethereum</Link> - Main Ethereum account for the community</SocialListItem>
+<SocialListItem socialIcon="twitter"><Link href="https://x.com/ethereumfndn">@ethereumfndn</Link> - Official account of the Ethereum Foundation</SocialListItem>
 <SocialListItem socialIcon="twitter"><Link href="https://x.com/ethdotorg">@ethdotorg</Link> - The portal to Ethereum, built for our growing global community</SocialListItem>
 <SocialListItem socialIcon="webpage"><Link href="https://hive.one/c/ethereum?page=1">List of influential Ethereum twitter accounts</Link></SocialListItem>
 

public/content/decentralized-identity/index.md

@@ -39,7 +39,7 @@ These traditional examples of identifiers are issued, held and controlled by cen
 
 1. Decentralized identity increases individual control of identifying information. Decentralized identifiers and attestations can be verified without relying on centralized authorities and third-party services.
 
-2. Decentralized identity solutions facilitates a trustless, seamless, and privacy-protecting method for verifying and managing user identity.
+2. Decentralized identity solutions facilitate a trustless, seamless, and privacy-protecting method for verifying and managing user identity.
 
 3. Decentralized identity harnesses blockchain technology, which creates trust between different parties and provides cryptographic guarantees to prove the validity of attestations.
 

public/content/defi/index.md

@@ -32,7 +32,7 @@ One of the best ways to see the potential of DeFi is to understand the problems
 - Financial services can block you from getting paid.
 - A hidden charge of financial services is your personal data.
 - Governments and centralized institutions can close down markets at will.
-- Trading hours are often limited to business hours of specific time zone.
+- Trading hours are often limited to business hours of a specific time zone.
 - Money transfers can take days due to internal human processes.
 - There's a premium to financial services because intermediary institutions need their cut.
 

public/content/developers/docs/data-availability/blockchain-data-storage-strategies/index.md

@@ -63,7 +63,7 @@ Calldata refers to the bytes sent as part of the transaction. It is stored as pa
 
 This is the cheapest method to permanently put data in the blockchain. The cost per byte is either 4 execution gas (if the byte is zero) or 16 gas (any other value). If the data is compressed, which is standard practice, then every byte value is equally likely, so the average cost is approximately 15.95 gas per byte.
 
-At writing the prices are 12 gwei/gas and 2300 $/ETH, which means the cost is approximately 45 cents per kilobyte. Because this was the cheapest method prior to EIP-4844, this is the method rollups used to store transaction information, which need to be available for [fault challenges](https://docs.optimism.io/stack/protocol/overview#fault-proofs), but do not need to be accessible directly onchain.
+At the time of writing, the prices are 12 gwei/gas and 2300 $/ETH, which means the cost is approximately 45 cents per kilobyte. Because this was the cheapest method prior to EIP-4844, this is the method rollups used to store transaction information, which need to be available for [fault challenges](https://docs.optimism.io/stack/protocol/overview#fault-proofs), but do not need to be accessible directly onchain.
 
 Here are the addresses to see the transactions posted by some famous rollups.
 

public/content/developers/docs/nodes-and-clients/node-architecture/index.md

@@ -4,19 +4,21 @@ description: Introduction to how Ethereum nodes are organized.
 lang: en
 ---
 
-An Ethereum node is composed of two clients: an [execution client](/developers/docs/nodes-and-clients/#execution-clients) and a [consensus client](/developers/docs/nodes-and-clients/#consensus-clients).
+An Ethereum node is composed of two clients: an [execution client](/developers/docs/nodes-and-clients/#execution-clients) and a [consensus client](/developers/docs/nodes-and-clients/#consensus-clients). For a node to propose a new block, it must also run a [validator client](#validators).
 
-When Ethereum was using [proof-of-work](/developers/docs/consensus-mechanisms/pow/), an execution client was enough to run a full Ethereum node. However, since implementing [proof-of-stake](/developers/docs/consensus-mechanisms/pow/), the execution client needs to be used alongside another piece of software called a [“consensus client”](/developers/docs/nodes-and-clients/#consensus-clients).
+When Ethereum was using [proof-of-work](/developers/docs/consensus-mechanisms/pow/), an execution client was enough to run a full Ethereum node. However, since implementing [proof-of-stake](/developers/docs/consensus-mechanisms/pow/), the execution client must be used alongside another piece of software called a [consensus client](/developers/docs/nodes-and-clients/#consensus-clients).
 
 The diagram below shows the relationship between the two Ethereum clients. The two clients connect to their own respective peer-to-peer (P2P) networks. Separate P2P networks are needed as the execution clients gossip transactions over their P2P network, enabling them to manage their local transaction pool, whilst the consensus clients gossip blocks over their P2P network, enabling consensus and chain growth.
 
 ![](node-architecture-text-background.png)
 
-For this two-client structure to work, consensus clients must be able to pass bundles of transactions to the execution client. Executing the transactions locally is how the client validates that the transactions do not violate any Ethereum rules and that the proposed update to Ethereum’s state is correct. Likewise, when the node is selected to be a block producer the consensus client must be able to request bundles of transactions from Geth to include in the new block and execute them to update the global state. This inter-client communication is handled by a local RPC connection using the [engine API](https://github.com/ethereum/execution-apis/blob/main/src/engine/common.md).
+_There are several options for the execution client including Erigon, Nethermind, and Besu_.
+
+For this two-client structure to work, consensus clients must pass bundles of transactions to the execution client. The execution client executes the transactions locally to validate that the transactions do not violate any Ethereum rules and that the proposed update to Ethereum’s state is correct. When a node is selected to be a block producer its consensus client instance requests bundles of transactions from the execution client to include in the new block and execute them to update the global state. The consensus client drives the execution client via a local RPC connection using the [Engine API](https://github.com/ethereum/execution-apis/blob/main/src/engine/common.md). 
 
 ## What does the execution client do? {#execution-client}
 
-The execution client is responsible for transaction handling, transaction gossip, state management and supporting the Ethereum Virtual Machine ([EVM](/developers/docs/evm/)). However, it is **not** responsible for block building, block gossiping or handling consensus logic. These are in the remit of the consensus client.
+The execution client is responsible for transaction validation, handling, and gossip, along with state management and supporting the Ethereum Virtual Machine ([EVM](/developers/docs/evm/)). It is **not** responsible for block building, block gossiping or handling consensus logic. These are in the remit of the consensus client.
 
 The execution client creates execution payloads - the list of transactions, updated state trie, and other execution-related data. Consensus clients include the execution payload in every block. The execution client is also responsible for re-executing transactions in new blocks to ensure they are valid. Executing transactions is done on the execution client's embedded computer, known as the [Ethereum Virtual Machine (EVM)](/developers/docs/evm).
 
@@ -35,15 +37,15 @@ The consensus client does not participate in attesting to or proposing blocks -
 
 ## Validators {#validators}
 
-Node operators can add a validator to their consensus clients by depositing 32 ETH in the deposit contract. The validator client comes bundled with the consensus client and can be added to a node at any time. The validator handles attestations and block proposals. They enable a node to accrue rewards or lose ETH via penalties or slashing. Running the validator software also makes a node eligible to be selected to propose a new block.
+Staking and running the validator software makes a node eligible to be selected to propose a new block. Node operators can add a validator to their consensus clients by depositing 32 ETH in the deposit contract. The validator client comes bundled with the consensus client and can be added to a node at any time. The validator handles attestations and block proposals. It also enables a node to accrue rewards or lose ETH via penalties or slashing. 
 
 [More on staking](/staking/).
 
 ## Components of a node comparison {#node-comparison}
 
 | Execution Client                                   | Consensus Client                                                 | Validator                    |
 | -------------------------------------------------- | ---------------------------------------------------------------- | ---------------------------- |
-| Gossips transactions over its p2p network          | Gossips blocks and attestations over its p2p network             | Proposes blocks              |
+| Gossips transactions over its P2P network          | Gossips blocks and attestations over its P2P network             | Proposes blocks              |
 | Executes/re-executes transactions                  | Runs the fork choice algorithm                                   | Accrues rewards/penalties    |
 | Verifies incoming state changes                    | Keeps track of the head of the chain                             | Makes attestations           |
 | Manages state and receipts tries                   | Manages the Beacon state (contains consensus and execution info) | Requires 32 ETH to be staked |

public/content/developers/docs/smart-contracts/security/index.md

@@ -115,7 +115,7 @@ The existence of audits and bug bounties doesn’t excuse your responsibility to
 
 - Use a [development environment](/developers/docs/frameworks/) for testing, compiling, deploying smart contracts
 
-- Run your code through basic code analysis tools, such as, [Cyfrin Aaderyn](https://github.com/Cyfrin/aderyn), Mythril and Slither. Ideally, you should do this before each pull request is merged and compare differences in output
+- Run your code through basic code analysis tools, such as, [Cyfrin Aderyn](https://github.com/Cyfrin/aderyn), Mythril and Slither. Ideally, you should do this before each pull request is merged and compare differences in output
 
 - Ensure your code compiles without errors, and the Solidity compiler emits no warnings
 

public/content/developers/docs/smart-contracts/testing/index.md

@@ -259,7 +259,7 @@ The major difference is that bug bounty programs are open to the wider developer
 
 - **[Brownie unit testing framework](https://eth-brownie.readthedocs.io/en/v1.0.0_a/tests.html)** - _Brownie utilizes Pytest, a feature-rich test framework that lets you write small tests with minimal code, scales well for large projects, and is highly extendable._
 
-- **[Foundry Tests](https://github.com/foundry-rs/foundry/tree/master/forge)** - _Foundry offers Forge, a fast and flexible Ethereum testing framework capable of executing simple unit tests, gas optimization checks, and contract fuzzing._
+- **[Foundry Tests](https://github.com/foundry-rs/foundry/tree/master/crates/forge)** - _Foundry offers Forge, a fast and flexible Ethereum testing framework capable of executing simple unit tests, gas optimization checks, and contract fuzzing._
 
 - **[Hardhat Tests](https://hardhat.org/hardhat-runner/docs/guides/test-contracts)** - _Framework for testing smart contracts based on ethers.js, Mocha, and Chai._
 

public/content/developers/tutorials/erc20-with-safety-rails/index.md

@@ -146,7 +146,7 @@ Freezing and thawing contracts requires several changes:
       mapping(address => bool) public frozenAccounts;
   ```
 
-- [Events](https://www.tutorialspoint.com/solidity/solidity_events.htm) to inform anybody interested when an account is frozen or thawed. Technically speaking events are not required for these actions, but it helps offchain code to be able to listen to these events and know what is happening. It's considered good manners for a smart contract to emit them when something that miught be relevant to somebody else happens.
+- [Events](https://www.tutorialspoint.com/solidity/solidity_events.htm) to inform anybody interested when an account is frozen or thawed. Technically speaking events are not required for these actions, but it helps offchain code to be able to listen to these events and know what is happening. It's considered good manners for a smart contract to emit them when something that might be relevant to somebody else happens.
 
   The events are indexed so will be possible to search for all the times an account has been frozen or thawed.
 

public/content/developers/tutorials/hello-world-smart-contract-fullstack/index.md

@@ -9,7 +9,7 @@ tags:
     "alchemy",
     "smart contracts",
     "deploying",
-    "blockexplorer",
+    "block explorer",
     "frontend",
     "transactions",
   ]

public/content/developers/tutorials/how-to-use-slither-to-find-smart-contract-bugs/index.md

@@ -3,7 +3,7 @@ title: How to use Slither to find smart contract bugs
 description: How to use Slither to automatically find bugs in smart contracts
 author: Trailofbits
 lang: en
-tags: ["solidity", "smart contracts", "security", "testing", "static analysis"]
+tags: ["solidity", "smart contracts", "security", "testing"]
 skill: advanced
 published: 2020-06-09
 source: Building secure contracts

public/content/developers/tutorials/ipfs-decentralized-ui/index.md

@@ -2,7 +2,7 @@
 title: IPFS for decentralized user interfaces
 description: This tutorial teaches the reader how to use IPFS to store the user interface for a dapp. Although the application's data and business logic are decentralized, without a censorship resistant user interface users might lose access to it anyway.
 author: Ori Pomerantz
-tags: ["ipfs", "user interface"]
+tags: ["ipfs"]
 skill: beginner
 lang: en
 published: 2024-06-29

public/content/developers/tutorials/kickstart-your-dapp-frontend-development-with-create-eth-app/index.md

@@ -3,7 +3,7 @@ title: Kickstart your dapp frontend development with create-eth-app
 description: An overview of how to use create-eth-app and its features
 author: "Markus Waas"
 tags:
-  ["create-eth-app", "frontend", "javascript", "ethers.js", "the graph", "defi"]
+  ["frontend", "javascript", "ethers.js", "the graph", "defi"]
 skill: beginner
 lang: en
 published: 2020-04-27

public/content/developers/tutorials/server-components/index.md

@@ -4,7 +4,7 @@ description: After reading this tutorial, you will be able to write TypeScript s
 
 author: Ori Pomerantz
 lang: en
-tags: ["agent", "server", "offchain", "centralized"]
+tags: ["agent", "server", "offchain"]
 skill: beginner
 published: 2024-07-15
 ---

public/content/developers/tutorials/the-graph-fixing-web3-data-querying/index.md

@@ -9,7 +9,6 @@ tags:
     "smart contracts",
     "querying",
     "the graph",
-    "create-eth-app",
     "react",
   ]
 skill: intermediate

public/content/history/index.md

@@ -113,7 +113,7 @@ Protocol efficiency and security improvements:
 
 </ExpandableCard>
 
-- [Pectra.wtf](https//pectra.wtf)
+- [Pectra.wtf](https://pectra.wtf)
 - [How Pectra will enhance the staking experience](https://www.kiln.fi/post/next-ethereum-upgrade-how-pectra-will-enhance-the-staking-experience)
 - [Read the Electra upgrade specifications](https://github.com/ethereum/consensus-specs/blob/dev/specs/electra/)
 - [Prague-Electra ("Pectra") FAQ](/roadmap/pectra/)