isekai
A starting point for what comes next

Welcome aboard

Your first page. Your first backend connection. A foundation you can make your own.

Explore the platform
A working reference
A soft clay browser connected to a translation backend, with multilingual message bubbles.
Scroll to explore
01 /

One page. A real connection.

Your services, ready to explore.

The page you are reading already requested its title, description and action from the i18n service. Follow the same flow when you build your own interface.

The website validates the translation identities before rendering. A failed dependency stays a failed request.

REQUEST / RESPONSE

  1. Browser

    Native Web Components

    HTML + JS

  2. Website

    HTML + a same-origin API

    HTTP

  3. i18n backend

    Localized messages

    JSON
title · description · action
CUSTOM ELEMENTS / NATIVE JS
<isekai-navigation>

Responsive links and keyboard access

<isekai-locale-choice>

A native language disclosure

<isekai-translation-preview>

An explicit request to the backend

connectedCallback()disconnectedCallback()
02 /

Small pieces. Room to build.

Start with ordinary HTML and JavaScript. Each interactive element is a class with its own lifecycle, so you can understand it, change it and reuse it.

HTML first

The page and language links work before JavaScript loads. Components add interaction to content that is already there.

03 / See the response

Follow the message.

These values came from the backend during page rendering. Reload them to see the same-origin JSON endpoint in action.

GET/api/messagesWebsite endpoint
Translation responseEnglish
{
  "locale": "en",
  "messages": {
    "title": "Welcome aboard",
    "description": "Your services, ready to explore.",
    "action": "Explore the platform"
  }
}

Rendered from the i18n backend. Reload to make a new request.

This example uses your current page language. Choose another language in the footer to compare.

Make it your starting point.

Use this page to explore the integration, then adapt the source for your own product. The website and i18n reference are available under the MIT license.

Explore the components