@intlayer/docs 7.0.3 → 7.0.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (159) hide show
  1. package/blog/ar/intlayer_with_i18next.md +68 -106
  2. package/blog/ar/intlayer_with_next-i18next.md +84 -288
  3. package/blog/ar/intlayer_with_next-intl.md +58 -337
  4. package/blog/ar/intlayer_with_react-i18next.md +68 -290
  5. package/blog/ar/intlayer_with_react-intl.md +63 -266
  6. package/blog/de/intlayer_with_i18next.md +77 -97
  7. package/blog/de/intlayer_with_next-i18next.md +69 -296
  8. package/blog/de/intlayer_with_next-intl.md +59 -340
  9. package/blog/de/intlayer_with_react-i18next.md +68 -290
  10. package/blog/de/intlayer_with_react-intl.md +62 -264
  11. package/blog/en/intlayer_with_i18next.md +67 -103
  12. package/blog/en/intlayer_with_next-i18next.md +69 -294
  13. package/blog/en/intlayer_with_next-intl.md +48 -300
  14. package/blog/en/intlayer_with_react-i18next.md +61 -289
  15. package/blog/en/intlayer_with_react-intl.md +61 -284
  16. package/blog/en/next-i18next_vs_next-intl_vs_intlayer.md +1 -1
  17. package/blog/en-GB/intlayer_with_i18next.md +67 -103
  18. package/blog/en-GB/intlayer_with_next-i18next.md +71 -292
  19. package/blog/en-GB/intlayer_with_next-intl.md +58 -337
  20. package/blog/en-GB/intlayer_with_react-i18next.md +67 -289
  21. package/blog/en-GB/intlayer_with_react-intl.md +61 -264
  22. package/blog/es/intlayer_with_i18next.md +67 -103
  23. package/blog/es/intlayer_with_next-i18next.md +71 -296
  24. package/blog/es/intlayer_with_next-intl.md +57 -338
  25. package/blog/es/intlayer_with_react-i18next.md +68 -290
  26. package/blog/es/intlayer_with_react-intl.md +62 -265
  27. package/blog/fr/intlayer_with_i18next.md +66 -104
  28. package/blog/fr/intlayer_with_next-i18next.md +82 -285
  29. package/blog/fr/intlayer_with_next-intl.md +57 -338
  30. package/blog/fr/intlayer_with_react-i18next.md +67 -289
  31. package/blog/fr/intlayer_with_react-intl.md +61 -264
  32. package/blog/hi/intlayer_with_i18next.md +68 -104
  33. package/blog/hi/intlayer_with_next-i18next.md +74 -299
  34. package/blog/hi/intlayer_with_next-intl.md +57 -239
  35. package/blog/hi/intlayer_with_react-i18next.md +69 -291
  36. package/blog/hi/intlayer_with_react-intl.md +65 -268
  37. package/blog/id/intlayer_with_i18next.md +126 -0
  38. package/blog/id/intlayer_with_next-i18next.md +142 -0
  39. package/blog/id/intlayer_with_next-intl.md +113 -0
  40. package/blog/id/intlayer_with_react-i18next.md +124 -0
  41. package/blog/id/intlayer_with_react-intl.md +122 -0
  42. package/blog/it/intlayer_with_i18next.md +67 -103
  43. package/blog/it/intlayer_with_next-i18next.md +71 -296
  44. package/blog/it/intlayer_with_next-intl.md +57 -338
  45. package/blog/it/intlayer_with_react-i18next.md +68 -290
  46. package/blog/it/intlayer_with_react-intl.md +62 -265
  47. package/blog/ja/intlayer_with_i18next.md +68 -103
  48. package/blog/ja/intlayer_with_next-i18next.md +85 -283
  49. package/blog/ja/intlayer_with_next-intl.md +58 -336
  50. package/blog/ja/intlayer_with_react-i18next.md +68 -290
  51. package/blog/ja/intlayer_with_react-intl.md +62 -264
  52. package/blog/ko/intlayer_with_i18next.md +80 -96
  53. package/blog/ko/intlayer_with_next-i18next.md +85 -287
  54. package/blog/ko/intlayer_with_next-intl.md +68 -327
  55. package/blog/ko/intlayer_with_react-i18next.md +68 -290
  56. package/blog/ko/intlayer_with_react-intl.md +64 -266
  57. package/blog/pl/intlayer_with_i18next.md +126 -0
  58. package/blog/pl/intlayer_with_next-i18next.md +142 -0
  59. package/blog/pl/intlayer_with_next-intl.md +111 -0
  60. package/blog/pl/intlayer_with_react-i18next.md +124 -0
  61. package/blog/pl/intlayer_with_react-intl.md +122 -0
  62. package/blog/pt/intlayer_with_i18next.md +67 -103
  63. package/blog/pt/intlayer_with_next-i18next.md +72 -293
  64. package/blog/pt/intlayer_with_next-intl.md +57 -256
  65. package/blog/pt/intlayer_with_react-i18next.md +104 -78
  66. package/blog/pt/intlayer_with_react-intl.md +62 -266
  67. package/blog/ru/intlayer_with_i18next.md +66 -104
  68. package/blog/ru/intlayer_with_next-i18next.md +71 -296
  69. package/blog/ru/intlayer_with_next-intl.md +58 -337
  70. package/blog/ru/intlayer_with_react-i18next.md +68 -290
  71. package/blog/ru/intlayer_with_react-intl.md +62 -265
  72. package/blog/tr/intlayer_with_i18next.md +71 -107
  73. package/blog/tr/intlayer_with_next-i18next.md +72 -297
  74. package/blog/tr/intlayer_with_next-intl.md +58 -339
  75. package/blog/tr/intlayer_with_react-i18next.md +69 -291
  76. package/blog/tr/intlayer_with_react-intl.md +63 -285
  77. package/blog/vi/intlayer_with_i18next.md +126 -0
  78. package/blog/vi/intlayer_with_next-i18next.md +142 -0
  79. package/blog/vi/intlayer_with_next-intl.md +111 -0
  80. package/blog/vi/intlayer_with_react-i18next.md +124 -0
  81. package/blog/vi/intlayer_with_react-intl.md +122 -0
  82. package/blog/zh/intlayer_with_i18next.md +67 -102
  83. package/blog/zh/intlayer_with_next-i18next.md +72 -296
  84. package/blog/zh/intlayer_with_next-intl.md +58 -336
  85. package/blog/zh/intlayer_with_react-i18next.md +68 -290
  86. package/blog/zh/intlayer_with_react-intl.md +63 -106
  87. package/dist/cjs/generated/blog.entry.cjs +13 -1
  88. package/dist/cjs/generated/blog.entry.cjs.map +1 -1
  89. package/dist/cjs/generated/docs.entry.cjs +13 -1
  90. package/dist/cjs/generated/docs.entry.cjs.map +1 -1
  91. package/dist/cjs/generated/frequentQuestions.entry.cjs +13 -1
  92. package/dist/cjs/generated/frequentQuestions.entry.cjs.map +1 -1
  93. package/dist/cjs/generated/legal.entry.cjs +13 -1
  94. package/dist/cjs/generated/legal.entry.cjs.map +1 -1
  95. package/dist/esm/generated/blog.entry.mjs +13 -2
  96. package/dist/esm/generated/blog.entry.mjs.map +1 -1
  97. package/dist/esm/generated/docs.entry.mjs +13 -2
  98. package/dist/esm/generated/docs.entry.mjs.map +1 -1
  99. package/dist/esm/generated/frequentQuestions.entry.mjs +13 -2
  100. package/dist/esm/generated/frequentQuestions.entry.mjs.map +1 -1
  101. package/dist/esm/generated/legal.entry.mjs +13 -2
  102. package/dist/esm/generated/legal.entry.mjs.map +1 -1
  103. package/dist/types/generated/blog.entry.d.ts.map +1 -1
  104. package/dist/types/generated/docs.entry.d.ts.map +1 -1
  105. package/dist/types/generated/frequentQuestions.entry.d.ts.map +1 -1
  106. package/dist/types/generated/legal.entry.d.ts.map +1 -1
  107. package/docs/ar/plugins/sync-json.md +244 -0
  108. package/docs/de/plugins/sync-json.md +244 -0
  109. package/docs/de/releases/v7.md +1 -18
  110. package/docs/en/CI_CD.md +1 -1
  111. package/docs/en/configuration.md +1 -1
  112. package/docs/en/formatters.md +1 -1
  113. package/docs/en/how_works_intlayer.md +1 -1
  114. package/docs/en/intlayer_CMS.md +1 -1
  115. package/docs/en/intlayer_cli.md +26 -1
  116. package/docs/en/intlayer_with_nextjs_14.md +3 -1
  117. package/docs/en/intlayer_with_nextjs_15.md +3 -1
  118. package/docs/en/intlayer_with_nextjs_16.md +3 -1
  119. package/docs/en/intlayer_with_nextjs_page_router.md +1 -1
  120. package/docs/en/intlayer_with_nuxt.md +1 -1
  121. package/docs/en/intlayer_with_react_native+expo.md +1 -1
  122. package/docs/en/intlayer_with_react_router_v7.md +1 -1
  123. package/docs/en/intlayer_with_tanstack.md +1 -1
  124. package/docs/en/intlayer_with_vite+preact.md +1 -1
  125. package/docs/en/intlayer_with_vite+react.md +1 -1
  126. package/docs/en/intlayer_with_vite+solid.md +1 -1
  127. package/docs/en/intlayer_with_vite+svelte.md +1 -1
  128. package/docs/en/intlayer_with_vite+vue.md +1 -1
  129. package/docs/en/plugins/sync-json.md +1 -1
  130. package/docs/en/roadmap.md +1 -1
  131. package/docs/en-GB/plugins/sync-json.md +244 -0
  132. package/docs/es/plugins/sync-json.md +244 -0
  133. package/docs/es/releases/v7.md +1 -18
  134. package/docs/fr/intlayer_with_nextjs_16.md +2 -51
  135. package/docs/fr/plugins/sync-json.md +244 -0
  136. package/docs/fr/releases/v7.md +1 -18
  137. package/docs/hi/intlayer_with_nextjs_16.md +3 -2
  138. package/docs/hi/plugins/sync-json.md +244 -0
  139. package/docs/id/plugins/sync-json.md +244 -0
  140. package/docs/id/releases/v7.md +1 -18
  141. package/docs/it/plugins/sync-json.md +244 -0
  142. package/docs/it/releases/v7.md +1 -18
  143. package/docs/ja/intlayer_with_nextjs_16.md +44 -205
  144. package/docs/ja/plugins/sync-json.md +244 -0
  145. package/docs/ja/releases/v7.md +1 -18
  146. package/docs/ko/plugins/sync-json.md +244 -0
  147. package/docs/ko/releases/v7.md +1 -18
  148. package/docs/pl/plugins/sync-json.md +244 -0
  149. package/docs/pt/intlayer_with_nextjs_16.md +1 -52
  150. package/docs/pt/plugins/sync-json.md +244 -0
  151. package/docs/ru/plugins/sync-json.md +244 -0
  152. package/docs/tr/plugins/sync-json.md +245 -0
  153. package/docs/vi/plugins/sync-json.md +244 -0
  154. package/docs/zh/plugins/sync-json.md +244 -0
  155. package/package.json +14 -14
  156. package/src/generated/blog.entry.ts +26 -3
  157. package/src/generated/docs.entry.ts +26 -3
  158. package/src/generated/frequentQuestions.entry.ts +26 -3
  159. package/src/generated/legal.entry.ts +26 -3
@@ -0,0 +1,142 @@
1
+ ---
2
+ createdAt: 2025-08-23
3
+ updatedAt: 2025-10-29
4
+ title: Intlayer dan next-i18next
5
+ description: Integrasikan Intlayer dengan next-i18next untuk solusi internasionalisasi Next.js yang komprehensif
6
+ keywords:
7
+ - i18next
8
+ - next-i18next
9
+ - Intlayer
10
+ - Internasionalisasi
11
+ - Blog
12
+ - Next.js
13
+ - JavaScript
14
+ - React
15
+ slugs:
16
+ - blog
17
+ - intlayer-with-next-i18next
18
+ history:
19
+ - version: 7.0.0
20
+ date: 2025-10-29
21
+ changes: Berubah ke plugin syncJSON dan penulisan ulang yang komprehensif
22
+ ---
23
+
24
+ # Internasionalisasi Next.js (i18n) dengan next-i18next dan Intlayer
25
+
26
+ ## Daftar Isi
27
+
28
+ <TOC/>
29
+
30
+ ## Apa itu next-i18next?
31
+
32
+ **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.
33
+
34
+ Namun, next-i18next memiliki beberapa tantangan:
35
+
36
+ - **Konfigurasi yang kompleks**: Mengatur next-i18next memerlukan beberapa file konfigurasi dan pengaturan yang cermat untuk instance i18n di sisi server dan klien.
37
+ - **Terjemahan yang tersebar**: File terjemahan biasanya disimpan di direktori yang terpisah dari komponen, sehingga lebih sulit untuk menjaga konsistensi.
38
+ - **Manajemen namespace manual**: Pengembang perlu mengelola namespace secara manual dan memastikan pemuatan sumber daya terjemahan yang tepat.
39
+ - **Keamanan tipe terbatas**: Dukungan TypeScript memerlukan konfigurasi tambahan dan tidak menyediakan pembuatan tipe otomatis untuk terjemahan.
40
+
41
+ ## Apa itu Intlayer?
42
+
43
+ **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.
44
+
45
+ Lihat perbandingan konkret dengan next-intl dalam posting blog kami [next-i18next vs. next-intl vs. Intlayer](https://github.com/aymericzip/intlayer/blob/main/docs/blog/id/next-i18next_vs_next-intl_vs_intlayer.md).
46
+
47
+ ## Mengapa Menggabungkan Intlayer dengan next-i18next?
48
+
49
+ Sementara Intlayer menyediakan solusi i18n mandiri yang sangat baik (lihat [panduan integrasi Next.js](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/intlayer_with_nextjs_16.md) kami), Anda mungkin ingin menggabungkannya dengan next-i18next untuk beberapa alasan:
50
+
51
+ 1. **Basis kode yang sudah ada**: Anda memiliki implementasi next-i18next yang sudah mapan dan ingin secara bertahap bermigrasi ke pengalaman pengembang Intlayer yang lebih baik.
52
+ 2. **Persyaratan warisan**: Proyek Anda memerlukan kompatibilitas dengan plugin atau alur kerja i18next yang sudah ada.
53
+ 3. **Kenyamanan tim**: Tim Anda sudah terbiasa dengan next-i18next tetapi menginginkan manajemen konten yang lebih baik.
54
+
55
+ **Untuk itu, Intlayer dapat diimplementasikan sebagai adaptor untuk next-i18next guna membantu mengotomatisasi terjemahan JSON Anda di CLI atau pipeline CI/CD, menguji terjemahan Anda, dan lainnya.**
56
+
57
+ Panduan ini menunjukkan cara memanfaatkan sistem deklarasi konten Intlayer yang unggul sambil mempertahankan kompatibilitas dengan next-i18next.
58
+
59
+ ---
60
+
61
+ ## Panduan Langkah demi Langkah untuk Mengatur Intlayer dengan next-i18next
62
+
63
+ ### Langkah 1: Instalasi Dependensi
64
+
65
+ Pasang paket yang diperlukan menggunakan manajer paket pilihan Anda:
66
+
67
+ ```bash packageManager="npm"
68
+ npm install intlayer @intlayer/sync-json-plugin
69
+ ```
70
+
71
+ ```bash packageManager="pnpm"
72
+ pnpm add intlayer @intlayer/sync-json-plugin
73
+ ```
74
+
75
+ ```bash packageManager="yarn"
76
+ yarn add intlayer @intlayer/sync-json-plugin
77
+ ```
78
+
79
+ **Penjelasan paket:**
80
+
81
+ - **intlayer**: Perpustakaan inti untuk deklarasi dan manajemen konten
82
+ - **next-intlayer**: Lapisan integrasi Next.js dengan plugin build
83
+ - **i18next**: Kerangka kerja inti i18n
84
+ - **next-i18next**: Pembungkus Next.js untuk i18next
85
+ - **i18next-resources-to-backend**: Pemuat sumber daya dinamis untuk i18next
86
+ - **@intlayer/sync-json-plugin**: Plugin untuk menyinkronkan deklarasi konten Intlayer ke format JSON i18next
87
+
88
+ ### Langkah 2: Implementasikan plugin Intlayer untuk membungkus JSON
89
+
90
+ Buat file konfigurasi Intlayer untuk mendefinisikan locale yang didukung:
91
+
92
+ **Jika Anda juga ingin mengekspor kamus JSON untuk i18next**, tambahkan plugin `syncJSON`:
93
+
94
+ ```typescript fileName="intlayer.config.ts"
95
+ import { Locales, type IntlayerConfig } from "intlayer";
96
+ import { syncJSON } from "@intlayer/sync-json-plugin";
97
+
98
+ const config: IntlayerConfig = {
99
+ internationalization: {
100
+ locales: [Locales.ENGLISH, Locales.FRENCH, Locales.SPANISH],
101
+ defaultLocale: Locales.ENGLISH,
102
+ },
103
+ plugins: [
104
+ syncJSON({
105
+ source: ({ key, locale }) => `./messages/${locale}/${key}.json`,
106
+ }),
107
+ ],
108
+ };
109
+
110
+ export default config;
111
+ ```
112
+
113
+ Plugin `syncJSON` akan secara otomatis membungkus JSON. Plugin ini akan membaca dan menulis file JSON tanpa mengubah arsitektur konten.
114
+
115
+ Jika Anda ingin membuat JSON tersebut berdampingan dengan file deklarasi konten intlayer (`.content` files), Intlayer akan melanjutkan dengan cara berikut:
116
+
117
+ 1. memuat baik file JSON maupun file deklarasi konten dan mengubahnya menjadi kamus intlayer.
118
+ 2. jika terdapat konflik antara file JSON dan file deklarasi konten, Intlayer akan memproses penggabungan semua kamus tersebut. Tergantung pada prioritas plugin, dan prioritas file deklarasi konten (semua dapat dikonfigurasi).
119
+
120
+ Jika perubahan dilakukan menggunakan CLI untuk menerjemahkan JSON, atau menggunakan CMS, Intlayer akan memperbarui file JSON dengan terjemahan baru.
121
+
122
+ 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).
123
+
124
+ ---
125
+
126
+ ## Konfigurasi Git
127
+
128
+ Kecualikan file yang dihasilkan dari kontrol versi:
129
+
130
+ ```plaintext fileName=".gitignore"
131
+ # Abaikan file yang dihasilkan oleh Intlayer
132
+ .intlayer
133
+ intl
134
+ ```
135
+
136
+ File-file ini secara otomatis dihasilkan ulang selama proses build dan tidak perlu dikomit ke repositori Anda.
137
+
138
+ ### Ekstensi VS Code
139
+
140
+ Untuk meningkatkan pengalaman pengembang, pasang **Ekstensi VS Code Intlayer** resmi:
141
+
142
+ [Pasang dari VS Code Marketplace](https://marketplace.visualstudio.com/items?itemName=intlayer.intlayer-vs-code-extension)
@@ -0,0 +1,113 @@
1
+ ---
2
+ createdAt: 2025-01-02
3
+ updatedAt: 2025-10-29
4
+ title: Cara mengotomatiskan terjemahan JSON next-intl Anda menggunakan Intlayer
5
+ description: Otomatiskan terjemahan JSON Anda dengan Intlayer dan next-intl untuk peningkatan internasionalisasi dalam aplikasi Next.js.
6
+ slugs:
7
+ - blog
8
+ - intlayer-with-next-intl
9
+ history:
10
+ - version: 7.0.0
11
+ date: 2025-10-29
12
+ changes: Berubah ke plugin syncJSON
13
+ ---
14
+
15
+ # Cara mengotomatiskan terjemahan JSON next-intl Anda menggunakan Intlayer
16
+
17
+ ## Apa itu Intlayer?
18
+
19
+ **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.
20
+
21
+ Lihat perbandingan konkret dengan next-intl dalam posting blog kami [next-i18next vs. next-intl vs. Intlayer](https://github.com/aymericzip/intlayer/blob/main/docs/blog/id/next-i18next_vs_next-intl_vs_intlayer.md).
22
+
23
+ ## Mengapa Menggabungkan Intlayer dengan next-intl?
24
+
25
+ Meskipun Intlayer menyediakan solusi i18n mandiri yang sangat baik (lihat [panduan integrasi Next.js](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/intlayer_with_nextjs_16.md)), Anda mungkin ingin menggabungkannya dengan next-intl karena beberapa alasan:
26
+
27
+ 1. **Basis kode yang sudah ada**: Anda memiliki implementasi next-intl yang sudah mapan dan ingin secara bertahap bermigrasi ke pengalaman pengembang Intlayer yang lebih baik.
28
+ 2. **Persyaratan warisan**: Proyek Anda memerlukan kompatibilitas dengan plugin atau alur kerja next-intl yang sudah ada.
29
+ 3. **Kenyamanan Tim**: Tim Anda sudah terbiasa dengan next-intl tetapi menginginkan manajemen konten yang lebih baik.
30
+
31
+ **Untuk itu, Intlayer dapat diimplementasikan sebagai adaptor untuk next-intl guna membantu mengotomatisasi terjemahan JSON Anda dalam CLI atau pipeline CI/CD, menguji terjemahan Anda, dan lainnya.**
32
+
33
+ Panduan ini menunjukkan cara memanfaatkan sistem deklarasi konten unggulan Intlayer sambil mempertahankan kompatibilitas dengan next-intl.
34
+
35
+ ## Daftar Isi
36
+
37
+ <TOC/>
38
+
39
+ ## Panduan Langkah demi Langkah untuk Mengatur Intlayer dengan next-intl
40
+
41
+ ### Langkah 1: Instalasi Dependensi
42
+
43
+ Instal paket-paket yang diperlukan:
44
+
45
+ ```bash packageManager="npm"
46
+ npm install intlayer @intlayer/sync-json-plugin
47
+ ```
48
+
49
+ ```bash packageManager="pnpm"
50
+ pnpm add intlayer @intlayer/sync-json-plugin
51
+ ```
52
+
53
+ ```bash packageManager="yarn"
54
+ yarn add intlayer @intlayer/sync-json-plugin
55
+ ```
56
+
57
+ **Deskripsi paket:**
58
+
59
+ - **intlayer**: Perpustakaan inti untuk manajemen internasionalisasi, deklarasi konten, dan pembangunan
60
+ - **@intlayer/sync-json-plugin**: Plugin untuk mengekspor deklarasi konten Intlayer ke format JSON yang kompatibel dengan next-intl
61
+
62
+ ### Langkah 2: Implementasikan plugin Intlayer untuk membungkus JSON
63
+
64
+ Buat file konfigurasi Intlayer untuk mendefinisikan locale yang didukung:
65
+
66
+ **Jika Anda juga ingin mengekspor kamus JSON untuk next-intl**, tambahkan plugin `syncJSON`:
67
+
68
+ ```typescript fileName="intlayer.config.ts"
69
+ import { Locales, type IntlayerConfig } from "intlayer";
70
+ import { syncJSON } from "@intlayer/sync-json-plugin";
71
+
72
+ const config: IntlayerConfig = {
73
+ internationalization: {
74
+ locales: [Locales.ENGLISH, Locales.FRENCH, Locales.SPANISH],
75
+ defaultLocale: Locales.ENGLISH,
76
+ },
77
+ plugins: [
78
+ syncJSON({
79
+ source: ({ key, locale }) => `./messages/${locale}/${key}.json`,
80
+ }),
81
+ ],
82
+ };
83
+
84
+ export default config;
85
+ ```
86
+
87
+ Plugin `syncJSON` akan secara otomatis membungkus JSON. Plugin ini akan membaca dan menulis file JSON tanpa mengubah arsitektur kontennya.
88
+
89
+ Jika Anda ingin membuat JSON tersebut berdampingan dengan file deklarasi konten intlayer (`.content` files), Intlayer akan melanjutkan dengan cara berikut:
90
+
91
+ 1. memuat baik file JSON maupun file deklarasi konten dan mengubahnya menjadi kamus intlayer.
92
+ 2. jika terdapat konflik antara JSON dan file deklarasi konten, Intlayer akan memproses penggabungan semua kamus tersebut. Tergantung pada prioritas plugin, dan prioritas file deklarasi konten (semua dapat dikonfigurasi).
93
+
94
+ Jika perubahan dilakukan menggunakan CLI untuk menerjemahkan JSON, atau menggunakan CMS, Intlayer akan memperbarui file JSON dengan terjemahan baru.
95
+
96
+ ## Konfigurasi Git
97
+
98
+ Disarankan untuk mengabaikan file Intlayer yang dihasilkan secara otomatis:
99
+
100
+ ```plaintext fileName=".gitignore"
101
+ # Abaikan file yang dihasilkan oleh Intlayer
102
+ .intlayer
103
+ ```
104
+
105
+ File-file ini dapat dihasilkan ulang selama proses build Anda dan tidak perlu dikomit ke kontrol versi.
106
+
107
+ ### Ekstensi VS Code
108
+
109
+ Untuk pengalaman pengembang yang lebih baik, pasang **Ekstensi Intlayer VS Code** resmi:
110
+
111
+ [Pasang dari VS Code Marketplace](https://marketplace.visualstudio.com/items?itemName=intlayer.intlayer-vs-code-extension)
112
+
113
+ [Pasang dari VS Code Marketplace](https://marketplace.visualstudio.com/items?itemName=intlayer.intlayer-vs-code-extension)
@@ -0,0 +1,124 @@
1
+ ---
2
+ createdAt: 2025-01-02
3
+ updatedAt: 2025-10-29
4
+ title: Cara mengotomatisasi terjemahan JSON react-i18next Anda menggunakan Intlayer
5
+ description: Otomatiskan terjemahan JSON Anda dengan Intlayer dan react-i18next untuk meningkatkan internasionalisasi dalam aplikasi React.
6
+ keywords:
7
+ - react-i18next
8
+ - i18next
9
+ - Intlayer
10
+ - Internasionalisasi
11
+ - i18n
12
+ - Blog
13
+ - React
14
+ - JavaScript
15
+ - TypeScript
16
+ - Manajemen Konten
17
+ slugs:
18
+ - blog
19
+ - intlayer-with-react-i18next
20
+ history:
21
+ - version: 7.0.0
22
+ date: 2025-10-29
23
+ changes: Berubah ke plugin syncJSON
24
+ ---
25
+
26
+ # Cara mengotomatisasi terjemahan JSON react-i18next Anda menggunakan Intlayer
27
+
28
+ ## Apa itu Intlayer?
29
+
30
+ **Intlayer** adalah perpustakaan internasionalisasi sumber terbuka yang inovatif, dirancang untuk mengatasi kekurangan solusi i18n tradisional. Ini menawarkan pendekatan modern untuk manajemen konten dalam aplikasi React.
31
+
32
+ Lihat perbandingan konkret dengan react-i18next dalam posting blog kami [react-i18next vs. react-intl vs. Intlayer](https://github.com/aymericzip/intlayer/blob/main/docs/blog/id/react-i18next_vs_react-intl_vs_intlayer.md).
33
+
34
+ ## Mengapa Menggabungkan Intlayer dengan react-i18next?
35
+
36
+ Meskipun Intlayer menyediakan solusi i18n mandiri yang sangat baik (lihat [panduan integrasi React kami](https://github.com/aymericzip/intlayer/blob/main/docs/docs/id/intlayer_with_vite+react.md)), Anda mungkin ingin menggabungkannya dengan react-i18next untuk beberapa alasan:
37
+
38
+ 1. **Basis kode yang sudah ada**: Anda memiliki implementasi react-i18next yang sudah mapan dan ingin secara bertahap bermigrasi ke pengalaman pengembang Intlayer yang lebih baik.
39
+ 2. **Persyaratan warisan**: Proyek Anda memerlukan kompatibilitas dengan plugin atau alur kerja react-i18next yang sudah ada.
40
+ 3. **Kenyamanan tim**: Tim Anda sudah terbiasa dengan react-i18next tetapi menginginkan manajemen konten yang lebih baik.
41
+
42
+ **Untuk itu, Intlayer dapat diimplementasikan sebagai adaptor untuk react-i18next guna membantu mengotomatisasi terjemahan JSON Anda di CLI atau pipeline CI/CD, menguji terjemahan Anda, dan lainnya.**
43
+
44
+ Panduan ini menunjukkan cara memanfaatkan sistem deklarasi konten unggulan Intlayer sambil mempertahankan kompatibilitas dengan react-i18next.
45
+
46
+ ## Daftar Isi
47
+
48
+ <TOC/>
49
+
50
+ ## Panduan Langkah demi Langkah untuk Mengatur Intlayer dengan react-i18next
51
+
52
+ ### Langkah 1: Instalasi Dependensi
53
+
54
+ Instal paket yang diperlukan:
55
+
56
+ ```bash packageManager="npm"
57
+ npm install intlayer @intlayer/sync-json-plugin
58
+ ```
59
+
60
+ ```bash packageManager="pnpm"
61
+ pnpm add intlayer @intlayer/sync-json-plugin
62
+ ```
63
+
64
+ ```bash packageManager="yarn"
65
+ yarn add intlayer @intlayer/sync-json-plugin
66
+ ```
67
+
68
+ **Deskripsi paket:**
69
+
70
+ - **intlayer**: Perpustakaan inti untuk manajemen internasionalisasi, deklarasi konten, dan pembangunan
71
+ - **@intlayer/sync-json-plugin**: Plugin untuk mengekspor deklarasi konten Intlayer ke format JSON yang kompatibel dengan react-i18next
72
+
73
+ ### Langkah 2: Implementasikan plugin Intlayer untuk membungkus JSON
74
+
75
+ Buat file konfigurasi Intlayer untuk mendefinisikan locale yang didukung:
76
+
77
+ **Jika Anda juga ingin mengekspor kamus JSON untuk react-i18next**, tambahkan plugin `syncJSON`:
78
+
79
+ ```typescript fileName="intlayer.config.ts"
80
+ import { Locales, type IntlayerConfig } from "intlayer";
81
+ import { syncJSON } from "@intlayer/sync-json-plugin";
82
+
83
+ const config: IntlayerConfig = {
84
+ internationalization: {
85
+ locales: [Locales.ENGLISH, Locales.FRENCH, Locales.SPANISH],
86
+ defaultLocale: Locales.ENGLISH,
87
+ },
88
+ plugins: [
89
+ syncJSON({
90
+ source: ({ key, locale }) => `./messages/${locale}/${key}.json`,
91
+ }),
92
+ ],
93
+ };
94
+
95
+ export default config;
96
+ ```
97
+
98
+ Plugin `syncJSON` akan secara otomatis membungkus JSON. Plugin ini akan membaca dan menulis file JSON tanpa mengubah arsitektur kontennya.
99
+
100
+ Jika Anda ingin membuat JSON tersebut berdampingan dengan file deklarasi konten intlayer (`.content` files), Intlayer akan melanjutkan dengan cara berikut:
101
+
102
+ 1. memuat kedua file JSON dan file deklarasi konten lalu mengubahnya menjadi kamus intlayer.
103
+ 2. jika ada konflik antara JSON dan file deklarasi konten, Intlayer akan memproses penggabungan semua kamus tersebut. Tergantung pada prioritas plugin, dan prioritas file deklarasi konten (semua dapat dikonfigurasi).
104
+
105
+ Jika perubahan dilakukan menggunakan CLI untuk menerjemahkan JSON, atau menggunakan CMS, Intlayer akan memperbarui file JSON dengan terjemahan baru.
106
+
107
+ 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).
108
+
109
+ ## Konfigurasi Git
110
+
111
+ Disarankan untuk mengabaikan file Intlayer yang dihasilkan secara otomatis:
112
+
113
+ ```plaintext fileName=".gitignore"
114
+ # Abaikan file yang dihasilkan oleh Intlayer
115
+ .intlayer
116
+ ```
117
+
118
+ File-file ini dapat dibuat ulang selama proses build Anda dan tidak perlu dikomit ke kontrol versi.
119
+
120
+ ### Ekstensi VS Code
121
+
122
+ Untuk pengalaman pengembang yang lebih baik, pasang **Ekstensi VS Code Intlayer** resmi:
123
+
124
+ [Pasang dari VS Code Marketplace](https://marketplace.visualstudio.com/items?itemName=intlayer.intlayer-vs-code-extension)
@@ -0,0 +1,122 @@
1
+ ---
2
+ createdAt: 2025-01-02
3
+ updatedAt: 2025-10-29
4
+ title: Cara mengotomatisasi terjemahan JSON react-intl Anda menggunakan Intlayer
5
+ description: Otomatiskan terjemahan JSON Anda dengan Intlayer dan react-intl untuk meningkatkan internasionalisasi dalam aplikasi React.
6
+ keywords:
7
+ - react-intl
8
+ - Intlayer
9
+ - Internasionalisasi
10
+ - Blog
11
+ - i18n
12
+ - JavaScript
13
+ - React
14
+ - FormatJS
15
+ slugs:
16
+ - blog
17
+ - intlayer-with-react-intl
18
+ history:
19
+ - version: 7.0.0
20
+ date: 2025-10-29
21
+ changes: Berubah ke plugin syncJSON
22
+ ---
23
+
24
+ # Cara mengotomatisasi terjemahan JSON react-intl Anda menggunakan Intlayer
25
+
26
+ ## Apa itu Intlayer?
27
+
28
+ **Intlayer** adalah perpustakaan internasionalisasi sumber terbuka yang inovatif, dirancang untuk mengatasi kekurangan solusi i18n tradisional. Ini menawarkan pendekatan modern untuk manajemen konten dalam aplikasi React.
29
+
30
+ Lihat perbandingan konkret dengan react-intl di posting blog kami [react-i18next vs. react-intl vs. Intlayer](https://github.com/aymericzip/intlayer/blob/main/docs/blog/en/react-i18next_vs_react-intl_vs_intlayer.md).
31
+
32
+ ## Mengapa Menggabungkan Intlayer dengan react-intl?
33
+
34
+ Meskipun Intlayer menyediakan solusi i18n mandiri yang sangat baik (lihat [panduan integrasi React](https://github.com/aymericzip/intlayer/blob/main/docs/docs/en/intlayer_with_vite+react.md)), Anda mungkin ingin menggabungkannya dengan react-intl untuk beberapa alasan:
35
+
36
+ 1. **Basis kode yang sudah ada**: Anda memiliki implementasi react-intl yang sudah mapan dan ingin secara bertahap bermigrasi ke pengalaman pengembang Intlayer yang lebih baik.
37
+ 2. **Persyaratan warisan**: Proyek Anda memerlukan kompatibilitas dengan plugin atau alur kerja react-intl yang sudah ada.
38
+ 3. **Kenyamanan tim**: Tim Anda sudah terbiasa dengan react-intl tetapi menginginkan manajemen konten yang lebih baik.
39
+
40
+ **Untuk itu, Intlayer dapat diimplementasikan sebagai adaptor untuk react-intl guna membantu mengotomatisasi terjemahan JSON Anda di CLI atau pipeline CI/CD, menguji terjemahan Anda, dan lainnya.**
41
+
42
+ Panduan ini menunjukkan cara memanfaatkan sistem deklarasi konten Intlayer yang unggul sambil mempertahankan kompatibilitas dengan react-intl.
43
+
44
+ ## Daftar Isi
45
+
46
+ <TOC/>
47
+
48
+ ## Panduan Langkah demi Langkah untuk Mengatur Intlayer dengan react-intl
49
+
50
+ ### Langkah 1: Instalasi Dependensi
51
+
52
+ Pasang paket yang diperlukan:
53
+
54
+ ```bash packageManager="npm"
55
+ npm install intlayer @intlayer/sync-json-plugin
56
+ ```
57
+
58
+ ```bash packageManager="pnpm"
59
+ pnpm add intlayer @intlayer/sync-json-plugin
60
+ ```
61
+
62
+ ```bash packageManager="yarn"
63
+ yarn add intlayer @intlayer/sync-json-plugin
64
+ ```
65
+
66
+ **Deskripsi paket:**
67
+
68
+ - **intlayer**: Perpustakaan inti untuk manajemen internasionalisasi, deklarasi konten, dan pembangunan
69
+ - **@intlayer/sync-json-plugin**: Plugin untuk mengekspor deklarasi konten Intlayer ke format JSON yang kompatibel dengan react-intl
70
+
71
+ ### Langkah 2: Implementasikan plugin Intlayer untuk membungkus JSON
72
+
73
+ Buat file konfigurasi Intlayer untuk mendefinisikan locale yang didukung:
74
+
75
+ **Jika Anda juga ingin mengekspor kamus JSON untuk react-intl**, tambahkan plugin `syncJSON`:
76
+
77
+ ```typescript fileName="intlayer.config.ts"
78
+ import { Locales, type IntlayerConfig } from "intlayer";
79
+ import { syncJSON } from "@intlayer/sync-json-plugin";
80
+
81
+ const config: IntlayerConfig = {
82
+ internationalization: {
83
+ locales: [Locales.ENGLISH, Locales.FRENCH, Locales.SPANISH],
84
+ defaultLocale: Locales.ENGLISH,
85
+ },
86
+ plugins: [
87
+ syncJSON({
88
+ source: ({ key, locale }) => `./intl/messages/${locale}/${key}.json`,
89
+ }),
90
+ ],
91
+ };
92
+
93
+ export default config;
94
+ ```
95
+
96
+ Plugin `syncJSON` akan secara otomatis membungkus JSON. Plugin ini akan membaca dan menulis file JSON tanpa mengubah arsitektur konten.
97
+
98
+ Jika Anda ingin membuat JSON tersebut berdampingan dengan file deklarasi konten intlayer (`.content` files), Intlayer akan melanjutkan dengan cara berikut:
99
+
100
+ 1. memuat baik file JSON maupun file deklarasi konten dan mengubahnya menjadi kamus intlayer.
101
+ 2. jika terdapat konflik antara file JSON dan file deklarasi konten, Intlayer akan memproses penggabungan semua kamus tersebut. Tergantung pada prioritas plugin, dan prioritas file deklarasi konten (semua dapat dikonfigurasi).
102
+
103
+ Jika perubahan dilakukan menggunakan CLI untuk menerjemahkan JSON, atau menggunakan CMS, Intlayer akan memperbarui file JSON dengan terjemahan baru.
104
+
105
+ 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).
106
+
107
+ ## Konfigurasi Git
108
+
109
+ Disarankan untuk mengabaikan file Intlayer yang dihasilkan secara otomatis:
110
+
111
+ ```plaintext fileName=".gitignore"
112
+ # Abaikan file yang dihasilkan oleh Intlayer
113
+ .intlayer
114
+ ```
115
+
116
+ File-file ini dapat dihasilkan ulang selama proses build Anda dan tidak perlu dikomit ke kontrol versi.
117
+
118
+ ### Ekstensi VS Code
119
+
120
+ Untuk meningkatkan pengalaman pengembang, instal **Ekstensi VS Code Intlayer** resmi:
121
+
122
+ [Pasang dari VS Code Marketplace](https://marketplace.visualstudio.com/items?itemName=intlayer.intlayer-vs-code-extension)