From c8a98964a47ade1fc0b66e7591b566c01be3c211 Mon Sep 17 00:00:00 2001
From: Paul Wackerow <54227730+wackerow@users.noreply.github.com>
Date: Fri, 6 Jun 2025 16:34:11 -0700
Subject: [PATCH 01/11] feat: add simple CopyButton

---
 src/components/CopyToClipboard.tsx | 18 ++++++++++++++++++
 1 file changed, 18 insertions(+)

diff --git a/src/components/CopyToClipboard.tsx b/src/components/CopyToClipboard.tsx
index 93c8e9a6053..96e10698f6b 100644
--- a/src/components/CopyToClipboard.tsx
+++ b/src/components/CopyToClipboard.tsx
@@ -1,7 +1,12 @@
 "use client"
 
+import { BsCopy } from "react-icons/bs"
+import { FaRegCheckCircle } from "react-icons/fa"
+
 import { cn } from "@/lib/utils/cn"
 
+import { Button, type ButtonProps } from "./ui/buttons/Button"
+
 import { useClipboard } from "@/hooks/useClipboard"
 
 export type CopyToClipboardProps = {
@@ -27,4 +32,17 @@ const CopyToClipboard = ({
   )
 }
 
+type CopyButtonProps = ButtonProps & {
+  message: string
+}
+
+export const CopyButton = ({ message, ...props }: CopyButtonProps) => {
+  const { onCopy, hasCopied } = useClipboard({ timeout: 1500 })
+  return (
+    <Button variant="ghost" onClick={() => onCopy(message)} {...props}>
+      {hasCopied ? <FaRegCheckCircle /> : <BsCopy />}
+    </Button>
+  )
+}
+
 export default CopyToClipboard

From a3484240c11a839bcf59301add8e97e22c384b1c Mon Sep 17 00:00:00 2001
From: Paul Wackerow <54227730+wackerow@users.noreply.github.com>
Date: Fri, 6 Jun 2025 16:41:05 -0700
Subject: [PATCH 02/11] feat: speedrun to top, add quickstarts

---
 app/[locale]/developers/page.tsx | 94 ++++++++++++++++++++++++--------
 1 file changed, 70 insertions(+), 24 deletions(-)

diff --git a/app/[locale]/developers/page.tsx b/app/[locale]/developers/page.tsx
index fbfacae25e5..249ea01c2af 100644
--- a/app/[locale]/developers/page.tsx
+++ b/app/[locale]/developers/page.tsx
@@ -5,13 +5,15 @@ import { Lang } from "@/lib/types"
 import { ChildOnlyProp } from "@/lib/types"
 
 import CalloutSSR from "@/components/CalloutSSR"
-import Card from "@/components/Card"
+import OldCard from "@/components/Card"
+import { CopyButton } from "@/components/CopyToClipboard"
 import FeedbackCard from "@/components/FeedbackCard"
 import HubHero from "@/components/Hero/HubHero"
 import { Image } from "@/components/Image"
 import MainArticle from "@/components/MainArticle"
 import { ButtonLink } from "@/components/ui/buttons/Button"
-import { Flex, Stack, VStack } from "@/components/ui/flex"
+import { Card } from "@/components/ui/card"
+import { Flex, VStack } from "@/components/ui/flex"
 import InlineLink from "@/components/ui/Link"
 
 import { cn } from "@/lib/utils/cn"
@@ -131,6 +133,17 @@ const DevelopersPage = async ({
     },
   ]
 
+  const quickstarts = [
+    {
+      description: "Quickstart a smart contract",
+      command: "npx create-eth@latest",
+    },
+    {
+      description: "Quickstart a wallet-enabled front end",
+      command: "npm init @rainbow-me/rainbowkit@latest",
+    },
+  ]
+
   return (
     <Page>
       <HubHero
@@ -143,9 +156,62 @@ const DevelopersPage = async ({
       />
       <Content>
         <MonoSubtitle>{t("page-developers-get-started")}</MonoSubtitle>
+
+        <div className="grid grid-cols-1 gap-6 md:grid-cols-2 md:gap-8 xl:mb-12">
+          <div
+            className="relative h-[450px]"
+            data-label="speedrunethereum-banner"
+          >
+            <Image
+              className="pointer-events-none absolute -z-[1] h-full rounded-t-2xl"
+              src={SpeedRunEthereumImage}
+              alt="SpeedRunEthereum banner"
+              sizes="100vw"
+              style={{ width: "100vw", objectFit: "cover" }}
+            />
+            <div className="z-[1] space-y-4 break-words p-6 md:space-y-6 lg:p-12">
+              <h3>Start experimenting</h3>
+              <p>
+                Hands-on challenges such as building NFTs, DEXs in a
+                step-by-step tutorial series.
+              </p>
+              <ButtonLink
+                href="https://speedrunethereum.com/"
+                size="lg"
+                className="mt-4"
+              >
+                {t("page-developers-speedrunethereum-link")}
+              </ButtonLink>
+            </div>
+          </div>
+
+          <Card className="!space-y-8 break-words border border-accent-c/20 bg-gradient-to-t from-accent-c/15 to-accent-c/5 p-6 md:space-y-6 lg:p-12">
+            <h3>Jump right into the code</h3>
+            <div className="space-y-6">
+              {quickstarts.map(({ description, command }) => (
+                <div key={command} className="space-y-1">
+                  <div className="font-bold">{description}</div>
+                  <div className="flex items-center rounded-lg border bg-background px-3 py-1">
+                    <div className="flex-1 font-mono text-sm">{command}</div>
+                    <CopyButton message={command} size="sm" />
+                  </div>
+                </div>
+              ))}
+            </div>
+            <div>
+              <ButtonLink
+                href="https://docs.soliditylang.org/en/latest/"
+                variant="outline"
+                className="bg-background"
+              >
+                Read the Solidity docs
+              </ButtonLink>
+            </div>
+          </Card>
+        </div>
         <div className="-mx-4 mb-12 mt-8 grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4">
           {paths.map((path, idx) => (
-            <Card
+            <OldCard
               className={`m-4 p-6 shadow-[0px_1px_3px_rgba(0,0,0,0.1)] transition-transform duration-100 hover:scale-105 hover:rounded hover:bg-background-highlight hover:shadow-[0px_8px_17px_rgba(0,0,0,0.15)] dark:shadow-[0px_1px_3px_rgba(60,60,60,0.1)]`}
               key={idx}
               emoji={path.emoji}
@@ -153,30 +219,10 @@ const DevelopersPage = async ({
               description={path.description}
             >
               <ButtonLink href={path.url}>{path.button}</ButtonLink>
-            </Card>
+            </OldCard>
           ))}
         </div>
 
-        <div className="relative xl:mb-12" data-label="speedrunethereum-banner">
-          <Image
-            className="h-[450px] xl:h-auto"
-            src={SpeedRunEthereumImage}
-            alt="SpeedRunEthereum banner"
-            sizes="100vw"
-            style={{
-              width: "100vw",
-              objectFit: "cover",
-              objectPosition: "20%",
-            }}
-          />
-          <Stack className="absolute top-0 max-w-lg items-start space-y-3 break-words p-6 md:top-12 md:ms-8 md:space-y-4 lg:p-8 xl:max-w-xl">
-            <h2>{t("page-developers-speedrunethereum-title")}</h2>
-            <ButtonLink href="https://speedrunethereum.com/">
-              {t("page-developers-speedrunethereum-link")}
-            </ButtonLink>
-          </Stack>
-        </div>
-
         <TwoColumnContent>
           <IntroColumn>
             <H2>{t("page-developers-about")}</H2>

From 78e2ff0f86f180d33fd0bad404e3ccd981630475 Mon Sep 17 00:00:00 2001
From: Paul Wackerow <54227730+wackerow@users.noreply.github.com>
Date: Fri, 6 Jun 2025 16:47:20 -0700
Subject: [PATCH 03/11] intl: extract strings

---
 app/[locale]/developers/page.tsx       | 13 +++++--------
 src/intl/en/page-developers-index.json |  5 +++++
 2 files changed, 10 insertions(+), 8 deletions(-)

diff --git a/app/[locale]/developers/page.tsx b/app/[locale]/developers/page.tsx
index 249ea01c2af..a722df95046 100644
--- a/app/[locale]/developers/page.tsx
+++ b/app/[locale]/developers/page.tsx
@@ -135,11 +135,11 @@ const DevelopersPage = async ({
 
   const quickstarts = [
     {
-      description: "Quickstart a smart contract",
+      description: t("page-developers-quickstart-2-description"),
       command: "npx create-eth@latest",
     },
     {
-      description: "Quickstart a wallet-enabled front end",
+      description: t("page-developers-quickstart-2-description"),
       command: "npm init @rainbow-me/rainbowkit@latest",
     },
   ]
@@ -170,11 +170,8 @@ const DevelopersPage = async ({
               style={{ width: "100vw", objectFit: "cover" }}
             />
             <div className="z-[1] space-y-4 break-words p-6 md:space-y-6 lg:p-12">
-              <h3>Start experimenting</h3>
-              <p>
-                Hands-on challenges such as building NFTs, DEXs in a
-                step-by-step tutorial series.
-              </p>
+              <h3>{t("page-developers-start-experimenting")}</h3>
+              <p>{t("page-developers-speedrunethereum-description")}</p>
               <ButtonLink
                 href="https://speedrunethereum.com/"
                 size="lg"
@@ -186,7 +183,7 @@ const DevelopersPage = async ({
           </div>
 
           <Card className="!space-y-8 break-words border border-accent-c/20 bg-gradient-to-t from-accent-c/15 to-accent-c/5 p-6 md:space-y-6 lg:p-12">
-            <h3>Jump right into the code</h3>
+            <h3>{t("page-developers-jump-right-in-title")}</h3>
             <div className="space-y-6">
               {quickstarts.map(({ description, command }) => (
                 <div key={command} className="space-y-1">
diff --git a/src/intl/en/page-developers-index.json b/src/intl/en/page-developers-index.json
index f03059ed36b..dbf68bb2c9d 100644
--- a/src/intl/en/page-developers-index.json
+++ b/src/intl/en/page-developers-index.json
@@ -41,6 +41,7 @@
   "page-developers-intro-stack-desc": "An introduction to the Ethereum stack",
   "page-developers-js-libraries-desc": "Using JavaScript to interact with smart contracts",
   "page-developers-js-libraries-link": "JavaScript libraries",
+  "page-developers-jump-right-in-title": "Jump right into the code",
   "page-developers-language-desc": "Using Ethereum with familiar languages",
   "page-developers-languages": "Programming languages",
   "page-developers-learn": "Learn Ethereum development",
@@ -62,6 +63,8 @@
   "page-developers-oracle-desc": "Getting offchain data into your smart contracts",
   "page-developers-oracles-link": "Oracles",
   "page-developers-play-code": "Play with code",
+  "page-developers-quickstart-1-description": "Quickstart a smart contract",
+  "page-developers-quickstart-2-description": "Quickstart a wallet-enabled front end",
   "page-developers-read-docs": "Read the docs",
   "page-developers-scaling-desc": "Solutions for faster transactions",
   "page-developers-scaling-link": "Scaling",
@@ -72,10 +75,12 @@
   "page-developers-smart-contracts-desc": "The logic behind dapps – self-executing agreements",
   "page-developers-smart-contracts-link": "Smart contracts",
   "page-developers-speedrunethereum-title": "Learn all the most important concepts by building on Ethereum",
+  "page-developers-speedrunethereum-description": "Hands-on challenges such as building NFTs, DEXs in a step-by-step tutorial series.",
   "page-developers-speedrunethereum-link": "SpeedRun Ethereum",
   "page-developers-stack": "The stack",
   "page-developers-start": "Start experimenting",
   "page-developers-start-desc": "Want to experiment first, ask questions later?",
+  "page-developers-start-experimenting": "Start experimenting",
   "page-developers-storage-desc": "How to handle dapp storage",
   "page-developers-storage-link": "Storage",
   "page-developers-subtitle": "A builders manual for Ethereum. By builders, for builders.",

From 65ef3a2fe96beacfb1e7c3a2d90b75d500de5d9e Mon Sep 17 00:00:00 2001
From: Paul Wackerow <54227730+wackerow@users.noreply.github.com>
Date: Fri, 6 Jun 2025 17:11:28 -0700
Subject: [PATCH 04/11] patch: mobile spacing

---
 app/[locale]/developers/page.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/app/[locale]/developers/page.tsx b/app/[locale]/developers/page.tsx
index f6142925a54..b257fc4537a 100644
--- a/app/[locale]/developers/page.tsx
+++ b/app/[locale]/developers/page.tsx
@@ -133,7 +133,7 @@ const DevelopersPage = async ({
               sizes="100vw"
               style={{ width: "100vw", objectFit: "cover" }}
             />
-            <div className="z-[1] space-y-4 break-words p-6 md:space-y-6 lg:p-12">
+            <div className="z-[1] space-y-4 break-words px-6 py-10 md:space-y-6 lg:p-12">
               <h3>{t("page-developers-start-experimenting")}</h3>
               <p>{t("page-developers-speedrunethereum-description")}</p>
               <ButtonLink
@@ -146,7 +146,7 @@ const DevelopersPage = async ({
             </div>
           </div>
 
-          <Card className="!space-y-8 break-words border border-accent-c/20 bg-gradient-to-t from-accent-c/15 to-accent-c/5 p-6 md:space-y-6 lg:p-12">
+          <Card className="!space-y-8 break-words border border-accent-c/20 bg-gradient-to-t from-accent-c/15 to-accent-c/5 px-6 py-10 md:space-y-6 lg:p-12">
             <h3>{t("page-developers-jump-right-in-title")}</h3>
             <div className="space-y-6">
               {quickstarts.map(({ description, command }) => (

From 37e856153b45677493efe75dddf08343a3e390d1 Mon Sep 17 00:00:00 2001
From: Paul Wackerow <54227730+wackerow@users.noreply.github.com>
Date: Fri, 6 Jun 2025 17:22:20 -0700
Subject: [PATCH 05/11] intl: fix two strings

---
 app/[locale]/developers/page.tsx       | 4 ++--
 src/intl/en/page-developers-index.json | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/app/[locale]/developers/page.tsx b/app/[locale]/developers/page.tsx
index b257fc4537a..e6d725c1169 100644
--- a/app/[locale]/developers/page.tsx
+++ b/app/[locale]/developers/page.tsx
@@ -134,7 +134,7 @@ const DevelopersPage = async ({
               style={{ width: "100vw", objectFit: "cover" }}
             />
             <div className="z-[1] space-y-4 break-words px-6 py-10 md:space-y-6 lg:p-12">
-              <h3>{t("page-developers-start-experimenting")}</h3>
+              <h3>{t("page-developers-start")}</h3>
               <p>{t("page-developers-speedrunethereum-description")}</p>
               <ButtonLink
                 href="https://speedrunethereum.com/"
@@ -165,7 +165,7 @@ const DevelopersPage = async ({
                 variant="outline"
                 className="bg-background"
               >
-                Read the Solidity docs
+                {t("page-developers-solidity-docs")}
               </ButtonLink>
             </div>
           </Card>
diff --git a/src/intl/en/page-developers-index.json b/src/intl/en/page-developers-index.json
index dbf68bb2c9d..35f4c78654d 100644
--- a/src/intl/en/page-developers-index.json
+++ b/src/intl/en/page-developers-index.json
@@ -74,13 +74,13 @@
   "page-developers-setup-desc": "Get your stack ready for building by configuring a development environment.",
   "page-developers-smart-contracts-desc": "The logic behind dapps – self-executing agreements",
   "page-developers-smart-contracts-link": "Smart contracts",
+  "page-developers-solidity-docs": "Read the Solidity docs",
   "page-developers-speedrunethereum-title": "Learn all the most important concepts by building on Ethereum",
   "page-developers-speedrunethereum-description": "Hands-on challenges such as building NFTs, DEXs in a step-by-step tutorial series.",
   "page-developers-speedrunethereum-link": "SpeedRun Ethereum",
   "page-developers-stack": "The stack",
   "page-developers-start": "Start experimenting",
   "page-developers-start-desc": "Want to experiment first, ask questions later?",
-  "page-developers-start-experimenting": "Start experimenting",
   "page-developers-storage-desc": "How to handle dapp storage",
   "page-developers-storage-link": "Storage",
   "page-developers-subtitle": "A builders manual for Ethereum. By builders, for builders.",

From 9cbbaa93d589811cbe4a3ceb66bb93638d1e96ce Mon Sep 17 00:00:00 2001
From: Paul Wackerow <54227730+wackerow@users.noreply.github.com>
Date: Fri, 6 Jun 2025 18:00:02 -0700
Subject: [PATCH 06/11] patch: update label, make unique

---
 app/[locale]/developers/page.tsx       | 24 ++++++++++++------------
 src/intl/en/page-developers-index.json |  1 +
 2 files changed, 13 insertions(+), 12 deletions(-)

diff --git a/app/[locale]/developers/page.tsx b/app/[locale]/developers/page.tsx
index e6d725c1169..bf81ae62c0b 100644
--- a/app/[locale]/developers/page.tsx
+++ b/app/[locale]/developers/page.tsx
@@ -65,6 +65,17 @@ const DevelopersPage = async ({
     namespace: "common",
   })
 
+  const quickstarts = [
+    {
+      description: t("page-developers-quickstart-2-description"),
+      command: "npx create-eth@latest",
+    },
+    {
+      description: t("page-developers-quickstart-2-description"),
+      command: "npm init @rainbow-me/rainbowkit@latest",
+    },
+  ]
+
   const paths: DevelopersPath[] = [
     {
       emoji: ":woman_student:",
@@ -82,7 +93,7 @@ const DevelopersPage = async ({
     },
     {
       emoji: ":woman_scientist:",
-      title: t("page-developers-start"),
+      title: t("page-developers-resources"),
       description: t("page-developers-start-desc"),
       url: "/developers/learning-tools/",
       button: t("page-developers-play-code"),
@@ -96,17 +107,6 @@ const DevelopersPage = async ({
     },
   ]
 
-  const quickstarts = [
-    {
-      description: t("page-developers-quickstart-2-description"),
-      command: "npx create-eth@latest",
-    },
-    {
-      description: t("page-developers-quickstart-2-description"),
-      command: "npm init @rainbow-me/rainbowkit@latest",
-    },
-  ]
-
   return (
     <VStack className="mx-auto my-0 w-full">
       <HubHero
diff --git a/src/intl/en/page-developers-index.json b/src/intl/en/page-developers-index.json
index 35f4c78654d..cf4b9da3f74 100644
--- a/src/intl/en/page-developers-index.json
+++ b/src/intl/en/page-developers-index.json
@@ -66,6 +66,7 @@
   "page-developers-quickstart-1-description": "Quickstart a smart contract",
   "page-developers-quickstart-2-description": "Quickstart a wallet-enabled front end",
   "page-developers-read-docs": "Read the docs",
+  "page-developers-resources": "Resources",
   "page-developers-scaling-desc": "Solutions for faster transactions",
   "page-developers-scaling-link": "Scaling",
   "page-developers-smart-contract-security-desc": "Security measures to consider during development of smart contracts",

From 988d3d7ba219d9c4719b2f3e0771816876fe0e19 Mon Sep 17 00:00:00 2001
From: Paul Wackerow <54227730+wackerow@users.noreply.github.com>
Date: Fri, 6 Jun 2025 20:16:24 -0700
Subject: [PATCH 07/11] fix: string key

---
 app/[locale]/developers/page.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/[locale]/developers/page.tsx b/app/[locale]/developers/page.tsx
index bf81ae62c0b..4bf31e28eb7 100644
--- a/app/[locale]/developers/page.tsx
+++ b/app/[locale]/developers/page.tsx
@@ -67,7 +67,7 @@ const DevelopersPage = async ({
 
   const quickstarts = [
     {
-      description: t("page-developers-quickstart-2-description"),
+      description: t("page-developers-quickstart-1-description"),
       command: "npx create-eth@latest",
     },
     {

From df1c4e08e688d39ac9a16a78a20d9caa57132034 Mon Sep 17 00:00:00 2001
From: Jakub <100724231+konopkja@users.noreply.github.com>
Date: Tue, 10 Jun 2025 12:46:40 +0200
Subject: [PATCH 08/11] Update page-developers-index.json

---
 src/intl/en/page-developers-index.json | 9 ++++-----
 1 file changed, 4 insertions(+), 5 deletions(-)

diff --git a/src/intl/en/page-developers-index.json b/src/intl/en/page-developers-index.json
index cf4b9da3f74..806e0a7cae8 100644
--- a/src/intl/en/page-developers-index.json
+++ b/src/intl/en/page-developers-index.json
@@ -28,7 +28,6 @@
   "page-developers-fundamentals": "Fundamentals",
   "page-developers-gas-desc": "Ether needed to power transactions",
   "page-developers-gas-link": "Gas",
-  "page-developers-get-started": "How would you like to get started?",
   "page-developers-improve-ethereum": "Help us make ethereum.org better",
   "page-developers-improve-ethereum-desc": "Like ethereum.org, these docs are a community effort. Create a PR if you see mistakes, room for improvement, or new opportunities to help Ethereum developers.",
   "page-developers-into-eth-desc": "An introduction to blockchain and Ethereum",
@@ -41,7 +40,7 @@
   "page-developers-intro-stack-desc": "An introduction to the Ethereum stack",
   "page-developers-js-libraries-desc": "Using JavaScript to interact with smart contracts",
   "page-developers-js-libraries-link": "JavaScript libraries",
-  "page-developers-jump-right-in-title": "Jump right into the code",
+  "page-developers-jump-right-in-title": "Quickstart",
   "page-developers-language-desc": "Using Ethereum with familiar languages",
   "page-developers-languages": "Programming languages",
   "page-developers-learn": "Learn Ethereum development",
@@ -63,8 +62,8 @@
   "page-developers-oracle-desc": "Getting offchain data into your smart contracts",
   "page-developers-oracles-link": "Oracles",
   "page-developers-play-code": "Play with code",
-  "page-developers-quickstart-1-description": "Quickstart a smart contract",
-  "page-developers-quickstart-2-description": "Quickstart a wallet-enabled front end",
+  "page-developers-quickstart-1-description": "Smart contract",
+  "page-developers-quickstart-2-description": "A wallet-enabled front end",
   "page-developers-read-docs": "Read the docs",
   "page-developers-resources": "Resources",
   "page-developers-scaling-desc": "Solutions for faster transactions",
@@ -80,7 +79,7 @@
   "page-developers-speedrunethereum-description": "Hands-on challenges such as building NFTs, DEXs in a step-by-step tutorial series.",
   "page-developers-speedrunethereum-link": "SpeedRun Ethereum",
   "page-developers-stack": "The stack",
-  "page-developers-start": "Start experimenting",
+  "page-developers-start": "Start with guided challenges",
   "page-developers-start-desc": "Want to experiment first, ask questions later?",
   "page-developers-storage-desc": "How to handle dapp storage",
   "page-developers-storage-link": "Storage",

From a89beb91a385575dee63c47b6bde81d25a30af89 Mon Sep 17 00:00:00 2001
From: Jakub <100724231+konopkja@users.noreply.github.com>
Date: Tue, 10 Jun 2025 13:00:39 +0200
Subject: [PATCH 09/11] Update page-developers-index.json

---
 src/intl/en/page-developers-index.json | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/intl/en/page-developers-index.json b/src/intl/en/page-developers-index.json
index 806e0a7cae8..230060777f3 100644
--- a/src/intl/en/page-developers-index.json
+++ b/src/intl/en/page-developers-index.json
@@ -28,6 +28,7 @@
   "page-developers-fundamentals": "Fundamentals",
   "page-developers-gas-desc": "Ether needed to power transactions",
   "page-developers-gas-link": "Gas",
+  "page-developers-get-started": "Experiment with Ethereum",
   "page-developers-improve-ethereum": "Help us make ethereum.org better",
   "page-developers-improve-ethereum-desc": "Like ethereum.org, these docs are a community effort. Create a PR if you see mistakes, room for improvement, or new opportunities to help Ethereum developers.",
   "page-developers-into-eth-desc": "An introduction to blockchain and Ethereum",

From 800b8987f4e19c89370c9da1662252031257ab65 Mon Sep 17 00:00:00 2001
From: Paul Wackerow <54227730+wackerow@users.noreply.github.com>
Date: Tue, 10 Jun 2025 09:44:40 -0700
Subject: [PATCH 10/11] feat: add top_boxes custom events

---
 app/[locale]/developers/page.tsx | 24 ++++++++++++++++++++++--
 1 file changed, 22 insertions(+), 2 deletions(-)

diff --git a/app/[locale]/developers/page.tsx b/app/[locale]/developers/page.tsx
index 4bf31e28eb7..b6547b31291 100644
--- a/app/[locale]/developers/page.tsx
+++ b/app/[locale]/developers/page.tsx
@@ -69,10 +69,12 @@ const DevelopersPage = async ({
     {
       description: t("page-developers-quickstart-1-description"),
       command: "npx create-eth@latest",
+      eventName: "scaffold",
     },
     {
       description: t("page-developers-quickstart-2-description"),
       command: "npm init @rainbow-me/rainbowkit@latest",
+      eventName: "rainbowkit",
     },
   ]
 
@@ -140,6 +142,11 @@ const DevelopersPage = async ({
                 href="https://speedrunethereum.com/"
                 size="lg"
                 className="mt-4"
+                customEventOptions={{
+                  eventCategory: "top_boxes",
+                  eventAction: "click",
+                  eventName: "speedrun",
+                }}
               >
                 {t("page-developers-speedrunethereum-link")}
               </ButtonLink>
@@ -149,12 +156,20 @@ const DevelopersPage = async ({
           <Card className="!space-y-8 break-words border border-accent-c/20 bg-gradient-to-t from-accent-c/15 to-accent-c/5 px-6 py-10 md:space-y-6 lg:p-12">
             <h3>{t("page-developers-jump-right-in-title")}</h3>
             <div className="space-y-6">
-              {quickstarts.map(({ description, command }) => (
+              {quickstarts.map(({ description, command, eventName }) => (
                 <div key={command} className="space-y-1">
                   <div className="font-bold">{description}</div>
                   <div className="flex items-center rounded-lg border bg-background px-3 py-1">
                     <div className="flex-1 font-mono text-sm">{command}</div>
-                    <CopyButton message={command} size="sm" />
+                    <CopyButton
+                      message={command}
+                      size="sm"
+                      customEventOptions={{
+                        eventCategory: "top_boxes",
+                        eventAction: "click",
+                        eventName,
+                      }}
+                    />
                   </div>
                 </div>
               ))}
@@ -164,6 +179,11 @@ const DevelopersPage = async ({
                 href="https://docs.soliditylang.org/en/latest/"
                 variant="outline"
                 className="bg-background"
+                customEventOptions={{
+                  eventCategory: "top_boxes",
+                  eventAction: "click",
+                  eventName: "solidity",
+                }}
               >
                 {t("page-developers-solidity-docs")}
               </ButtonLink>

From f4b41b1083786e3a5cda71d007ab0100bf8cb4e2 Mon Sep 17 00:00:00 2001
From: Paul Wackerow <54227730+wackerow@users.noreply.github.com>
Date: Tue, 10 Jun 2025 11:24:28 -0700
Subject: [PATCH 11/11] chore: update copy

---
 app/[locale]/developers/page.tsx       | 60 ++++++++++++--------------
 src/intl/en/page-developers-index.json |  6 +--
 2 files changed, 30 insertions(+), 36 deletions(-)

diff --git a/app/[locale]/developers/page.tsx b/app/[locale]/developers/page.tsx
index b6547b31291..25203069135 100644
--- a/app/[locale]/developers/page.tsx
+++ b/app/[locale]/developers/page.tsx
@@ -14,6 +14,7 @@ import MainArticle from "@/components/MainArticle"
 import { ButtonLink } from "@/components/ui/buttons/Button"
 import { Card } from "@/components/ui/card"
 import { VStack } from "@/components/ui/flex"
+import Link from "@/components/ui/Link"
 import InlineLink from "@/components/ui/Link"
 
 import { getMetadata } from "@/lib/utils/metadata"
@@ -65,19 +66,6 @@ const DevelopersPage = async ({
     namespace: "common",
   })
 
-  const quickstarts = [
-    {
-      description: t("page-developers-quickstart-1-description"),
-      command: "npx create-eth@latest",
-      eventName: "scaffold",
-    },
-    {
-      description: t("page-developers-quickstart-2-description"),
-      command: "npm init @rainbow-me/rainbowkit@latest",
-      eventName: "rainbowkit",
-    },
-  ]
-
   const paths: DevelopersPath[] = [
     {
       emoji: ":woman_student:",
@@ -156,29 +144,35 @@ const DevelopersPage = async ({
           <Card className="!space-y-8 break-words border border-accent-c/20 bg-gradient-to-t from-accent-c/15 to-accent-c/5 px-6 py-10 md:space-y-6 lg:p-12">
             <h3>{t("page-developers-jump-right-in-title")}</h3>
             <div className="space-y-6">
-              {quickstarts.map(({ description, command, eventName }) => (
-                <div key={command} className="space-y-1">
-                  <div className="font-bold">{description}</div>
-                  <div className="flex items-center rounded-lg border bg-background px-3 py-1">
-                    <div className="flex-1 font-mono text-sm">{command}</div>
-                    <CopyButton
-                      message={command}
-                      size="sm"
-                      customEventOptions={{
-                        eventCategory: "top_boxes",
-                        eventAction: "click",
-                        eventName,
-                      }}
-                    />
-                  </div>
+              <div className="space-y-1">
+                <p className="font-bold">Scaffold-ETH 2</p>
+                <p className="text-sm text-body-medium">
+                  {t("page-developers-quickstart-scaffold-subtext")}{" "}
+                  <Link href="https://docs.scaffoldeth.io/">
+                    {t("page-developers-quickstart-scaffold-docs")}
+                  </Link>
+                </p>
+                <div className="flex items-center rounded-lg border bg-background px-3 py-1">
+                  <span className="flex-1 font-mono text-sm">
+                    npx create-eth@latest
+                  </span>
+                  <CopyButton
+                    message="npx create-eth@latest"
+                    size="sm"
+                    customEventOptions={{
+                      eventCategory: "top_boxes",
+                      eventAction: "click",
+                      eventName: "scaffold",
+                    }}
+                  />
                 </div>
-              ))}
+              </div>
             </div>
+
             <div>
-              <ButtonLink
+              <p className="mb-2 font-bold">Need to learn the language?</p>
+              <Link
                 href="https://docs.soliditylang.org/en/latest/"
-                variant="outline"
-                className="bg-background"
                 customEventOptions={{
                   eventCategory: "top_boxes",
                   eventAction: "click",
@@ -186,7 +180,7 @@ const DevelopersPage = async ({
                 }}
               >
                 {t("page-developers-solidity-docs")}
-              </ButtonLink>
+              </Link>
             </div>
           </Card>
         </div>
diff --git a/src/intl/en/page-developers-index.json b/src/intl/en/page-developers-index.json
index 230060777f3..524d5fb7694 100644
--- a/src/intl/en/page-developers-index.json
+++ b/src/intl/en/page-developers-index.json
@@ -41,7 +41,7 @@
   "page-developers-intro-stack-desc": "An introduction to the Ethereum stack",
   "page-developers-js-libraries-desc": "Using JavaScript to interact with smart contracts",
   "page-developers-js-libraries-link": "JavaScript libraries",
-  "page-developers-jump-right-in-title": "Quickstart",
+  "page-developers-jump-right-in-title": "Quickstart your idea",
   "page-developers-language-desc": "Using Ethereum with familiar languages",
   "page-developers-languages": "Programming languages",
   "page-developers-learn": "Learn Ethereum development",
@@ -63,8 +63,8 @@
   "page-developers-oracle-desc": "Getting offchain data into your smart contracts",
   "page-developers-oracles-link": "Oracles",
   "page-developers-play-code": "Play with code",
-  "page-developers-quickstart-1-description": "Smart contract",
-  "page-developers-quickstart-2-description": "A wallet-enabled front end",
+  "page-developers-quickstart-scaffold-subtext": "Bootstrap your Ethereum app stack in seconds.",
+  "page-developers-quickstart-scaffold-docs": "Read Scaffold-ETH 2 docs",
   "page-developers-read-docs": "Read the docs",
   "page-developers-resources": "Resources",
   "page-developers-scaling-desc": "Solutions for faster transactions",