feature: Add custom branded not-found.tsx page for 404 routes

Offen
#271 2 Kommentare 0 Reaktionen 1 zugewiesene Person Auf GitHub ansehen

Maintainer antworten meist innerhalb von 1 Tag

@sarmad-jalil arbeitet bereits daran.

Seit 25.10.2026.

Bewertung

Dieses Issue wurde noch nicht bewertet.

Beschreibung

beginner friendly easy feature good first issue nextjs ui

When a visitor navigates to an invalid route (e.g. /unknown-path or a broken link), Next.js displays the default unstyled 404 page. DevImpact has UserNotFoundCard for missing developer handles, but lacks a root src/app/not-found.tsx.

Motivation

A branded 404 page keeps visitors on the site, preserves header/footer navigation, and provides clear routes back to the comparison dashboard and leaderboards.

Tasks
  • Create src/app/not-found.tsx using AppHeader and AppFooter.
  • Display BrandLogo and a clean 404 status card.
  • Provide 'Back to Home' and 'Browse Leaderboards' action buttons.
  • Add translation keys notfound.title and notfound.description to en.json and ar.json.
Files to Check
  • src/app/not-found.tsx
  • src/locales/en.json & src/locales/ar.json

[!TIP]
🚀 Want to contribute?
Comment assign me to be automatically assigned to this issue via our GitHub Actions bot. Happy coding! ✨

Vorherrschende Sprache
TypeScript
Sterne
31
Forks
25
Ø Merge
9 Std. 57 Min.
Gemergte PRs (30 T.)
30

Entwicklungsumgebung

Erste Schritte

  1. Lesen Sie das ganze Issue und danach den Beitragsleitfaden des Projekts.
  2. Schreiben Sie ins Issue, dass Sie es übernehmen — das erspart doppelte Arbeit.
  3. Forken Sie das Repository und arbeiten Sie in einem Branch.
  4. Öffnen Sie einen Pull Request, der die Issue-Nummer nennt.

Mehr aus O2sa/DevImpact

Alle Issues in O2sa/DevImpact

Ähnliche Issues

Weitere Issues zu TypeScript

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.