@intlayer/docs 8.12.4 → 9.0.0-canary.10

package/blog/hi/nextjs-multilingual-seo-comparison.md

@@ -16,6 +16,7 @@ keywords:
 slugs:
   - blog
   - blog-seo-i18n-nextjs
+author: aymericzip
 ---
 
 # Next.js में SEO और i18n: केवल अनुवाद करना पर्याप्त नहीं है

package/blog/hi/per-component_vs_centralized_i18n.md

@@ -13,6 +13,7 @@ keywords:
 slugs:
   - blog
   - per-component-vs-centralized-i18n
+author: aymericzip
 ---
 
 # प्रति-कम्पोनेंट बनाम केंद्रीकृत i18n

package/blog/hi/rag_powered_documentation_assistant.md

@@ -13,6 +13,7 @@ keywords:
 slugs:
   - blog
   - rag-powered-documentation-assistant
+author: aymericzip
 ---
 
 # RAG-संचालित दस्तावेज़ सहायक का निर्माण (चंकिंग, एम्बेडिंग्स, और खोज)
@@ -69,13 +70,17 @@ RAG एक लोकप्रिय दृष्टिकोण बन गया
 5.  **ऑगमेंटेशन + जनरेशन (RAG में AG)** उन टुकड़ों को ChatGPT के प्रॉम्प्ट में डाला जाता है, ताकि मॉडल वास्तविक दस्तावेज़ संदर्भ के साथ उत्तर दे सके।
 6.  **प्रतिक्रिया के लिए क्वेरी लॉगिंग** हर उपयोगकर्ता क्वेरी को संग्रहित किया जाता है। यह दर्द बिंदुओं, गायब दस्तावेज़ों, या नए अवसरों को समझने के लिए सोना है।
 
-## चरण 1: दस्तावेज़ पढ़ना
+<Steps>
+
+<Step number={1} title="दस्तावेज़ पढ़ना">
 
 पहला चरण सरल था: मुझे docs/ फ़ोल्डर में सभी .md फ़ाइलों को स्कैन करने का एक तरीका चाहिए था। Node.js और glob का उपयोग करके, मैंने प्रत्येक Markdown फ़ाइल की सामग्री को मेमोरी में लाया।
 
 यह पाइपलाइन को लचीला बनाए रखता है: Markdown के बजाय, आप दस्तावेज़ों को डेटाबेस, CMS, या यहां तक कि API से भी प्राप्त कर सकते हैं।
 
-## चरण 2: दस्तावेज़ों को टुकड़ों में विभाजित करना
+</Step>
+
+<Step number={2} title="दस्तावेज़ों को टुकड़ों में विभाजित करना">
 
 टुकड़ों में क्यों बांटना? क्योंकि भाषा मॉडल के पास **संदर्भ सीमाएं** होती हैं। उन्हें पूरे दस्तावेज़ की किताब खिलाना काम नहीं करेगा।
 
@@ -93,7 +98,9 @@ RAG एक लोकप्रिय दृष्टिकोण बन गया
 - बहुत छोटा → आपको शोर मिलेगा।
 - बहुत बड़ा → आप संदर्भ आकार को बढ़ा देते हैं।
 
-## चरण 3: एम्बेडिंग्स जनरेट करना
+</Step>
+
+<Step number={3} title="एम्बेडिंग्स जनरेट करना">
 
 एक बार जब दस्तावेज़ों को टुकड़ों में बांट दिया जाता है, तो हम **एम्बेडिंग्स** बनाते हैं, उच्च-आयामी वेक्टर जो प्रत्येक टुकड़े का प्रतिनिधित्व करते हैं।
 
@@ -111,7 +118,9 @@ RAG एक लोकप्रिय दृष्टिकोण बन गया
 
 प्रत्येक वेक्टर टेक्स्ट की एक गणितीय फिंगरप्रिंट है, जो समानता खोज को सक्षम बनाता है।
 
-## चरण 4: एम्बेडिंग्स का इंडेक्सिंग और संग्रहण
+</Step>
+
+<Step number={4} title="एम्बेडिंग्स का इंडेक्सिंग और संग्रहण">
 
 बार-बार एम्बेडिंग्स को पुनः उत्पन्न करने से बचने के लिए, मैंने उन्हें embeddings.json में संग्रहित किया।
 
@@ -124,7 +133,9 @@ RAG एक लोकप्रिय दृष्टिकोण बन गया
 
 वेक्टर डेटाबेस इंडेक्सिंग, स्केलेबिलिटी, और तेज़ खोज को संभालते हैं। लेकिन मेरे प्रोटोटाइप के लिए, एक स्थानीय JSON ठीक काम करता था।
 
-## चरण 5: कोसाइन सिमिलैरिटी के साथ पुनःप्राप्ति
+</Step>
+
+<Step number={5} title="कोसाइन सिमिलैरिटी के साथ पुनःप्राप्ति">
 
 जब कोई उपयोगकर्ता प्रश्न पूछता है:
 
@@ -136,7 +147,9 @@ RAG एक लोकप्रिय दृष्टिकोण बन गया
 
 इस तरह, सिस्टम क्वेरी के सबसे निकट दस्तावेज़ अंश खोजता है।
 
-## चरण 6: संवर्धन + जनरेशन
+</Step>
+
+<Step number={6} title="संवर्धन + जनरेशन">
 
 अब जादू आता है। हम शीर्ष टुकड़ों को लेते हैं और उन्हें ChatGPT के **सिस्टम प्रॉम्प्ट** में इंजेक्ट करते हैं।
 
@@ -144,7 +157,9 @@ RAG एक लोकप्रिय दृष्टिकोण बन गया
 
 परिणाम: सटीक, **दस्तावेज़-आधारित उत्तर**।
 
-## चरण 7: उपयोगकर्ता प्रश्नों का लॉगिंग
+</Step>
+
+<Step number={7} title="उपयोगकर्ता प्रश्नों का लॉगिंग">
 
 यह छुपी हुई सुपरपावर है।
 
@@ -157,7 +172,9 @@ RAG एक लोकप्रिय दृष्टिकोण बन गया
 
 यह आपके RAG सहायक को एक **लगातार उपयोगकर्ता अनुसंधान उपकरण** में बदल देता है।
 
-## इसकी लागत क्या है?
+</Step>
+
+<Step number={8} title="इसकी लागत क्या है?">
 
 RAG के लिए एक सामान्य आपत्ति लागत है। व्यवहार में, यह आश्चर्यजनक रूप से सस्ता है:
 
@@ -167,7 +184,9 @@ RAG के लिए एक सामान्य आपत्ति लाग
 
 इसके ऊपर, आप होस्टिंग लागत भी शामिल कर सकते हैं।
 
-## कार्यान्वयन विवरण
+</Step>
+
+<Step number={9} title="कार्यान्वयन विवरण">
 
 स्टैक:
 
@@ -231,7 +250,9 @@ docUrl: "https://example.com/docs/hi/another-doc"
 
 👉 [यहाँ डेमो आज़माएँ](https://intlayer.org/doc/why) 👉 [GitHub पर कोड टेम्पलेट देखें](https://github.com/aymericzip/smart_doc_RAG)
 
-## आगे बढ़ना
+</Step>
+
+<Step number={10} title="आगे बढ़ना">
 
 यह परियोजना एक न्यूनतम कार्यान्वयन है। लेकिन आप इसे कई तरीकों से बढ़ा सकते हैं:
 
@@ -243,13 +264,17 @@ docUrl: "https://example.com/docs/hi/another-doc"
 - मल्टी-सोर्स रिट्रीवल → केवल डॉक नहीं, बल्कि डेटाबेस एंट्री, ब्लॉग पोस्ट, टिकट आदि भी खींचना
 - बेहतर प्रॉम्प्टिंग → रीरैंकिंग, फ़िल्टरिंग, और हाइब्रिड सर्च (कीवर्ड + सेमांटिक)
 
-## सीमाएँ जिनका सामना करना पड़ा
+</Step>
+
+<Step number={11} title="सीमाएँ जिनका सामना करना पड़ा">
 
 - चंकिन्ग और ओवरलैप अनुभवजन्य हैं। सही संतुलन (चंक साइज, ओवरलैप प्रतिशत, प्राप्त किए गए चंक्स की संख्या) के लिए पुनरावृत्ति और परीक्षण आवश्यक है।
 - जब डॉक बदलते हैं तो एम्बेडिंग्स स्वचालित रूप से पुनः उत्पन्न नहीं होती हैं। हमारा सिस्टम केवल तभी फाइल के लिए एम्बेडिंग्स रीसेट करता है जब चंक्स की संख्या संग्रहीत संख्या से भिन्न होती है।
 - इस प्रोटोटाइप में, एम्बेडिंग्स JSON में संग्रहीत की जाती हैं। यह डेमो के लिए काम करता है लेकिन Git को प्रदूषित करता है। उत्पादन में, एक डेटाबेस या समर्पित वेक्टर स्टोर बेहतर होता है।
 
-## यह दस्तावेज़ों से परे क्यों महत्वपूर्ण है
+</Step>
+
+<Step number={12} title="यह दस्तावेज़ों से परे क्यों महत्वपूर्ण है">
 
 दिलचस्प हिस्सा केवल चैटबॉट नहीं है। यह **फीडबैक लूप** है।
 
@@ -269,7 +294,9 @@ RAG के साथ, आप केवल उत्तर नहीं देत
 
 यह है आपके उपयोगकर्ताओं से सीधे **उत्पाद बुद्धिमत्ता**।
 
-## निष्कर्ष
+</Step>
+
+<Step number={13} title="निष्कर्ष">
 
 RAG LLMs को व्यावहारिक बनाने के सबसे सरल और सबसे शक्तिशाली तरीकों में से एक है। **रिकवरी + जनरेशन** को मिलाकर, आप स्थिर दस्तावेज़ों को एक **स्मार्ट असिस्टेंट** में बदल सकते हैं और साथ ही, उत्पाद अंतर्दृष्टि की एक निरंतर धारा प्राप्त कर सकते हैं।
 
@@ -282,3 +309,20 @@ RAG LLMs को व्यावहारिक बनाने के सबस
 👉 [यहाँ डेमो आज़माएँ](https://intlayer.org/doc/why) 👉 [GitHub पर कोड टेम्पलेट देखें](https://github.com/aymericzip/smart_doc_RAG)
 
 और यदि आप भी RAG के साथ प्रयोग कर रहे हैं, तो मैं सुनना चाहूंगा कि आप इसे कैसे उपयोग कर रहे हैं।
+
+</Step>
+
+</Steps>
+## निष्कर्ष
+
+RAG LLMs को व्यावहारिक बनाने के सबसे सरल और शक्तिशाली तरीकों में से एक है। **retrieval + generation** को जोड़कर, आप स्टेटिक docs को एक **smart assistant** में बदल सकते हैं और साथ ही product insights की एक सतत stream प्राप्त कर सकते हैं।
+
+मेरे लिए, इस project ने दिखाया कि RAG सिर्फ एक तकनीकी trick नहीं है। यह documentation को इसमें बदलने का एक तरीका है:
+
+- एक interactive support system
+- एक feedback channel
+- एक product strategy tool
+
+👉 [Demo को यहाँ आजमाएं](https://intlayer.org/doc/why) 👉 [GitHub पर code template देखें](https://github.com/aymericzip/smart_doc_RAG)
+
+और अगर आप भी RAG के साथ experiment कर रहे हैं, तो मुझे सुनना अच्छा लगेगा कि आप इसे कैसे use कर रहे हैं।

package/blog/hi/react-i18next_vs_react-intl_vs_intlayer.md

@@ -15,6 +15,7 @@ keywords:
 slugs:
   - blog
   - react-i18next-vs-react-intl-vs-intlayer
+author: aymericzip
 ---
 
 # react-Intl बनाम react-i18next बनाम intlayer | React अंतरराष्ट्रीयकरण (i18n)
@@ -145,6 +146,12 @@ slugs:
 
 ---
 
+## GitHub STARs
+
+GitHub stars एक प्रोजेक्ट की लोकप्रियता, कम्युनिटी के विश्वास और दीर्घकालीन प्रासंगिकता का एक मजबूत संकेतक हैं। हालांकि तकनीकी गुणवत्ता का सीधा माप नहीं, वे दर्शाते हैं कि कितने developers को प्रोजेक्ट उपयोगी लगता है, इसकी प्रगति का अनुसरण करते हैं, और इसे अपनाने की संभावना रखते हैं। किसी प्रोजेक्ट के मूल्य का अनुमान लगाने के लिए, stars विकल्पों के बीच traction की तुलना करने और ecosystem growth में insights प्रदान करने में मदद करते हैं।
+
+[![Star History Chart](https://api.star-history.com/chart?repos=formatjs/formatjs%2Ci18next/react-i18next%2Caymericzip/intlayer&type=date&legend=top-left)](https://www.star-history.com/#formatjs/formatjs&i18next/react-i18next&aymericzip/intlayer)
+
 ## निष्कर्ष
 
 तीनों पुस्तकालय React को प्रभावी ढंग से स्थानीयकृत करते हैं। अंतर यह है कि आपको एक **सुरक्षित, स्केलेबल** सेटअप तक पहुंचने के लिए कितना **इन्फ्रास्ट्रक्चर** बनाना होगा:

package/blog/hi/vue-i18n_vs_intlayer.md

@@ -15,6 +15,7 @@ keywords:
 slugs:
   - blog
   - vue-i18n-vs-intlayer
+author: aymericzip
 ---
 
 # vue-i18n बनाम Intlayer | Vue अंतरराष्ट्रीयकरण (i18n)
@@ -248,6 +249,14 @@ const { greeting } = useIntlayer("component-example");
 
 ---
 
+## vue-i18n के साथ अंतरसंचालनीयता
+
+`intlayer` आपके `vue-i18n` namespaces को प्रबंधित करने में भी मदद कर सकता है।
+
+`intlayer` का उपयोग करके, आप अपने पसंदीदा i18n library के प्रारूप में अपनी content declare कर सकते हैं, और intlayer आपकी namespaces को अपनी पसंद के स्थान पर generate करेगा (उदाहरण: `/messages/{{locale}}/{{namespace}}.json`)।
+
+---
+
 ## व्यावहारिक माइग्रेशन नोट्स (vue-i18n → Intlayer)
 
 - **प्रत्येक फीचर से शुरू करें**: एक समय में एक रूट/व्यू/कंपोनेंट को स्थानीय Intlayer शब्दकोशों में स्थानांतरित करें।

package/blog/hi/what_is_internationalization.md

@@ -15,6 +15,7 @@ keywords:
 slugs:
   - blog
   - what-is-internationalization
+author: aymericzip
 ---
 
 # अंतर्राष्ट्रीयकरण (i18n) क्या है? परिभाषा और चुनौतियाँ

package/blog/id/compiler_vs_declarative_i18n.md

@@ -16,6 +16,7 @@ keywords:
 slugs:
   - blog
   - compiler-vs-declarative-i18n
+author: aymericzip
 ---
 
 # Argumen Mendukung dan Menentang i18n Berbasis Compiler

package/blog/id/i18n_meaning.md

@@ -14,6 +14,7 @@ keywords:
 slugs:
   - blog
   - i18n-meaning
+author: aymericzip
 ---
 
 # Arti i18n: Apa itu Internasionalisasi dan Mengapa Itu Penting?

package/blog/id/i18n_using_next-i18next.md

@@ -19,6 +19,7 @@ history:
   - version: 7.0.6
     date: 2025-11-01
     changes: Versi awal
+author: aymericzip
 ---
 
 # Cara menginternasionalisasi aplikasi Next.js Anda menggunakan next-i18next pada tahun 2026

package/blog/id/i18n_using_next-intl.md

@@ -18,6 +18,7 @@ history:
   - version: 7.0.0
     date: 2025-11-01
     changes: Versi awal
+author: aymericzip
 ---
 
 # Cara menginternasionalisasi aplikasi Next.js Anda menggunakan next-intl pada tahun 2026

package/blog/id/index.md

@@ -13,6 +13,7 @@ keywords:
 slugs:
   - blog
   - search
+author: aymericzip
 ---
 
 # Mengadopsi Internasionalisasi dalam JavaScript: Meningkatkan Jangkauan Global dan SEO

package/blog/id/internationalization_and_SEO.md

@@ -14,6 +14,7 @@ keywords:
 slugs:
   - blog
   - SEO-and-i18n
+author: aymericzip
 ---
 
 # SEO & I18n: Panduan Utama untuk Membuat Situs Web Anda Multibahasa
@@ -87,101 +88,10 @@ Dalam HTML Anda, tambahkan sesuatu seperti:
 
 ## 4. Membuat Konten Benar-Benar “Lokal” (Bukan Sekadar Diterjemahkan)
 
-### 4.1. Lokalisasi vs. Terjemahan
-
-- **Terjemahan** berarti mengubah teks dari satu bahasa ke bahasa lain secara kata per kata.
-- **Lokalisasi** berarti menyesuaikan format konten, mata uang, ukuran, dan referensi budaya untuk audiens lokal. Misalnya, jika Anda menargetkan Prancis, Anda akan menggunakan `€` alih-alih `---
-  createdAt: 2024-12-24
-  updatedAt: 2025-06-29
-  title: SEO dan Internasionalisasi
-  description: Temukan cara mengoptimalkan situs web multibahasa Anda untuk mesin pencari dan meningkatkan SEO Anda.
-  keywords:
-  - SEO
-  - Intlayer
-  - Internasionalisasi
-  - Blog
-  - Next.js
-  - JavaScript
-  - React
-    slugs:
-  - blog
-  - SEO-and-i18n
-
----
-
-# SEO & I18n: Panduan Utama untuk Membuat Situs Web Anda Multibahasa
-
-Ingin menjangkau lebih banyak pengguna di seluruh dunia? Membuat situs web Anda menjadi multibahasa adalah salah satu cara terbaik untuk memperluas audiens Anda dan meningkatkan SEO (Search Engine Optimization) Anda. Dalam posting blog ini, kami akan menguraikan dasar-dasar SEO internasional yang sering disebut sebagai **i18n** (singkatan dari "internasionalisasi"), dengan istilah yang jelas dan mudah dipahami. Anda akan mempelajari keputusan kunci yang perlu Anda buat, cara menggunakan elemen teknis seperti `hreflang`, dan mengapa alat seperti **Intlayer** dapat menyederhanakan proyek Next.js multibahasa Anda.
-
----
-
-## 1. Apa Arti Membuat Situs Web Anda Menjadi Multibahasa?
-
-Situs web multibahasa menawarkan kontennya dalam lebih dari satu bahasa. Misalnya, Anda mungkin memiliki versi bahasa Inggris (`example.com/en/`), versi bahasa Prancis (`example.com/fr/`), dan versi bahasa Spanyol (`example.com/es/`). Pendekatan ini memungkinkan mesin pencari menampilkan versi bahasa yang tepat kepada pengguna berdasarkan preferensi atau lokasi geografis mereka.
-
-Ketika Anda melakukannya dengan benar, Anda akan menciptakan pengalaman yang jauh lebih ramah pengguna bagi penutur non-Inggris yang mengarah pada keterlibatan yang lebih baik, tingkat konversi yang lebih tinggi, dan peningkatan SEO di berbagai wilayah.
-
----
-
-## 2. Memilih Struktur URL yang Tepat
-
-Jika Anda memutuskan untuk memiliki beberapa versi bahasa, Anda memerlukan cara yang jelas dan konsisten untuk mengatur URL situs Anda. Setiap bahasa (atau wilayah) harus memiliki “alamat” uniknya sendiri di internet. Berikut adalah tiga cara umum untuk menyusun situs web multibahasa:
-
-1. Domain Tingkat Atas Kode Negara (ccTLD)
-   - Contoh: `example.fr`, `example.de`
-   - **Kelebihan:** Mengirim sinyal kuat ke mesin pencari tentang negara mana konten tersebut ditargetkan (misalnya, `.fr` = Prancis).
-   - **Kekurangan:** Mengelola beberapa domain bisa lebih mahal dan rumit.
-
-2. **Subdomain**
-   - **Contoh:** `fr.example.com`, `de.example.com`
-   - **Kelebihan:** Setiap bahasa “tinggal” di subdomainnya sendiri, sehingga relatif mudah untuk menambah atau menghapus bahasa.
-   - **Kekurangan:** Mesin pencari terkadang memperlakukan subdomain sebagai situs yang terpisah, sehingga dapat mengurangi otoritas domain utama Anda.
-
-3. **Subdirektori (Subfolder)**
-   - **Contoh:** `example.com/fr/`, `example.com/de/`
-   - **Kelebihan:** Mudah dikelola, dan semua lalu lintas diarahkan ke satu domain utama.
-   - **Kekurangan:** Sinyal SEO lokal tidak sekuat ccTLD (meskipun masih sangat efektif jika dilakukan dengan benar).
-
-> **Tips:** Jika Anda memiliki merek global dan ingin menjaga semuanya tetap sederhana, subdirektori seringkali menjadi pilihan terbaik. Jika Anda hanya menargetkan satu atau dua negara utama dan ingin benar-benar menekankan masing-masing, ccTLD mungkin menjadi pilihan yang tepat.
-
----
-
-## 3. Menguasai Penargetan Bahasa dengan Hreflang
-
 ### 3.1. Apa Itu Hreflang?
 
 Ketika Anda memiliki konten yang identik atau sangat mirip dalam beberapa bahasa, mesin pencari seperti Google bisa bingung versi mana yang harus ditampilkan kepada pengguna. **Hreflang** adalah atribut HTML yang memberi tahu mesin pencari bahasa (dan wilayah) mana yang ditujukan untuk halaman tertentu, serta halaman alternatif bahasa/ wilayah lainnya.
 
-### 3.2. Mengapa Ini Penting?
-
-1. Mencegah masalah **konten duplikat** (ketika mesin pencari mengira Anda menerbitkan konten yang sama berkali-kali).
-2. Memastikan **pengguna Prancis melihat versi bahasa Prancis**, **pengguna Spanyol melihat versi bahasa Spanyol**, dan seterusnya.
-3. Meningkatkan pengalaman pengguna secara keseluruhan, yang berarti keterlibatan lebih baik dan peringkat SEO yang lebih tinggi.
-
-### 3.3. Cara Menggunakan Hreflang di Tag `<head>`
-
-Dalam HTML Anda, tambahkan sesuatu seperti:
-
-```html
-<link rel="alternate" hreflang="en" href="https://example.com/en" />
-<link rel="alternate" hreflang="fr" href="https://example.com/fr" />
-<link rel="alternate" hreflang="es" href="https://example.com/es" />
-<link rel="alternate" hreflang="x-default" href="https://example.com/en" />
-```
-
-- **`hreflang="en"`**: Menunjukkan versi bahasa Inggris dari halaman tersebut.
-- **`hreflang="fr"`**: Menunjukkan versi bahasa Prancis dari halaman tersebut.
-- **`hreflang="es"`**: Menunjukkan versi bahasa Spanyol dari halaman tersebut.
-- **`hreflang="x-default"`**: Bahasa “fallback” atau URL default ketika tidak ada bahasa lain yang cocok dengan preferensi pengguna.
-
-> **Catatan Cepat:** Pastikan URL dalam tag ini langsung mengarah ke halaman akhir, tanpa pengalihan tambahan apapun.
-
----
-
-## 4. Membuat Konten Benar-Benar “Lokal” (Bukan Sekadar Diterjemahkan)
-
-, dan mungkin menyebutkan hari libur lokal atau detail khusus wilayah.
-
 ### 4.2. Menghindari Konten Duplikat
 
 Meskipun terjemahan sudah baik, mesin pencari dapat menandai situs Anda sebagai konten duplikat jika tampilannya terlalu mirip secara struktur. Hreflang membantu memperjelas bahwa halaman-halaman ini bukan duplikat, melainkan variasi bahasa.

package/blog/id/intlayer_with_i18next.md

@@ -27,12 +27,17 @@ history:
   - version: 7.0.0
     date: 2025-10-29
     changes: Berubah ke plugin syncJSON
+author: aymericzip
 ---
 
 # Cara mengotomatisasi terjemahan JSON i18next Anda menggunakan Intlayer
 
 <iframe title="Cara mengotomatisasi terjemahan JSON i18next Anda menggunakan Intlayer" class="m-auto aspect-16/9 w-full overflow-hidden rounded-lg border-0" allow="autoplay; gyroscope;" loading="lazy" width="1080" height="auto" src="https://www.youtube.com/embed/MpGMxniDHNg?autoplay=0&amp;origin=https://intlayer.org&amp;controls=0&amp;rel=1"/>
 
+## Daftar Isi
+
+<TOC/>
+
 ## Apa itu Intlayer?
 
 **Intlayer** adalah perpustakaan internasionalisasi sumber terbuka yang inovatif, dirancang untuk mengatasi kekurangan solusi i18n tradisional. Ini menawarkan pendekatan modern untuk manajemen konten dalam aplikasi JavaScript.
@@ -58,28 +63,46 @@ Panduan ini menunjukkan cara memanfaatkan sistem deklarasi konten Intlayer yang
 
 ## Panduan Langkah demi Langkah untuk Mengatur Intlayer dengan i18next
 
-### Langkah 1: Instalasi Dependensi
+<Steps>
+
+<Step number={1} title="Instalasi Dependensi">
 
 Instal paket-paket yang diperlukan:
 
+```bash packageManager="npm"
+npx intlayer-cli init --interactive
+```
+
+```bash packageManager="pnpm"
+pnpm dlx intlayer-cli init --interactive
+```
+
+```bash packageManager="yarn"
+yarn dlx intlayer-cli init --interactive
+```
+
+```bash packageManager="bun"
+bunx intlayer-cli 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. Misalnya:
+
 ```bash packageManager="npm"
 npm install intlayer @intlayer/sync-json-plugin --save-dev
-npx intlayer init
 ```
 
 ```bash packageManager="pnpm"
 pnpm add intlayer @intlayer/sync-json-plugin --save-dev
-pnpm intlayer init
 ```
 
 ```bash packageManager="yarn"
 yarn add intlayer @intlayer/sync-json-plugin --dev
-yarn intlayer init
 ```
 
 ```bash packageManager="bun"
 bun add intlayer @intlayer/sync-json-plugin --dev
-bun x intlayer init
 ```
 
 **Deskripsi paket:**
@@ -87,7 +110,9 @@ bun x intlayer init
 - **intlayer**: Perpustakaan inti untuk manajemen internasionalisasi, deklarasi konten, dan pembangunan
 - **@intlayer/sync-json-plugin**: Plugin untuk mengekspor deklarasi konten Intlayer ke format JSON yang kompatibel dengan i18next
 
-### Langkah 2: Terapkan plugin Intlayer untuk membungkus JSON
+</Step>
+
+<Step number={2} title="Terapkan plugin Intlayer untuk membungkus JSON">
 
 Buat file konfigurasi Intlayer untuk mendefinisikan locale yang didukung:
 
@@ -123,7 +148,9 @@ Jika perubahan dilakukan menggunakan CLI untuk menerjemahkan JSON, atau mengguna
 
 Untuk melihat lebih detail tentang plugin `syncJSON`, silakan merujuk ke [dokumentasi plugin syncJSON](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/plugins/sync-json.md).
 
-### (Opsional) Langkah 3: Implementasikan terjemahan JSON per-komponen
+</Step>
+
+<Step number={3} title="Implementasikan terjemahan JSON per-komponen">
 
 Secara default, Intlayer akan memuat, menggabungkan, dan menyinkronkan baik file JSON maupun file deklarasi konten. Lihat [dokumentasi deklarasi konten](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/dictionary/content_file.md) untuk informasi lebih lanjut. Namun jika Anda lebih suka, menggunakan plugin Intlayer, Anda juga dapat mengimplementasikan pengelolaan JSON terlokalisasi per-komponen di mana saja dalam basis kode Anda.
 
@@ -166,6 +193,10 @@ Ini akan memuat semua file JSON di direktori `src` yang cocok dengan pola `{key}
 
 ---
 
+</Step>
+
+</Steps>
+
 ## Konfigurasi Git
 
 Disarankan untuk mengabaikan file Intlayer yang dihasilkan secara otomatis:

package/blog/id/intlayer_with_next-i18next.md

@@ -23,6 +23,7 @@ history:
   - version: 7.0.0
     date: 2025-10-29
     changes: Berubah ke plugin syncJSON dan penulisan ulang secara menyeluruh
+author: aymericzip
 ---
 
 # Internasionalisasi Next.js (i18n) dengan next-i18next dan Intlayer
@@ -33,17 +34,6 @@ history:
 
 <TOC/>
 
-## Apa itu next-i18next?
-
-**next-i18next** adalah salah satu kerangka kerja internasionalisasi (i18n) yang paling populer untuk aplikasi Next.js. Dibangun di atas ekosistem **i18next** yang kuat, ia menyediakan solusi komprehensif untuk mengelola terjemahan, lokalisasi, dan pergantian bahasa dalam proyek Next.js.
-
-Namun, next-i18next memiliki beberapa tantangan:
-
-- **Konfigurasi yang kompleks**: Mengatur next-i18next memerlukan beberapa file konfigurasi dan penyiapan yang cermat untuk instance i18n di sisi server dan klien.
-- **Terjemahan yang tersebar**: File terjemahan biasanya disimpan di direktori yang terpisah dari komponen, sehingga lebih sulit untuk menjaga konsistensi.
-- **Manajemen namespace manual**: Pengembang perlu mengelola namespace secara manual dan memastikan pemuatan sumber daya terjemahan yang tepat.
-- **Keamanan tipe terbatas**: Dukungan TypeScript memerlukan konfigurasi tambahan dan tidak menyediakan pembuatan tipe otomatis untuk terjemahan.
-
 ## Apa itu Intlayer?
 
 **Intlayer** adalah perpustakaan internasionalisasi sumber terbuka yang inovatif, dirancang untuk mengatasi kekurangan solusi i18n tradisional. Ini menawarkan pendekatan modern untuk manajemen konten dalam aplikasi Next.js.
@@ -66,28 +56,46 @@ Panduan ini menunjukkan cara memanfaatkan sistem deklarasi konten unggulan Intla
 
 ## Panduan Langkah demi Langkah untuk Mengatur Intlayer dengan next-i18next
 
-### Langkah 1: Instalasi Dependensi
+<Steps>
+
+<Step number={1} title="Instalasi Dependensi">
 
 Instal paket yang diperlukan menggunakan manajer paket pilihan Anda:
 
+```bash packageManager="npm"
+npx intlayer-cli init --interactive
+```
+
+```bash packageManager="pnpm"
+pnpm dlx intlayer-cli init --interactive
+```
+
+```bash packageManager="yarn"
+yarn dlx intlayer-cli init --interactive
+```
+
+```bash packageManager="bun"
+bunx intlayer-cli 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. Misalnya:
+
 ```bash packageManager="npm"
 npm install intlayer @intlayer/sync-json-plugin --save-dev
-npx intlayer init
 ```
 
 ```bash packageManager="pnpm"
 pnpm add intlayer @intlayer/sync-json-plugin --save-dev
-pnpm intlayer init
 ```
 
 ```bash packageManager="yarn"
 yarn add intlayer @intlayer/sync-json-plugin --dev
-yarn intlayer init
 ```
 
 ```bash packageManager="bun"
 bun add intlayer @intlayer/sync-json-plugin --dev
-bun x intlayer init
 ```
 
 **Penjelasan paket:**
@@ -95,7 +103,9 @@ bun x intlayer init
 - **intlayer**: Perpustakaan inti untuk deklarasi dan manajemen konten
 - **@intlayer/sync-json-plugin**: Plugin untuk menyinkronkan deklarasi konten Intlayer ke format JSON i18next
 
-### Langkah 2: Implementasikan plugin Intlayer untuk membungkus JSON
+</Step>
+
+<Step number={2} title="Implementasikan plugin Intlayer untuk membungkus JSON">
 
 Buat file konfigurasi Intlayer untuk mendefinisikan locale yang didukung:
 
@@ -133,7 +143,9 @@ Untuk melihat lebih detail tentang plugin `syncJSON`, silakan merujuk ke [dokume
 
 ---
 
-### (Opsional) Langkah 3: Implementasikan terjemahan JSON per-komponen
+</Step>
+
+<Step number={3} title="Implementasikan terjemahan JSON per-komponen">
 
 Secara default, Intlayer akan memuat, menggabungkan, dan menyinkronkan baik file JSON maupun file deklarasi konten. Lihat [dokumentasi deklarasi konten](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/dictionary/content_file.md) untuk lebih detail. Namun jika Anda lebih suka, menggunakan plugin Intlayer, Anda juga dapat mengimplementasikan manajemen JSON per-komponen yang dilokalkan di mana saja dalam basis kode Anda.
 
@@ -176,6 +188,10 @@ Ini akan memuat semua file JSON di direktori `src` yang sesuai dengan pola `{key
 
 ---
 
+</Step>
+
+</Steps>
+
 ## Konfigurasi Git
 
 Kecualikan file yang dihasilkan dari kontrol versi: