diff --git a/docs/pages/folder/index.md b/docs/pages/folder/index.md index bd37551..faf0f31 100644 --- a/docs/pages/folder/index.md +++ b/docs/pages/folder/index.md @@ -1,22 +1,19 @@ +# Struktur Folder -## test ini judul folder +## Struktur Folder Utama +. +└── app/ + ├── [feature] + ├── error.tsx + ├── not-found.tsx + └── layout.tsx -```html -

hello

-``` +## Struktur Folder Fitur +. +└── [feature]/ + ├── $action + ├── $function + ├── $element + └── index.tsx -| Name | Age | -|------|-----| -| John | 20 | -```tsx -const hello = () => { - const ok = "yaaa"; - - return ( -

hello

- ) -} -``` - -hello `test` diff --git a/docs/pages/naming/file/index.md b/docs/pages/naming/file/index.md index 22d4aa8..ae00dd2 100644 --- a/docs/pages/naming/file/index.md +++ b/docs/pages/naming/file/index.md @@ -2,24 +2,49 @@ ## Element (Component) File Naming -There are 2 Element / Component in Next JS 14.\ -1. Server Component -2. Client Component +Next JS 14 memiliki fungsi untuk membedakan server component dan client component.\ +Server Component di render di Server.\ +Client Component di render di Client. -For Server Component use : server.[name].tsx -Example : server.table.tsx +Oleh karena itu penamaan pada file component di Next JS 14 sangat dibutuhkan.\ -For Client Component use : client.[name].tsx -Example : client.pagination.tsx +Untuk penamaan pada Server Component gunakan :\ +server.[name].tsx\ +contoh: server.table.tsx + +Untuk penamaan pada Client Component gunakan :\ +client.[name].tsx\ +contoh: client.table.tsx ## Function File Naming -- Under construction + +Fungsi juga dapat dibedakan menjadi server function dan client function. + +Untuk penamaan pada Server Function gunakan :\ +sfn.[name].tsx\ +contoh: sfn.table.constructor.tsx + +Untuk penamaan pada Client Function gunakan :\ +cfn.[name].tsx\ +contoh: cfn.create.user.tsx ## Action File Naming -- Under construction + +Action file digunakan untuk melakukan request API dari client component.\ + +Untuk penamaan pada Action File gunakan :\ +action.[name].tsx\ +contoh: action.create.user.tsx ## Constant File Naming -- Under Construction \ No newline at end of file + +Pada pemrograman kita seringkali membutuhkan data konstan untuk mendukung fungsi yang akan dijalankan.\ +Data konstan tersebut seringkali dipakai juga ditempat lain untuk menjalankan fungsi.\ +Jika konstan ditempatkan disetiap fungsi maka akan membuat kode semakin panjang.\ + +Diperlukan 1 file untuk menampung data konstan tersebut yang dapat dipanggil ketika diperlukan. + +Penamaan file pada constant adalah : constant.tsx \ No newline at end of file diff --git a/docs/pages/test/index.md b/docs/pages/test/index.md index e5f8823..a1468a5 100644 --- a/docs/pages/test/index.md +++ b/docs/pages/test/index.md @@ -25,4 +25,27 @@ const hello = () => { } ``` -hello `test` \ No newline at end of file +hello `test` + + +## test ini judul folder + +```html +

hello

+``` + +| Name | Age | +|------|-----| +| John | 20 | + +```tsx +const hello = () => { + const ok = "yaaa"; + + return ( +

hello

+ ) +} +``` + +hello `test`