Hacktoberfest 2026: the issues maintainers tagged for October, open and beginner-friendly. Browse Hacktoberfest issues

Translate the interface (i18n foundation)

Open
  • Is something wrong?
#29 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Assessment

Difficulty
5/5
Estimated time
Over a week
Newbie friendliness
25/100
Issue type
Feature
Clarity
Clearly specified
Activity status
Active
Tech stack
javascript, next.js
Domain
internationalization

Research direction

Start by checking frontend/package.json to identify the Next.js version, then read the pages and components under frontend/pages/ and frontend/components/ for core-loop text. Choose a compatible i18n library and explain the choice in the pull request. Done means English plus one complete second language, locale-aware formatting and language selection, passing npm test, npm run lint and node scripts/check-boundary.js, with battle-page screenshots in both languages.

Written by the indexing model from the issue text.

Description

enhancement help wanted

All interface text is hard-coded English across frontend/pages/ and frontend/components/. Competitive programming communities are huge in India, Brazil, China, Korea, Vietnam and Eastern Europe, and a translated interface opens CodeArena to them.

Phase 1, the foundation (this issue)

  • Add an i18n library that works with the Next.js version in frontend/package.json. Explain the choice in the pull request.
  • Move strings for the core loop into message files: home, login and register, practice, problem page, matchmaking, battle and results. Other pages can follow in later pull requests.
  • Language picker in settings and the footer, remembered per player. Default from the browser's language.
  • Format numbers, dates and times with the player's locale.
  • Problem statements stay in English for now. Translating problems is a separate design question.

Rules

  • No string concatenation for sentences. Use the library's interpolation and plural rules, since word order and plurals differ by language.
  • A lint check or test that fails when a core-loop page renders a hard-coded English string.
  • Missing translations fall back to English, never to a key name.

Definition of done

  • English extracted for the pages above, plus one complete second language from a fluent speaker.
  • Screenshots of the battle page in both languages, including a long-text language to catch layout overflow.
  • npm test, npm run lint and node scripts/check-boundary.js pass.

Translators: once phase 1 lands, comment here with the language you want to take.

Dominant language
JavaScript
Stars
0
Forks
2
No merged PRs in 30d

Getting set up

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from sennaicodes/codearena

All issues in sennaicodes/codearena

Similar issues

More JavaScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.