Key Points
Key Takeaways
- 1
GADGET LAB (formerly HonoGear) has officially launched English support.
- 2
Redesigned Astro routing for a /en/ prefix strategy without using heavy frameworks.
- 3
Refactored over 20 core components (`PostLayout`, `Sidebar`, `ReelPlayer`) to be i18n-aware.
- 4
Implemented robust error handling to solve the 403 Forbidden issue in global video distribution.
Hello, World.
Technology knows no borders. The tactile sensation of a great key switch doesn”t change whether you”re typing in Tokyo or San Francisco. A sophisticated React hook solves the same problems in London as it does in Seoul.
For a long time, GADGET LAB (formerly HonoGear) was a Japanese-only blog. We”ve been sharing latest info on AI hardware, ergonomic desk setups, and software engineering, but those insights were confined to an island by the “language barrier.”
Today, that changes.
We are officially launching English support across the entire platform. This is not just a machine-translated mirror site. We”ve completely redesigned the site”s core architecture to truly support a global audience.
The Engineering Challenge: “Not Just Adding t("hello")”
When we decided to “go global,” we underestimated its complexity. We thought, “We just need to add a language switcher button.”
We were wrong.
1. Shift in Architecture
We migrated from a single-locale Astro setup to a prefix-based routing system .
- Before :
/blog/my-keyboard(Always Japanese) - After :
/blog/my-keyboard(Japanese) and/en/blog/my-keyboard(English)
We debated heavily whether to use a dedicated i18n framework like astro-i18next or build a lightweight custom solution. We chose the latter. The reason was performance .
By manually controlling routing and using a simple dictionary-based translation system (useTranslations), we avoided the hydration overhead that comes with heavy i18n libraries. Despite doubling our content surface area, our Lighthouse score still maintains a perfect 100/100 .
2. The Great Component Refactoring
The biggest hurdle was the UI components.
We had over 20 components like PostLayout, Sidebar, ReelPlayer, Tags, and Search, and Japanese was hardcoded into their DNA.
We carried out a “Great Refactoring” and standardized how every component detects the language:
// The standard pattern we adopted
const isEn = Astro.props.isEn || Astro.url.pathname.startsWith("/en");
const t = useTranslations(isEn ? "en" : "ja");
This ensures that whether you are looking at a Product Card or an Error Message , the language perfectly matches the user’s expectation.
3. Video Resilience: The “Pexels 403” Nightmare
While testing the site globally, we faced a major issue: 403 Forbidden errors on video assets.
Even if Japanese users could access cached videos without problems, US users were sometimes blocked by CDN hotlink protection. As a result, the video player (ReelPlayer) would crash, leaving nothing but black void on the screen.
We implemented a robust Video Resilience layer:
- Error Catching : The player catches loading errors (like 403 or 404).
- Fallback UI : Instead of crashing, it displays a localized help message and a “Retry” button.
- Local Hosting : We switched to a strategy of hosting important assets locally (
/public/videos/) to ensure reliable delivery regardless of external CDN policies.
Why This Matters
This expansion is not just about increasing our reach. It’s about raising our own standards .
- For Developers : We can share our technical deep-dives (like this very article!) with the global developer community.
- For Gadget Enthusiasts : We can deliver unbiased, engineering-perspective reviews of latest tech (keyboards, audio, AI hardware) to a worldwide audience.
- For Creators : We can share our “Cinematic Desk Setup” philosophy and video production workflows with creators everywhere.
Experience the Difference
If you”re reading this article in English right now, you”re already on the other side of the fence. But try toggling the language switcher in the header. You”ll see how the entire site—content, UI, navigation—adapts seamlessly.
We are just getting started. In the next phase, we aim to refine our AI-driven “Codex” pipeline to ensure translations capture not just the literal meaning, but nuance and tone as well.
Welcome to the global GADGET LAB. Let’s build something great together.






⚠️ コメントのルール
※違反コメントはAIおよび管理者により予告なく削除されます
まだコメントがありません。最初のコメントを投稿しましょう!