Merge branch 'dev' into setupRoadmapTranslation

Author: wackerow

.all-contributorsrc

@@ -11267,7 +11267,7 @@
       "login": "konopkja",
       "name": "Jakub",
       "avatar_url": "https://avatars.githubusercontent.com/u/100724231?v=4",
-      "profile": "http://ethereum.org",
+      "profile": "https://ethereum.org",
       "contributions": [
         "doc",
         "content",

README.md

@@ -1778,7 +1778,7 @@ Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/d
     </tr>
     <tr>
       <td align="center" valign="top" width="14.28%"><a href="https://github.com/enjoyooor"><img src="https://avatars.githubusercontent.com/u/147568088?v=4?s=100" width="100px;" alt="enjoyooor"/><br /><sub><b>enjoyooor</b></sub></a><br /><a href="https://github.com/ethereum/ethereum-org-website/commits?author=enjoyooor" title="Code">💻</a></td>
-      <td align="center" valign="top" width="14.28%"><a href="http://ethereum.org"><img src="https://avatars.githubusercontent.com/u/100724231?v=4?s=100" width="100px;" alt="Jakub"/><br /><sub><b>Jakub</b></sub></a><br /><a href="https://github.com/ethereum/ethereum-org-website/commits?author=konopkja" title="Documentation">📖</a> <a href="#content-konopkja" title="Content">🖋</a> <a href="#design-konopkja" title="Design">🎨</a></td>
+      <td align="center" valign="top" width="14.28%"><a href="https://ethereum.org"><img src="https://avatars.githubusercontent.com/u/100724231?v=4?s=100" width="100px;" alt="Jakub"/><br /><sub><b>Jakub</b></sub></a><br /><a href="https://github.com/ethereum/ethereum-org-website/commits?author=konopkja" title="Documentation">📖</a> <a href="#content-konopkja" title="Content">🖋</a> <a href="#design-konopkja" title="Design">🎨</a></td>
       <td align="center" valign="top" width="14.28%"><a href="http://www.ymusleh.com"><img src="https://avatars.githubusercontent.com/u/6829768?v=4?s=100" width="100px;" alt="Yusuf Musleh"/><br /><sub><b>Yusuf Musleh</b></sub></a><br /><a href="#content-yusuf-musleh" title="Content">🖋</a></td>
       <td align="center" valign="top" width="14.28%"><a href="https://github.com/acceptacross"><img src="https://avatars.githubusercontent.com/u/150119116?v=4?s=100" width="100px;" alt="acceptacross"/><br /><sub><b>acceptacross</b></sub></a><br /><a href="https://github.com/ethereum/ethereum-org-website/commits?author=acceptacross" title="Documentation">📖</a></td>
       <td align="center" valign="top" width="14.28%"><a href="https://github.com/pdelagrave"><img src="https://avatars.githubusercontent.com/u/17990895?v=4?s=100" width="100px;" alt="Pierre Delagrave"/><br /><sub><b>Pierre Delagrave</b></sub></a><br /><a href="https://github.com/ethereum/ethereum-org-website/issues?q=author%3Apdelagrave" title="Bug reports">🐛</a></td>

app/[locale]/apps/[application]/page.tsx

@@ -265,7 +265,7 @@ const Page = async ({
                           </p>
                           <LinkOverlay
                             href={`/apps/${slugify(nextApp.name)}`}
-                            matomoEvent={{
+                            customEventOptions={{
                               eventCategory: "detail",
                               eventAction: `app name ${app.name}`,
                               eventName: "see_next",
@@ -292,7 +292,7 @@ const Page = async ({
                   </p>
                   <LinkOverlay
                     href={`/apps/${slugify(nextApp.name)}`}
-                    matomoEvent={{
+                    customEventOptions={{
                       eventCategory: "detail",
                       eventAction: `app name ${app.name}`,
                       eventName: "see_next",

app/[locale]/apps/_components/AppCard.tsx

@@ -99,7 +99,7 @@ const AppCard = ({
       <LinkOverlay
         href={`/apps/${slugify(app.name)}`}
         className="no-underline"
-        matomoEvent={{
+        customEventOptions={{
           eventCategory: matomoCategory,
           eventAction: `${matomoAction}`,
           eventName: `app name ${app.name}`,

app/[locale]/apps/_components/AppsHighlight.tsx

@@ -23,7 +23,7 @@ const AppsHighlight = ({ apps, matomoCategory }: AppsHighlightProps) => {
       <LinkOverlay
         href={`/apps/${slugify(app.name)}`}
         className="no-underline"
-        matomoEvent={{
+        customEventOptions={{
           eventCategory: matomoCategory,
           eventAction: "highlights",
           eventName: `app name ${app.name}`,

app/[locale]/apps/_components/TopApps.tsx

@@ -97,13 +97,11 @@ const TopApps = ({ appsData }: TopAppsProps) => {
                 <LinkOverlay
                   href={`/apps/categories/${slugify(category)}`}
                   className="text-body no-underline"
-                  onClick={() =>
-                    trackCustomEvent({
-                      eventCategory: "apps",
-                      eventAction: "categories",
-                      eventName: `topapps_category_name_${category}`,
-                    })
-                  }
+                  customEventOptions={{
+                    eventCategory: "apps",
+                    eventAction: "categories",
+                    eventName: `topapps_category_name_${category}`,
+                  }}
                 >
                   <div className="flex flex-row items-center justify-between gap-2">
                     <div className="flex items-center gap-2">

app/[locale]/contributing/translation-program/acknowledgements/_components/acknowledgements.tsx

@@ -203,7 +203,7 @@ const TranslatorAcknowledgements = () => {
             {t(
               "page-contributing-translation-program-acknowledgements-how-to-claim-1"
             )}{" "}
-            <InlineLink href="/discord/">
+            <InlineLink href="https://discord.gg/ethereum-org">
               {t(
                 "page-contributing-translation-program-acknowledgements-how-to-claim-1-discord"
               )}

app/[locale]/developers/page.tsx

@@ -1,8 +1,12 @@
+import { Fragment } from "react"
+import { Check } from "lucide-react"
 import { getTranslations } from "next-intl/server"
 
 import type { Lang } from "@/lib/types"
 import { ChildOnlyProp } from "@/lib/types"
 
+import ABTestWrapper from "@/components/AB/TestWrapper"
+import BigNumber from "@/components/BigNumber"
 import { CopyButton } from "@/components/CopyToClipboard"
 import FeedbackCard from "@/components/FeedbackCard"
 import HubHero from "@/components/Hero/HubHero"
@@ -61,6 +65,56 @@ const Scroller = ({
   )
 }
 
+const WhyGrid = () => {
+  const items = [
+    {
+      heading: "Money you can program",
+      description:
+        "Write code that defines how value moves, when, and to whom. No banks, no intermediaries, just logic you define.",
+    },
+    {
+      heading: "Future-proof skills",
+      description:
+        "Learn the building blocks of the next internet. The tech might evolve, but the principles of web3 are here to stay.",
+    },
+    {
+      heading: "Censorship resistance",
+      description:
+        "Build projects and commerce that can't be silenced by governments, corporations, or algorithms. If it matters, it stays online.",
+    },
+    {
+      heading: "Digital sovereignty",
+      description:
+        "Own your identity, assets, and creations online without relying on platforms that can delete you.",
+    },
+  ]
+
+  return (
+    <div
+      className={cn(
+        "rounded-4xl border border-accent-c/20",
+        "grid grid-cols-1 gap-6 p-8 md:grid-cols-2 md:p-14",
+        "bg-gradient-to-b from-accent-c/5 from-[60%] to-accent-c/15"
+      )}
+    >
+      {items.map(({ heading, description }) => (
+        <div className="flex gap-1.5" key={heading}>
+          <div className="my-1 grid h-fit place-items-center rounded-full bg-success/20 p-1">
+            <Check
+              className="size-3 stroke-[4] text-success"
+              strokeLinecap="square"
+              strokeLinejoin="miter"
+            />
+          </div>
+          <div className="space-y-1">
+            <h3 className="text-lg">{heading}</h3>
+            <p className="text-body-medium">{description}</p>
+          </div>
+        </div>
+      ))}
+    </div>
+  )
+}
 const DevelopersPage = async ({
   params,
 }: {
@@ -118,6 +172,68 @@ const DevelopersPage = async ({
           </div>
         </Section>
 
+        <ABTestWrapper
+          testKey="2025-08-why-dev"
+          variants={[
+            <Fragment key="empty" />,
+            <Section
+              key="why-without-metrics"
+              id="why"
+              className={cn(
+                "grid grid-cols-1 gap-6 md:gap-10 lg:grid-cols-2",
+                "-mx-8 w-screen max-w-screen-2xl items-center bg-background-highlight px-8 py-10 md:py-20"
+              )}
+            >
+              <div className="space-y-4">
+                <h2>Create the internet you want to live in</h2>
+                <p>
+                  Ethereum is where you turn ideas into un-censorable systems
+                  that run anywhere, forever. Build apps, money, and communities
+                  that answer to no one but their users.
+                </p>
+              </div>
+              <WhyGrid />
+            </Section>,
+            <Section
+              key="why-with-metrics"
+              id="why"
+              className={cn(
+                "grid grid-cols-1 gap-6 md:gap-10 lg:grid-cols-2",
+                "-mx-8 w-screen max-w-screen-2xl items-center bg-background-highlight px-8 py-10 md:py-20"
+              )}
+            >
+              <div className="space-y-4">
+                <h2>Get paid well. Stay remote. Build the future.</h2>
+                <p>
+                  Over half of blockchain careers are remote-first with some
+                  estimates putting the number as high as 70%.
+                </p>
+                <div className="flex flex-wrap gap-x-6 md:gap-x-8">
+                  <BigNumber
+                    variant="light"
+                    value="$93 - 169K"
+                    sourceName="Glassdoor"
+                    sourceUrl="https://www.glassdoor.com/Salaries/developer-salary-SRCH_KO0%2C9.htm"
+                    lastUpdated="2025-04-10T12:00:00Z"
+                  >
+                    Avg developer salary
+                  </BigNumber>
+                  <BigNumber
+                    variant="light"
+                    value="$80 - 255K"
+                    sourceName="Web3 Jobs"
+                    sourceUrl="https://web3.career/web3-salaries/united-states"
+                    lastUpdated="2025-08-01T12:00:00Z"
+                  >
+                    Avg salary in blockchain industry
+                  </BigNumber>
+                </div>
+              </div>
+              <WhyGrid />
+            </Section>,
+          ]}
+        />
+
         <Section
           id="resources"
           className={cn(

app/[locale]/enterprise/page.tsx

@@ -505,7 +505,9 @@ const Page = async ({ params }: { params: { locale: Lang } }) => {
             strings={{
               error: {
                 domain: t.rich("page-enterprise-team-form-error-domain", {
-                  a: (chunks) => <Link href="/discord/">{chunks}</Link>,
+                  a: (chunks) => (
+                    <Link href="https://discord.gg/ethereum-org">{chunks}</Link>
+                  ),
                 }),
                 emailInvalid: t(
                   "page-enterprise-team-form-error-email-invalid"

app/[locale]/layer-2/learn/_components/learn.tsx

@@ -15,6 +15,7 @@ import { ButtonLink } from "@/components/ui/buttons/Button"
 import useTranslation from "@/hooks/useTranslation"
 import { usePathname } from "@/i18n/routing"
 import Callout2Image from "@/public/images/layer-2/learn-hero.png"
+import heroImg from "@/public/images/layer-2/learn-hero.png"
 import OptimisticRollupImage from "@/public/images/layer-2/optimistic_rollup.png"
 import RollupImage from "@/public/images/layer-2/rollup-2.png"
 import ZKRollupImage from "@/public/images/layer-2/zk_rollup.png"
@@ -31,8 +32,7 @@ const Layer2Learn = ({
 
   const heroProps: ContentHeroProps = {
     breadcrumbs: { slug: pathname, startDepth: 1 },
-    heroImg: "/images/layer-2/learn-hero.png",
-    blurDataURL: "/images/layer-2/learn-hero.png",
+    heroImg,
     title: t("page-layer-2-learn-title"),
     description: t("page-layer-2-learn-description"),
     buttons: [