feat: redesigned home page with esp and updated downloads page #7875

ovflowd · 2025-06-17T23:24:03Z

This PR updates the Home Page with redesigned/simplified CTAs and updated the Download Page (and Release Modal) with unified EOL and LTS CTAs.

Closes #7773 (comment)

vercel · 2025-06-17T23:24:08Z

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Updated (UTC)
nodejs-org	✅ Ready (Inspect)	Visit Preview	Jun 19, 2025 0:04am

github-actions · 2025-06-17T23:24:18Z

Note

Your Pull Request seems to be updating Translations of the Node.js Website.

Whilst we appreciate your intent; Any Translation update should be done through our Crowdin Project.
We recommend giving a read on our Translation Guidelines.

Thank you!

github-actions · 2025-06-17T23:24:39Z

Lighthouse Results

URL	Performance	Accessibility	Best Practices	SEO	Report
/en	🟢 100	🟢 100	🟢 100	🟢 91	🔗
/en/about	🟢 100	🟢 96	🟢 100	🟠 82	🔗
/en/about/previous-releases	🟢 98	🟢 96	🟢 100	🟠 83	🔗
/en/download	🟢 98	🟢 100	🟢 100	🟢 91	🔗
/en/blog	🟢 100	🟢 100	🟢 96	🟢 92	🔗

codecov · 2025-06-17T23:25:47Z

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 75.45%. Comparing base (f137f85) to head (9698046).
Report is 4 commits behind head on main.

✅ All tests successful. No failed tests found.

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #7875      +/-   ##
==========================================
- Coverage   75.46%   75.45%   -0.02%     
==========================================
  Files         101      101              
  Lines        8306     8306              
  Branches      218      218              
==========================================
- Hits         6268     6267       -1     
- Misses       2036     2037       +1     
  Partials        2        2

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

MattIPv4 · 2025-06-17T23:47:52Z

You might want a leading-tight (I think that's the right Tailwind class) on the support button as a whole, otherwise the xs line is still using the regular line height? And I'm still not sure about small text being bold :P

Hover state for the support button in dark mode might need looking at now that it has the transparent bg?

MattIPv4 · 2025-06-17T23:49:26Z

And then less of a design nit, but a general UX question, should this support button have an external link indicator? The links in the nav have it when they're external, so I could see it being a point of confusion that this then doesn't but is external? (It also doesn't open in a new tab like the nav external links)

MattIPv4 · 2025-06-17T23:50:35Z

apps/site/pages/en/index.mdx

+
+      <Button kind="primary" className="!block dark:!hidden w-100" href="/download">Install Node.js</Button>
+
+      <Button kind="secondary" className="!hidden dark:!block w-100" href="https://www.herodevs.com/support/node-nes">


This will need UTM params I imagine?

IDK what the campaign link should be 🤷

@joeeames what UTM params would you like for the homepage?

Bump, @joeeames

MattIPv4 · 2025-06-17T23:50:42Z

apps/site/pages/en/index.mdx

+        <small className="text-xs!">for Node.js 18 and below</small>
+      </Button>
+
+      <Button kind="neutral" className="!block dark:!hidden w-100" href="https://www.herodevs.com/support/node-nes">


Ditto, UTM params?

MattIPv4

Otherwise, this LGTM once we know what UTMs are needed

apps/site/pages/en/index.mdx

packages/i18n/locales/en.json

Copilot

Pull Request Overview

This PR redesigns the home page and updates the download page (including the release modal) by simplifying CTAs and unifying messaging for EOL and LTS Node.js releases. Key changes include updates to UI component styles (e.g., BaseButton), modifications to localized error and alert messages, and adjustments in navigation logic for Node.js version selection.

Reviewed Changes

Copilot reviewed 19 out of 19 changed files in this pull request and generated no comments.

Show a summary per file

File	Description
packages/ui-components/Common/BaseButton/index.module.css	Updated styling for secondary buttons with added border properties and color adjustments.
packages/i18n/locales/en.json	Revised warning text and added a notice for LTS version features.
apps/site/pages/*/index.mdx (multiple locales)	Removed legacy home pages for various locales while updating the English version with a new button group.
apps/site/layouts/layouts.module.css	Adjusted max-width and text color styles to support the new design.
apps/site/layouts/GlowingBackdrop.tsx	Minor update: added a line break for clarity.
apps/site/components/Downloads/ReleaseModal/index.tsx	Converted plain translations to rich translations to embed links in alert messages.
apps/site/components/Downloads/Release/VersionDropdown.tsx	Updated version selection logic to redirect depending on the release status and route.
apps/site/components/Downloads/Release/ReleaseCodeBox.tsx	Added an extra LTS alert box with a rich translation for better user guidance.

Comments suppressed due to low confidence (1)

apps/site/components/Downloads/Release/VersionDropdown.tsx:38

The variable 'release' declared here shadows the outer 'release' from context, which could lead to confusion. Consider renaming it to something like 'selectedRelease' to improve clarity.

);

MattIPv4 · 2025-06-19T00:06:44Z

apps/site/pages/en/index.mdx

+
+      <Button kind="primary" className="!block dark:!hidden" href="/download">Install Node.js</Button>
+
+      <Button kind="secondary" className="!block" href="https://www.herodevs.com/support/node-nes">


Suggested change

<Button kind="secondary" className="!block" href="https://www.herodevs.com/support/node-nes">

<Button kind="secondary" className="!block" href="https://www.herodevs.com/support/node-nes?utm_source=NodeJS+&utm_medium=Link&utm_campaign=Homepage_button">

Unless we hear otherwise from @joeeames, let's roll with these UTMs?

avivkeller

One comment, then LGTM

avivkeller · 2025-06-19T01:09:11Z

packages/i18n/locales/en.json

@@ -168,7 +168,8 @@
      "overview": "Overview",
      "minorVersions": "Minor versions",
      "releaseAnnouncement": "Release Announcement",
-      "unsupportedVersionWarning": "This version is out of maintenance. Please use a currently supported version."
+      "unsupportedVersionWarning": "This version is out of maintenance. Please use a currently supported version. <link>Understand EOL support.</link>",
+      "ltsVersionFeaturesNotice": "Want new features sooner? Get the <link>latest Node.js version</link> instead and try the latest improvements on Node!"


IIRC "Node" shouldn't be used to describe the project.

Suggested change

"ltsVersionFeaturesNotice": "Want new features sooner? Get the <link>latest Node.js version</link> instead and try the latest improvements on Node!"

"ltsVersionFeaturesNotice": "Want new features sooner? Get the <link>latest Node.js version</link> instead and try the latest improvements!"

It's a forbidden term (lint-wise) in core

feat: redesigned home page with esp and updated downloads page

d4ec23a

Copilot AI review requested due to automatic review settings June 17, 2025 23:24

ovflowd requested a review from a team as a code owner June 17, 2025 23:24

ovflowd added the github_actions:pull-request Trigger Pull Request Checks label Jun 17, 2025

ovflowd deployed to Storybook June 17, 2025 23:24 — with GitHub Actions View deployment

github-actions bot removed the github_actions:pull-request Trigger Pull Request Checks label Jun 17, 2025

This comment was marked as outdated.

Sign in to view

This comment was marked as resolved.

Sign in to view

chore: code review from copilot

b75b0e5

This comment was marked as resolved.

Sign in to view

chore: design review

bf4adf9

This comment was marked as resolved.

Sign in to view

vercel bot deployed to Preview June 17, 2025 23:40 View deployment

chore: font-size review

3a145f9

ovflowd added the github_actions:pull-request Trigger Pull Request Checks label Jun 17, 2025

ovflowd deployed to Storybook June 17, 2025 23:42 — with GitHub Actions View deployment

github-actions bot removed the github_actions:pull-request Trigger Pull Request Checks label Jun 17, 2025

vercel bot deployed to Preview June 17, 2025 23:43 View deployment

ovflowd requested a review from Copilot June 17, 2025 23:46

This comment was marked as outdated.

Sign in to view

MattIPv4 reviewed Jun 17, 2025

View reviewed changes

vercel bot deployed to Preview June 18, 2025 21:51 View deployment

This comment was marked as resolved.

Sign in to view

chore: adjust buttons

a78d5e7

This comment was marked as resolved.

Sign in to view

vercel bot deployed to Preview June 18, 2025 21:59 View deployment

ovflowd added the github_actions:pull-request Trigger Pull Request Checks label Jun 18, 2025

ovflowd deployed to Storybook June 18, 2025 21:59 — with GitHub Actions View deployment

github-actions bot removed the github_actions:pull-request Trigger Pull Request Checks label Jun 18, 2025

MattIPv4 reviewed Jun 18, 2025

View reviewed changes

apps/site/pages/en/index.mdx Outdated Show resolved Hide resolved

packages/i18n/locales/en.json Outdated Show resolved Hide resolved

packages/i18n/locales/en.json Outdated Show resolved Hide resolved

chore: applied code review

4bdbbe6

vercel bot deployed to Preview June 18, 2025 23:33 View deployment

fix: button on all variants

bf6ce41

vercel bot deployed to Preview June 18, 2025 23:40 View deployment

ovflowd added the github_actions:pull-request Trigger Pull Request Checks label Jun 18, 2025

ovflowd deployed to Storybook June 18, 2025 23:57 — with GitHub Actions View deployment

github-actions bot removed the github_actions:pull-request Trigger Pull Request Checks label Jun 18, 2025

ovflowd added 2 commits June 19, 2025 02:02

fix: display block

75d2873

fix: forgot !

9698046

ovflowd requested review from ljharb, MattIPv4, Copilot and avivkeller June 19, 2025 00:03

Copilot AI reviewed Jun 19, 2025

View reviewed changes

vercel bot deployed to Preview June 19, 2025 00:04 View deployment

MattIPv4 reviewed Jun 19, 2025

View reviewed changes

MattIPv4 approved these changes Jun 19, 2025

View reviewed changes

avivkeller approved these changes Jun 19, 2025

View reviewed changes

ovflowd added the github_actions:pull-request Trigger Pull Request Checks label Jun 19, 2025

ovflowd deployed to Storybook June 19, 2025 01:11 — with GitHub Actions View deployment

github-actions bot removed the github_actions:pull-request Trigger Pull Request Checks label Jun 19, 2025


		<Button kind="primary" className="!block dark:!hidden w-100" href="/download">Install Node.js</Button>

		<Button kind="secondary" className="!hidden dark:!block w-100" href="https://www.herodevs.com/support/node-nes">


		<Button kind="primary" className="!block dark:!hidden" href="/download">Install Node.js</Button>

		<Button kind="secondary" className="!block" href="https://www.herodevs.com/support/node-nes">

	"ltsVersionFeaturesNotice": "Want new features sooner? Get the <link>latest Node.js version</link> instead and try the latest improvements on Node!"
	"ltsVersionFeaturesNotice": "Want new features sooner? Get the <link>latest Node.js version</link> instead and try the latest improvements!"

Uh oh!

feat: redesigned home page with esp and updated downloads page #7875

Are you sure you want to change the base?

feat: redesigned home page with esp and updated downloads page #7875

Conversation

ovflowd commented Jun 17, 2025

Uh oh!

vercel bot commented Jun 17, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

github-actions bot commented Jun 17, 2025

Uh oh!

github-actions bot commented Jun 17, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

This comment was marked as outdated.

Uh oh!

codecov bot commented Jun 17, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Codecov Report

Uh oh!

This comment was marked as resolved.

Uh oh!

This comment was marked as resolved.

This comment was marked as resolved.

This comment was marked as resolved.

This comment was marked as resolved.

This comment was marked as resolved.

MattIPv4 commented Jun 17, 2025

Uh oh!

This comment was marked as outdated.

Uh oh!

MattIPv4 commented Jun 17, 2025

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

This comment was marked as resolved.

This comment was marked as resolved.

MattIPv4 left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull Request Overview

Reviewed Changes

Uh oh!

Choose a reason for hiding this comment

Uh oh!

avivkeller left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

vercel bot commented Jun 17, 2025 •

edited

Loading

github-actions bot commented Jun 17, 2025 •

edited

Loading

codecov bot commented Jun 17, 2025 •

edited

Loading