@intlayer/docs 9.4.0-canary.0 → 9.4.0

package/docs/id/formatters.md

@@ -53,6 +53,18 @@ author: aymericzip
 
 Intlayer menyediakan serangkaian pembantu ringan yang dibangun di atas API `Intl` asli, ditambah pembungkus `Intl` yang di-cache untuk menghindari pembuatan formatter berat berulang kali. Utilitas ini sepenuhnya sadar lokal dan dapat digunakan dari paket utama `intlayer`.
 
+**Untuk React, Vue, dan framework lainnya**, gunakan hooks/composables spesifik framework yang secara otomatis terikat ke konteks lokal aplikasi Anda:
+
+| Framework                | Import                                        |
+| ------------------------ | --------------------------------------------- |
+| **React** (client)       | `react-intlayer/format`                       |
+| **React** (server)       | `react-intlayer/server/format`                |
+| **Next.js** (client)     | `next-intlayer/client/format`                 |
+| **Next.js** (server)     | `next-intlayer/server/format`                 |
+| **Vue**                  | `vue-intlayer/format`                         |
+| **Preact**               | `preact-intlayer/format`                      |
+| **Vanilla JS / Node.js** | `intlayer` (memerlukan passing locale manual) |
+
 ## React Formatters
 
 ### Impor
@@ -80,8 +92,6 @@ import {
 } dari "intlayer";
 ```
 
-Jika Anda menggunakan React, hooks juga tersedia; lihat `react-intlayer/format`.
-
 ### Hook yang Tersedia
 
 Semua hook secara otomatis menggunakan locale dari `IntlayerProvider` atau `IntlayerServerProvider`.
@@ -174,8 +184,6 @@ const MyComponent = () => {
 
 ### `Intl.DisplayNames`
 
-Untuk nama yang dilokalkan dari bahasa, wilayah, mata uang, dan skrip:
-
 ```ts
 import { Intl } from "intlayer";
 
@@ -263,8 +271,6 @@ Untuk konteks non-framework, impor formatter langsung dari `intlayer`. Perhatika
 
 ### `Intl.PluralRules`
 
-Untuk menentukan bentuk jamak dalam berbagai locale:
-
 ```ts
 import { Intl } from "intlayer";
 
@@ -473,9 +479,6 @@ getLocaleName("en", "fr"); // "anglais"
 getLocaleName("de", "es"); // "alemán"
 ```
 
-- **displayLocale**: Locale yang ingin didapatkan namanya
-- **targetLocale**: Locale untuk menampilkan nama (default-nya adalah displayLocale)
-
 ### `getLocaleLang(locale?)`
 
 Mengambil kode bahasa dari string locale:
@@ -488,8 +491,6 @@ getLocaleLang("fr-CA"); // "fr"
 getLocaleLang("de"); // "de"
 ```
 
-- **locale**: Locale yang akan diambil bahasanya (default-nya adalah locale saat ini)
-
 ### `getLocaleFromPath(inputUrl)`
 
 Mengambil segmen locale dari URL atau pathname:
@@ -503,9 +504,6 @@ getLocaleFromPath("/dashboard"); // "en" (locale default)
 getLocaleFromPath("https://example.com/es/about"); // "es"
 ```
 
-- **inputUrl**: String URL lengkap atau pathname yang akan diproses
-- **returns**: Locale yang terdeteksi atau locale default jika tidak ditemukan locale
-
 ### `getPathWithoutLocale(inputUrl, locales?)`
 
 Menghapus segmen locale dari URL atau pathname:
@@ -518,10 +516,6 @@ getPathWithoutLocale("/fr/dashboard"); // "/dashboard"
 getPathWithoutLocale("https://example.com/en/about"); // "https://example.com/about"
 ```
 
-- **inputUrl**: String URL lengkap atau pathname yang akan diproses
-- **locales**: Array opsional dari locale yang didukung (default-nya adalah locale yang dikonfigurasi)
-- **returns**: URL tanpa segmen locale
-
 ### `getLocalizedUrl(url, currentLocale, locales?, defaultLocale?, prefixDefault?)`
 
 Menghasilkan URL yang dilokalkan untuk locale saat ini:
@@ -534,12 +528,6 @@ getLocalizedUrl("/about", "en", ["en", "fr"], "en", false); // "/about"
 getLocalizedUrl("https://example.com/about", "fr", ["en", "fr"], "en", true); // "https://example.com/fr/about"
 ```
 
-- **url**: URL asli yang akan dilokalkan
-- **currentLocale**: Locale saat ini
-- **locales**: Array opsional dari locale yang didukung (default ke locale yang dikonfigurasi)
-- **defaultLocale**: Locale default opsional (default ke locale default yang dikonfigurasi)
-- **prefixDefault**: Apakah akan menambahkan prefix untuk locale default (default ke nilai yang dikonfigurasi)
-
 ### `getHTMLTextDir(locale?)`
 
 Mengembalikan arah teks untuk sebuah locale:
@@ -552,9 +540,6 @@ getHTMLTextDir("ar"); // "rtl"
 getHTMLTextDir("he"); // "rtl"
 ```
 
-- **locale**: Locale untuk mendapatkan arah teks (default ke locale saat ini)
-- **returns**: `"ltr"`, `"rtl"`, atau `"auto"`
-
 ## Utilitas Penanganan Konten
 
 ### `getContent(node, nodeProps, locale?)`
@@ -571,10 +556,6 @@ const content = getContent(
 );
 ```
 
-- **node**: Node konten yang akan diubah
-- **nodeProps**: Properti untuk konteks transformasi
-- **locale**: Locale opsional (default ke locale default yang dikonfigurasi)
-
 ### `getTranslation(languageContent, locale?, fallback?)`
 
 Mengambil konten untuk locale tertentu dari objek konten bahasa:
@@ -593,10 +574,6 @@ const content = getTranslation(
 ); // "Bonjour"
 ```
 
-- **languageContent**: Objek yang memetakan locale ke konten
-- **locale**: Locale target (default ke locale default yang dikonfigurasi)
-- **fallback**: Apakah akan kembali ke locale default (default true)
-
 ### `getIntlayer(dictionaryKey, locale?, plugins?)`
 
 Mengambil dan mengubah konten dari kamus berdasarkan kunci:
@@ -608,10 +585,6 @@ const content = getIntlayer("common", "fr");
 const nestedContent = getIntlayer("common", "fr", customPlugins);
 ```
 
-- **dictionaryKey**: Kunci dari kamus yang akan diambil
-- **locale**: Locale opsional (default ke locale default yang dikonfigurasi)
-- **plugins**: Array opsional dari plugin transformasi kustom
-
 ## Catatan
 
 - Semua helper menerima input `string`; secara internal akan dikonversi menjadi angka atau tanggal.

package/docs/id/interest_of_intlayer.md

@@ -89,8 +89,6 @@ Jika Anda menggunakan kerangka kerja yang berbeda untuk bagian aplikasi yang ber
 </Accordion>
 </AccordionGroup>
 
----
-
 ## Mengapa Intlayer dibuat?
 
 Intlayer dibuat untuk mengatasi masalah umum yang mempengaruhi semua library i18n populer seperti `next-intl`, `react-i18next`, `react-intl`, `next-i18next`, `react-intl`, dan `vue-i18n`.

package/docs/id/intlayer_with_adonisjs.md

@@ -258,9 +258,11 @@ import { Locales, type IntlayerConfig } from "intlayer";
 
 const config: IntlayerConfig = {
   // ... Opsi konfigurasi lainnya
-  middleware: {
-    headerName: "my-locale-header",
-    cookieName: "my-locale-cookie",
+  routing: {
+    storage: [
+      { type: "header", name: "my-locale-header" },
+      { type: "cookie", name: "my-locale-cookie" },
+    ],
   },
 };
 

package/docs/id/intlayer_with_astro.md

@@ -122,6 +122,30 @@ Lihat [templat aplikasi](https://github.com/aymericzip/intlayer-astro-template)
 
 Instal paket yang diperlukan menggunakan manajer paket pilihan Anda:
 
+```bash packageManager="npm"
+npx intlayer init --interactive
+```
+
+```bash packageManager="pnpm"
+pnpm dlx intlayer@canary init --interactive
+```
+
+```bash packageManager="yarn"
+yarn dlx intlayer@canary init --interactive
+```
+
+```bash packageManager="bun"
+bunx intlayer@canary init --interactive
+```
+
+> flag `--interactive` bersifat opsional. Gunakan `intlayer-cli init` jika Anda adalah agen AI.
+
+> Perintah ini akan mendeteksi lingkungan Anda dan menginstal paket yang diperlukan. Sebagai contoh:
+
+```bash packageManager="npm"
+npm install intlayer astro-intlayer
+```
+
 ```bash packageManager="npm"
 npm install intlayer astro-intlayer
 # opsional: jika Anda ingin menambahkan dukungan island React

package/docs/id/intlayer_with_astro_preact.md

@@ -602,6 +602,12 @@ bun run build # Or bun run dev
 
 ### Konfigurasi TypeScript
 
+Intlayer menggunakan module augmentation untuk mendapatkan manfaat TypeScript dan membuat codebase Anda lebih kuat.
+
+![Autocompletion](https://github.com/aymericzip/intlayer/blob/main/docs/assets/autocompletion.png?raw=true)
+
+![Kesalahan Terjemahan](https://github.com/aymericzip/intlayer/blob/main/docs/assets/translation_error.png?raw=true)
+
 Intlayer menggunakan augmentasi modul (module augmentation) untuk memanfaatkan TypeScript, membuat basis kode Anda lebih kuat. Pastikan konfigurasi TypeScript Anda menyertakan tipe yang dibuat secara otomatis dan dikonfigurasi untuk Preact:
 
 ```json5 fileName="tsconfig.json"

package/docs/id/intlayer_with_create_react_app.md

@@ -43,8 +43,22 @@ Lihat [Application Template](https://github.com/aymericzip/intlayer-react-cra-te
 
 ## Apa itu Intlayer?
 
+Dibandingkan dengan solusi utama seperti `react-i18next` atau `i18next`, Intlayer adalah solusi yang dilengkapi dengan optimisasi terintegrasi seperti:
+
+<AccordionGroup>
+
+<Accordion header="Cakupan React Lengkap">
+
 **Intlayer** adalah pustaka internasionalisasi (i18n) open-source yang inovatif, dirancang untuk menyederhanakan dukungan multibahasa dalam aplikasi web modern.
 
+</Accordion>
+
+<Accordion header="Ukuran bundle">
+
+Alih-alih memuat file JSON berukuran besar ke halaman Anda, muat hanya konten yang diperlukan. Intlayer membantu **mengurangi ukuran bundle dan halaman Anda hingga 50%**.
+
+</Accordion>
+
 Dengan Intlayer, Anda dapat:
 
 - **Kelola terjemahan dengan mudah** menggunakan kamus deklaratif di tingkat komponen.
@@ -52,6 +66,35 @@ Dengan Intlayer, Anda dapat:
 - **Pastikan dukungan TypeScript** dengan tipe yang dihasilkan secara otomatis, meningkatkan autocompletion dan deteksi kesalahan.
 - **Manfaatkan fitur canggih**, seperti deteksi dan pergantian locale secara dinamis.
 
+</Accordion>
+
+<Accordion header="AI Agent">
+
+Co-locating content **reduces the context needed** by Large Language Models (LLMs). Intlayer also comes with a suite of tools, such as a **CLI** to test for missing translations,**[LSP](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/lsp.md)**, **[MCP](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/mcp_server.md)**, and **[agent skills](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/agent_skills.md)**, to make the developer experience (DX) even smoother for AI agents.
+
+</Accordion>
+
+<Accordion header="Otomasi">
+
+Gunakan otomasi untuk menerjemahkan dalam pipeline CI/CD Anda menggunakan LLM pilihan Anda dengan biaya dari penyedia AI Anda. Intlayer juga menawarkan **compiler** untuk mengotomatisasi ekstraksi konten, serta [platform web](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/intlayer_CMS.md) untuk membantu **menerjemahkan di latar belakang**.
+
+</Accordion>
+
+<Accordion header="Kinerja">
+
+Menghubungkan file JSON besar ke komponen dapat menyebabkan masalah performa dan reaktivitas. Intlayer mengoptimalkan pemuatan konten Anda pada saat build.
+
+</Accordion>
+
+<Accordion header="Scaling dengan none-dev">
+
+Lebih dari sekadar solusi i18n, Intlayer menyediakan **[editor visual](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/intlayer_visual_editor.md) yang self-hosted** dan **[CMS lengkap](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/intlayer_CMS.md)** untuk membantu Anda mengelola konten multibahasa secara **real-time**, membuat kolaborasi dengan penerjemah, copywriter, dan anggota tim lainnya menjadi mulus. Konten dapat disimpan secara lokal dan/atau jarak jauh.
+
+</Accordion>
+</AccordionGroup>
+
+---
+
 ## Panduan Langkah demi Langkah untuk Mengatur Intlayer di Aplikasi React
 
 <Steps>

package/docs/id/intlayer_with_elysia.md

@@ -0,0 +1,343 @@
+---
+createdAt: 2026-08-23
+updatedAt: 2026-08-24
+title: "Elysia i18n - Panduan lengkap untuk menerjemahkan aplikasi Anda"
+description: "Tidak ada lagi i18next. Panduan 2026 untuk membangun aplikasi Elysia multibahasa (i18n). Terjemahkan dengan AI agents dan optimalkan ukuran bundle, SEO, dan performa."
+keywords:
+  - Internationalization
+  - Documentation
+  - Intlayer
+  - Elysia
+  - JavaScript
+  - Backend
+slugs:
+  - doc
+  - environment
+  - elysia
+applicationTemplate: https://github.com/aymericzip/intlayer-elysia-template
+history:
+  - version: 9.4.0
+    date: 2026-08-24
+    changes: "Menyelaraskan panduan dengan template Elysia (typing context, setup Bun, script)"
+  - version: 9.4.0
+    date: 2026-08-23
+    changes: "init Elysia plugin"
+author: aymericzip
+---
+
+# Terjemahkan website backend Elysia Anda menggunakan Intlayer | Internationalization (i18n)
+
+`elysia-intlayer` adalah plugin internationalization (i18n) yang powerful untuk aplikasi Elysia, dirancang untuk membuat layanan backend Anda dapat diakses secara global dengan menyediakan respons yang terlokalisasi berdasarkan preferensi klien.
+
+> Lihat implementasi package di GitHub: https://github.com/aymericzip/intlayer/tree/main/packages/elysia-intlayer
+
+### Kasus Penggunaan Praktis
+
+- **Menampilkan Error Backend dalam Bahasa Pengguna**: Ketika terjadi kesalahan, menampilkan pesan dalam bahasa asli pengguna meningkatkan pemahaman dan mengurangi frustrasi. Ini sangat berguna untuk pesan error dinamis yang mungkin ditampilkan dalam komponen front-end seperti toasts atau modals.
+- **Mengambil Konten Multibahasa**: Untuk aplikasi yang menarik konten dari database, internasionalisasi memastikan bahwa Anda dapat menyajikan konten ini dalam berbagai bahasa. Ini sangat penting untuk platform seperti situs e-commerce atau sistem manajemen konten yang perlu menampilkan deskripsi produk, artikel, dan konten lainnya dalam bahasa yang disukai pengguna.
+- **Mengirim Email Multibahasa**: Baik itu email transaksional, kampanye pemasaran, atau notifikasi, mengirim email dalam bahasa penerima dapat meningkatkan engagement dan efektivitas secara signifikan.
+- **Notifikasi Push Multibahasa**: Untuk aplikasi mobile, mengirim notifikasi push dalam bahasa pilihan pengguna dapat meningkatkan interaksi dan retensi. Sentuhan personal ini dapat membuat notifikasi terasa lebih relevan dan dapat ditindaklanjuti.
+- **Komunikasi Lainnya**: Segala bentuk komunikasi dari backend, seperti pesan SMS, alert sistem, atau pembaruan antarmuka pengguna, mendapat manfaat dari penggunaan bahasa pengguna, memastikan kejelasan dan meningkatkan pengalaman pengguna secara keseluruhan.
+
+Dengan menginternasionalisasi backend, aplikasi Anda tidak hanya menghormati perbedaan budaya tetapi juga selaras lebih baik dengan kebutuhan pasar global, menjadikannya langkah kunci dalam menskalakan layanan Anda di seluruh dunia.
+
+## Memulai
+
+<iframe
+  src="https://ide.intlayer.org/aymericzip/intlayer-elysia-template?file=intlayer.config.ts"
+  className="m-auto overflow-hidden rounded-lg border-0 max-md:size-full max-md:h-[700px] md:aspect-16/9 md:w-full"
+  title="Demo CodeSandbox - How to Internationalize your application using Intlayer"
+  sandbox="allow-forms allow-modals allow-popups allow-presentation allow-same-origin allow-scripts"
+  loading="lazy"
+/>
+
+Lihat [Template Aplikasi](https://github.com/aymericzip/intlayer-elysia-template) di GitHub.
+
+### Instalasi
+
+Untuk mulai menggunakan `elysia-intlayer`, instal paket menggunakan npm:
+
+```bash packageManager="npm"
+npx intlayer init --interactive
+```
+
+```bash packageManager="pnpm"
+pnpm dlx intlayer@canary init --interactive
+```
+
+```bash packageManager="yarn"
+yarn dlx intlayer@canary init --interactive
+```
+
+```bash packageManager="bun"
+bunx intlayer@canary init --interactive
+```
+
+> flag `--interactive` bersifat opsional. Gunakan `intlayer-cli init` jika Anda adalah agen AI.
+
+> Perintah ini akan mendeteksi lingkungan Anda dan menginstal paket yang diperlukan. Contohnya:
+
+```bash packageManager="npm"
+npm install intlayer elysia-intlayer
+```
+
+```bash packageManager="pnpm"
+pnpm add intlayer elysia-intlayer
+```
+
+```bash packageManager="yarn"
+yarn add intlayer elysia-intlayer
+```
+
+```bash packageManager="bun"
+bun add intlayer elysia-intlayer
+```
+
+> Elysia menargetkan runtime **Bun**. `elysia-intlayer` mengandalkan `AsyncLocalStorage` (alih-alih library `cls-hooked` yang dipakai plugin Intlayer berbasis Node) justru karena Bun tidak mengimplementasikan `async_hooks.createHook`.
+
+### Penyiapan
+
+Konfigurasikan pengaturan internasionalisasi dengan membuat `intlayer.config.ts` di root proyek Anda:
+
+```typescript fileName="intlayer.config.ts" codeFormat={["typescript", "esm", "commonjs"]}
+import { Locales, type IntlayerConfig } from "intlayer";
+
+const config: IntlayerConfig = {
+  internationalization: {
+    locales: [Locales.ENGLISH, Locales.FRENCH, Locales.SPANISH],
+    /**
+     * Locale default yang dipakai sebagai fallback jika locale yang diminta tidak ditemukan.
+     */
+    defaultLocale: Locales.ENGLISH,
+  },
+};
+
+export default config;
+```
+
+### Deklarasikan Konten Anda
+
+Buat dan kelola deklarasi konten Anda untuk menyimpan terjemahan:
+
+```typescript fileName="src/index.content.ts" contentDeclarationFormat={["typescript", "esm", "commonjs"]}
+import { t, type Dictionary } from "intlayer";
+
+const indexContent = {
+  key: "index",
+  content: {
+    exampleOfContent: t({
+      id: "Contoh konten yang dikembalikan dalam bahasa Indonesia",
+      en: "Example of returned content in English",
+      fr: "Exemple de contenu renvoyé en français",
+      es: "Ejemplo de contenido devuelto en español",
+    }),
+  },
+} satisfies Dictionary;
+
+export default indexContent;
+```
+
+```json fileName="src/index.content.json" contentDeclarationFormat="json"
+{
+  "$schema": "https://intlayer.org/schema.json",
+  "key": "index",
+  "content": {
+    "exampleOfContent": {
+      "nodeType": "translation",
+      "translation": {
+        "id": "Contoh konten yang dikembalikan dalam bahasa Indonesia",
+        "en": "Example of returned content in English",
+        "fr": "Exemple de contenu renvoyé en français",
+        "es": "Ejemplo de contenido devuelto en español"
+      }
+    }
+  }
+}
+```
+
+> Deklarasi konten Anda dapat didefinisikan di mana saja dalam aplikasi Anda selama disertakan dalam direktori `contentDir` (secara default, `./src`). Dan cocok dengan ekstensi file deklarasi konten (secara default, `.content.{json,ts,tsx,js,jsx,mjs,cjs,md,mdx,yaml,yml}`).
+
+> Untuk detail lebih lanjut, lihat [dokumentasi deklarasi konten](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/dictionary/content_file.md).
+
+### Pengaturan Aplikasi Elysia
+
+Atur aplikasi Elysia Anda untuk menggunakan `elysia-intlayer`:
+
+```typescript fileName="src/index.ts" codeFormat={["typescript", "esm", "commonjs"]}
+import { Elysia } from "elysia";
+import { intlayer } from "elysia-intlayer";
+
+const app = new Elysia()
+  // Muat plugin internasionalisasi
+  .use(intlayer())
+  // Routes
+  .get("/", ({ intlayer }) => ({
+    // Locale yang digunakan untuk permintaan ini, `Accept-Language` dinegosiasikan atau dibaca dari penyimpanan
+    locale: intlayer!.locale,
+    greeting: intlayer!.t({
+      id: "Halo",
+      en: "Hello",
+      fr: "Bonjour",
+      es: "Hola",
+    }),
+    content: intlayer!.getIntlayer("index").exampleOfContent,
+  }))
+  .listen(3000);
+
+console.log(
+  `🦊 Elysia is running at ${app.server?.hostname}:${app.server?.port}`
+);
+```
+
+> Plugin mendaftarkan context-nya melalui `derive` **global**, yang oleh Elysia diberi tipe `Partial<{ intlayer: IntlayerContext }>`. Nilainya selalu ada saat runtime untuk route yang didaftarkan setelah `.use(intlayer())`, jadi gunakan non-null assertion (`intlayer!.locale`) — atau optional chaining — agar TypeScript pada mode `strict` puas.
+
+Context route menyediakan:
+
+| Properti          | Deskripsi                                                                                                         |
+| ----------------- | ----------------------------------------------------------------------------------------------------------------- |
+| `locale`          | Locale yang digunakan untuk request ini, dengan `locale_storage` lebih diprioritaskan daripada `locale_detected`. |
+| `locale_storage`  | Locale yang diminta secara eksplisit oleh klien melalui cookie atau header.                                       |
+| `locale_detected` | Locale yang dinegosiasikan dari header request.                                                                   |
+| `defaultLocale`   | Locale yang dikonfigurasi sebagai fallback di `intlayer.config.ts`.                                               |
+| `t`               | Sebuah fungsi terjemahan.                                                                                         |
+| `getIntlayer`     | Fungsi untuk mengambil dictionary berdasarkan key.                                                                |
+| `getDictionary`   | Fungsi untuk memproses objek dictionary.                                                                          |
+
+Helper yang sama juga diekspor secara standalone. Mereka menyelesaikan request saat ini melalui `AsyncLocalStorage`, sehingga Anda bisa memanggilnya tanpa melakukan destructuring pada context:
+
+```typescript fileName="src/index.ts" codeFormat={["typescript", "esm", "commonjs"]}
+import { Elysia } from "elysia";
+import { intlayer, t, getDictionary, getIntlayer } from "elysia-intlayer";
+import dictionaryExample from "./index.content";
+
+const app = new Elysia()
+  .use(intlayer())
+  .get("/t_example", () =>
+    t({
+      id: "Contoh konten yang dikembalikan dalam bahasa Indonesia",
+      en: "Example of returned content in English",
+      fr: "Exemple de contenu renvoyé en français",
+      es: "Ejemplo de contenido devuelto en español",
+    })
+  )
+  .get("/getIntlayer_example", () => getIntlayer("index").exampleOfContent)
+  .get(
+    "/getDictionary_example",
+    () => getDictionary(dictionaryExample).exampleOfContent
+  )
+  .listen(3000);
+```
+
+> Konteks request dilepaskan setelah response dipetakan, sehingga helper mandiri tidak pernah diselesaikan terhadap request yang sudah berakhir. Ketika dipanggil di luar request yang ditangani plugin, keduanya beralih ke locale default yang dikonfigurasi.
+
+### Menjalankan Aplikasi Anda
+
+Tambahkan script Intlayer ke `package.json` Anda. `intlayer build` mengompilasi deklarasi konten Anda ke direktori `.intlayer` dan menghasilkan tipe TypeScript:
+
+```json fileName="package.json"
+{
+  "scripts": {
+    "dev": "intlayer build && bun run --watch src/index.ts",
+    "build": "intlayer build",
+    "start": "bun run src/index.ts",
+    "i18n:fill": "intlayer fill",
+    "i18n:test": "intlayer test"
+  }
+}
+```
+
+Lalu jalankan server:
+
+```bash
+bun run dev
+```
+
+Uji negosiasi locale dengan `Accept-Language`:
+
+```bash
+curl -H "Accept-Language: fr" http://localhost:3000/
+# {"locale":"fr","greeting":"Bonjour","content":"Exemple de contenu renvoyé en français"}
+
+curl -H "Accept-Language: es" http://localhost:3000/
+# {"locale":"es","greeting":"Hola","content":"Ejemplo de contenido devuelto en español"}
+```
+
+> `intlayer build` tidak wajib dijalankan sebelum `bun run src/index.ts`: plugin juga menyiapkan dictionary saat aplikasi Elysia melakukan boot. Menjalankannya lebih dulu membuat tipe yang dihasilkan tetap sinkron untuk editor Anda dan menghindari biaya build pada request pertama.
+
+### Kompatibilitas
+
+`elysia-intlayer` sepenuhnya kompatibel dengan:
+
+- [`react-intlayer`](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/packages/react-intlayer/index.md) untuk aplikasi React
+- [`next-intlayer`](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/packages/next-intlayer/index.md) untuk aplikasi Next.js
+- [`vite-intlayer`](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/packages/vite-intlayer/index.md) untuk aplikasi Vite
+
+Ini juga bekerja dengan mulus dengan solusi internasionalisasi apa pun di berbagai lingkungan, termasuk browser dan permintaan API.
+
+Secara default, plugin menyelesaikan locale dengan urutan berikut:
+
+1. Cookie `INTLAYER_LOCALE`.
+2. Header `x-intlayer-locale`.
+3. Negosiasi header `Accept-Language`.
+
+Anda dapat menyesuaikan cookie dan header yang dipakai untuk deteksi locale:
+
+```typescript fileName="intlayer.config.ts" codeFormat={["typescript", "esm", "commonjs"]}
+import { Locales, type IntlayerConfig } from "intlayer";
+
+const config: IntlayerConfig = {
+  // ... Opsi konfigurasi lainnya
+  routing: {
+    storage: [
+      { type: "header", name: "my-locale-header" },
+      { type: "cookie", name: "my-locale-cookie" },
+    ],
+  },
+};
+
+export default config;
+```
+
+> Untuk informasi lebih lanjut tentang konfigurasi dan topik lanjutan, kunjungi [dokumentasi](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/configuration.md) kami.
+
+### Konfigurasi TypeScript
+
+`elysia-intlayer` memanfaatkan kemampuan robust TypeScript untuk meningkatkan proses internasionalisasi. Pengetikan statis TypeScript memastikan bahwa setiap kunci terjemahan diperhitungkan, mengurangi risiko terjemahan yang hilang dan meningkatkan maintainability.
+
+Pastikan tipe yang dihasilkan secara otomatis (secara default di ./types/intlayer.d.ts) disertakan dalam file tsconfig.json Anda.
+
+```json5 fileName="tsconfig.json"
+{
+  // ... Konfigurasi TypeScript yang ada
+  "include": [
+    // ... Konfigurasi TypeScript yang ada
+    ".intlayer/**/*.ts", // Sertakan tipe yang dihasilkan secara otomatis
+  ],
+}
+```
+
+### Ekstensi VS Code
+
+Untuk meningkatkan pengalaman pengembangan Anda dengan Intlayer, Anda dapat menginstal **Intlayer VS Code Extension** resmi.
+
+[Instal dari VS Code Marketplace](https://marketplace.visualstudio.com/items?itemName=intlayer.intlayer-vs-code-extension)
+
+Ekstensi ini menyediakan:
+
+- **Autocompletion** untuk kunci terjemahan.
+- **Deteksi kesalahan real-time** untuk terjemahan yang hilang.
+- **Pratinjau inline** dari konten yang diterjemahkan.
+- **Tindakan cepat** untuk dengan mudah membuat dan memperbarui terjemahan.
+
+Untuk detail lebih lanjut tentang cara menggunakan ekstensi, lihat [dokumentasi Intlayer VS Code Extension](https://intlayer.org/doc/vs-code-extension).
+
+### Konfigurasi Git
+
+Disarankan untuk mengabaikan file yang dihasilkan oleh Intlayer. Ini memungkinkan Anda menghindari commit mereka ke repositori Git Anda.
+
+Untuk melakukan ini, Anda dapat menambahkan instruksi berikut ke file `.gitignore` Anda:
+
+```plaintext fileName=".gitignore"
+# Abaikan file yang dihasilkan oleh Intlayer
+.intlayer
+```

package/docs/id/intlayer_with_express.md

@@ -217,9 +217,11 @@ import { Locales, type IntlayerConfig } from "intlayer";
 
 const config: IntlayerConfig = {
   // ... Opsi konfigurasi lainnya
-  middleware: {
-    headerName: "my-locale-header",
-    cookieName: "my-locale-cookie",
+  routing: {
+    storage: [
+      { type: "header", name: "my-locale-header" },
+      { type: "cookie", name: "my-locale-cookie" },
+    ],
   },
 };
 

package/docs/id/intlayer_with_fastify.md

@@ -222,9 +222,11 @@ import { Locales, type IntlayerConfig } from "intlayer";
 
 const config: IntlayerConfig = {
   // ... Opsi konfigurasi lainnya
-  middleware: {
-    headerName: "my-locale-header",
-    cookieName: "my-locale-cookie",
+  routing: {
+    storage: [
+      { type: "header", name: "my-locale-header" },
+      { type: "cookie", name: "my-locale-cookie" },
+    ],
   },
 };