diff --git a/src/content/docs/id/ascendia-himarpl/01-overview.mdx b/src/content/docs/id/ascendia-himarpl/01-overview.mdx new file mode 100644 index 0000000..044481f --- /dev/null +++ b/src/content/docs/id/ascendia-himarpl/01-overview.mdx @@ -0,0 +1,67 @@ +--- +title: Pengantar +description: Pengantar untuk Website Kabinet Ascendia milik HIMARPL +--- + +{/* ! When translating this file, please add ../ to the image path ! */} +![Ascendia-himarpl preview taken November 2024](../../../../assets/preview/ascendia-himarpl.png) + +[ascendia.himarpl.com](https://ascendia.himarpl.com) adalah situs web resmi untuk Kabinet Ascendia pada Himpunan Mahasiswa Rekayasa Perangkat Lunak (HIMARPL) di Universitas Pendidikan Indonesia. Situs web ini dibangun menggunakan Next.js dengan T3 Stack dan di-_deploy_ di Vercel. + +## Fitur Utama + +- Informasi Penting tentang Dedikasi +- Visualisasi Struktur Organisasi +- Integrasi Berita & Pembaruan +- Halaman Informasi Departemen +- Komponen UI Interaktif +- Desain Responsif +- Animasi yang Halus + +## Library yang Digunakan + +**Dependensi Inti** + - Next.js (^14.1.4) + - React (18.2.0) + - React DOM (18.2.0) + - TypeScript (^5.4.2) + +**Basis Data & API** + - Prisma (@prisma/client ^5.22.0) + - tRPC (@trpc/client, @trpc/next, @trpc/react-query, @trpc/server) + - Axios (^1.7.2) + +**UI & Styling** + - Radix UI Components (berbagai paket @radix-ui/*) + - Tailwind CSS (^3.4.1) + - Tailwind Typography Plugin (@tailwindcss/typography ^0.5.12) + - Framer Motion (^11.2.12) + - Embla Carousel (embla-carousel-react ^8.1.5) + - Auto Animate (@formkit/auto-animate ^0.8.2) + - React Simple Icons (@icons-pack/react-simple-icons ^9.4.0) + - Lucide React Icons (^0.363.0) + +**Utilitas** + - Zod (^3.23.8) + - Moment (^2.30.1) + - Sharp (^0.33.3) + - Superjson (^2.2.1) + - PostHog (posthog-js ^1.144.2) + - Next Themes (^0.3.0) + +**Alat Pengembangan** + - ESLint (^8.57.0) + - Prettier (^3.2.5) + - Berbagai plugin dan konfigurasi ESLint + +## Dukungan + +Untuk pertanyaan atau masalah: + +- Kunjungi GitHub Issues +- Hubungi Departemen Kominfo +- Kunjungi [himarpl.com](https://www.himarpl.com) + +## Lisensi + +Proyek ini dilisensikan di bawah Lisensi MIT - lihat _file_ [LICENSE](https://github.com/himarplupi/ascendia-himarpl/blob/main/LICENSE) untuk detailnya. diff --git a/src/content/docs/id/ascendia-himarpl/02-setup.mdx b/src/content/docs/id/ascendia-himarpl/02-setup.mdx new file mode 100644 index 0000000..8cd3262 --- /dev/null +++ b/src/content/docs/id/ascendia-himarpl/02-setup.mdx @@ -0,0 +1,146 @@ +--- +title: Konfigurasi Pengembangan Lokal +description: Bagaimana cara untuk melakukan konfigurasi website Kabinet Ascendia HIMARPL untuk pengembangan lokal +--- + +import { Tabs, TabItem } from "@astrojs/starlight/components"; +import { Steps } from "@astrojs/starlight/components"; +import { Code } from "@astrojs/starlight/components"; + +Panduan ini akan memandu Anda melalui pengaturan _environment_ pengembangan lokal untuk situs web Ascendia Cabinet HIMARPL. + +## Prasyarat + +Sebelum menginstal aplikasi, pastikan Anda memiliki: + +1. [Node.js](https://nodejs.org/en) dan [npm](https://www.npmjs.com/) terinstal +2. [Git](https://git-scm.com/) terinstal +3. Akses ke layanan berikut: + - Akun CockroachDB + - Akun PostHog (opsional) + +## Detail Pengaturan Lingkungan + +Proyek ini memerlukan beberapa _environment variable_ yang harus diatur dalam _file_ `.env` agar berfungsi dengan baik. + +### Pengaturan CockroachDB + +Ikuti [Panduan Cepat CockroachDB](https://www.cockroachlabs.com/docs/cockroachcloud/quickstart) untuk mendapatkan `DATABASE_URL` Anda. + +## Langkah-langkah Pengaturan + + + +1. _Fork_ dan _clone_ repositorinya: + + + + + + + + + + + + + +2. Lakukan navigasi ke direktori proyek: + + ```bash + cd ascendia-himarpl + ``` + +3. Buat _file_ _environment variables_: + Buat file `.env` pada direktori utama dengan _variables_ berikut: + + ```bash + DATABASE_URL= + NEXT_PUBLIC_BASE_URL="http://localhost:3000" + NEXT_PUBLIC_BASE_PATH="" + NEXT_BASE_URL="http://localhost:3000" + NEXT_PUBLIC_POSTHOG_KEY= + NEXT_PUBLIC_POSTHOG_HOST=https://us.i.posthog.com + ``` + +4. Atur _remote_ _upstream_: + + + + + + + + + + + + + +5. Unduh dependensi dan mulai server pengembangannya: + + ```bash + npm ci # Install dependencies + npm run db:push # Push database schema to CockroachDB + npm run dev # Start development server + ``` + + Sekarang, aplikasinya seharusnya berjalan pada `http://localhost:3000`. + +6. Buat _branch_ baru untuk perubahan yang Anda lakukan + + ```bash + git checkout -b my-feature-branch + ``` + + +7. Setelah Anda puas dengan perubahannya, _add_ dan _commit_ perubahan tersebut pada _branch_ Anda, kemudian _push_ _branch_ Anda ke repositori _fork_. + + ```bash + git add . + git commit # Please follow the commit guidelines below + git push -u origin my-feature-branch + ``` + + :::note[IMPORTANT] + Sebelum melakukan _commit_ dan membuka _Pull Request_, tolong baca [Commit Guidelines](/getting-started/05-contribution-guide/#commit-guidelines) dan [Pull Request Policy](/getting-started/05-contribution-guide/#pull-request-policy) berikut. + ::: + +8. Buat _Pull Request_. + :::note[NOTE] + Kami mengimbau kepada pembuat PR untuk menghindari _rebasing_/memperbarui PR Anda dengan `main` _branch_ secara tidak perlu. + ::: + + +## Perintah yang tersedia + +- `npm run dev` - Memulai server pengembangan dengan _hot reload_ +- `npm run build` - Membuat _build_ produksi +- `npm run start` - Memulai server produksi +- `npm run db:push` - Mendorong skema basis data ke CockroachDB +- `npm run db:studio` - Membuka Prisma Studio untuk manajemen basis data +- `npm run lint` - Menjalankan pemeriksaan _linting_ \ No newline at end of file diff --git a/src/content/docs/id/ascendia-himarpl/03-folder-structure.mdx b/src/content/docs/id/ascendia-himarpl/03-folder-structure.mdx new file mode 100644 index 0000000..e81ee4b --- /dev/null +++ b/src/content/docs/id/ascendia-himarpl/03-folder-structure.mdx @@ -0,0 +1,178 @@ +--- +title: Struktur Folder +description: Struktur Folder Situs Web Ascendia Kabinet HIMARPL +--- + +import { FileTree } from '@astrojs/starlight/components'; + + +- prisma/ # Database management (Prisma ORM) + - schema.prisma # Database schema definitions and relationships +- public/ # Static assets (images, fonts, etc.) +- src/ # Main source code directory + - app/ # Next.js 13+ App Router directory + - api/ # API routes + - trpc/ # tRPC API configuration + - [trpc]/ # tRPC dynamic routes + - contact/ # Contact page feature + - page.tsx # Contact page component + - about/ # About section with dynamic routing + - [type]/ # Dynamic route for different types + - [department]/ # Nested dynamic route for departments + - page.tsx + - logo-philosophy/ # Logo philosophy section + - page.tsx + - dedication/ # Dedication page feature + - page.tsx + - news/ # News feature + - page.tsx + - page.tsx # Homepage + - layout.tsx # Root layout + - components/ # React components organized by feature + - about/ # About page components + - brand/ # Branding related components + - contact/ # Contact page components + - common/ # Shared components across features + - global-footer.tsx # Footer component + - dedication/ # Dedication page components + - logo-philosophy/ # Logo philosophy components + - motion/ # Animation components + - news/ # News feature components + - ui/ # Reusable UI components (shadcn/ui) + - hooks/ # Custom React hooks + - lib/ # Utility functions and shared logic + - utils.ts # General utility functions + - styles/ # Styling files + - globals.css # Global CSS styles + - server/ # Server-side code + - api/ # Server-side API implementations + - trpc/ # tRPC configurations and routers + - env.js # Environment variable validation (t3-env) + + +## Penjelasan Struktur Direktori + +Proyek ini mengikuti arsitektur [T3 Stack](https://create.t3.gg/), yang menekankan _type-safety_ dan modularitas. Struktur dri atas menunjukkan susunan folder kami yang berbasis fitur, pemisahan kode klien/server yang jelas, dan mengikuti ketentuan Next.js App Router. + +### Direktori Utama + +- **prisma/**: Berisi _file_ yang berkaitan dengan basis data menggunakan Prisma ORM + - `schema.prisma`: Mendefinisikan model basis data, hubungan, dan konfigurasi +- **public/**: Aset statis yang disajikan langsung + - Gambar, _font_, dan _resources_ publik lainnya +- **src/**: Direktori _source code_ utama yang berisi semua kode aplikasi + +### Direktori Aplikasi (Next.js App Router) + +Direktori `app/` mengikuti ketentuan Next.js 13+ App Router: + +- **api/**: Rute API back-end + - `trpc/`: Konfigurasi dan _endpoint_ API tRPC +- **Halaman berbasis fitur**: Setiap fitur utama memiliki direktori sendiri + - `about/`, `contact/`, `news/`, dll. + - Masing-masing berisi `page.tsx` untuk _view_ utama +- **Rute Dinamis**: Menggunakan _routing_ berbasis _file_ Next.js + - `[type]/`: Rute dinamis untuk berbagai jenis departemen + - `[department]/`: Rute dinamis yang bersifat _nested_ untuk halaman departemen + +### Direktori Komponen + +Komponen disusun berdasarkan fitur dan tanggung jawab: + +- **Komponen Fitur**: Dikelompokkan berdasarkan fitur + - `about/`: Komponen khusus halaman _about_ + - `contact/`: Komponen halaman _contact_ + - `news/`: Komponen fitur _news_ + +- **Komponen Umum**: Dipakai pada seluruh fitur + - `common/`: Komponen global seperti _header_ dan _footer_ + - `motion/`: Komponen animasi dan transisi + - `ui/`: Komponen UI yang dapat digunakan kembali (menggunakan shadcn/ui) + - Tombol, formulir, modal, dll. + - Konfigurasi tema dan komponen dasar + +### Direktori Inti + +- **hooks/**: _Custom React hooks_ untuk logika bersama +- **lib/**: Utilitas inti dan logika bersama + - Pembantu otentikasi + - Utilitas umum + - Definisi dari _type_ +- **server/**: Kode khusus pada sisi server + - Implementasi API + - Utilitas server +- **trpc/**: Konfigurasi dan _router_ tRPC + - Definisi rute API + - Prosedur _type-safe_ + +### Styles + +- **styles/**: Konfigurasi _styling_ global + - `globals.css`: _Style_ CSS global, konfigurasi Tailwind, dan konfigurasi tema Shadcn/UI + + +## Mengimpor File + +Untuk mengimpor _file_, Anda dapat menggunakan alias `@/`. Alias ini dikonfigurasi secara otomatis dalam proyek. + +```tsx title="src/app/news/page.tsx" +import { FadeIn } from "@/components/motion/fade-in"; +import { MotionText } from "@/components/motion/motion-text"; +import { UnderlineHover } from "@/components/motion/underline-hover"; +import { NewsCard } from "@/components/news/news-card"; +import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar"; +import { buttonVariants } from "@/components/ui/button"; +import { abbreviation, cn, momentId } from "@/lib/utils"; +import { api } from "@/trpc/server"; +``` + +Pendekatan ini sangat berguna ketika Anda bekerja pada proyek besar dengan banyak _file_ dan _folder_ dan dapat dilakukan dengan memperbarui _file_ tsconfig.json menjadi berikut: + +
+Konfigurasi Typescript + +```diff lang="json" title="tsconfig.json" +{ + "compilerOptions": { + /* Base Options: */ + "esModuleInterop": true, + "skipLibCheck": true, + "target": "es2022", + "allowJs": true, + "resolveJsonModule": true, + "moduleDetection": "force", + "isolatedModules": true, + + /* Strictness */ + "strict": true, + "noUncheckedIndexedAccess": true, + "checkJs": true, + + /* Bundled projects */ + "lib": ["dom", "dom.iterable", "ES2022"], + "noEmit": true, + "module": "ESNext", + "moduleResolution": "Bundler", + "jsx": "preserve", + "plugins": [{ "name": "next" }], + "incremental": true, + + /* Path Aliases */ + "baseUrl": ".", ++ "paths": { ++ "@/*": ["./src/*"] ++ } + }, + "include": [ + ".eslintrc.cjs", + "next-env.d.ts", + "**/*.ts", + "**/*.tsx", + "**/*.cjs", + "**/*.js", + ".next/types/**/*.ts" + ], + "exclude": ["node_modules", "lint-staged.config.js", "commitlint.config.js"] +} +``` +
diff --git a/src/content/docs/id/ascendia-himarpl/04-environment-vars-config.mdx b/src/content/docs/id/ascendia-himarpl/04-environment-vars-config.mdx new file mode 100644 index 0000000..5f675f4 --- /dev/null +++ b/src/content/docs/id/ascendia-himarpl/04-environment-vars-config.mdx @@ -0,0 +1,123 @@ +--- +title: Environment Variables dan Konfigurasinya +description: Belajar bagaimana cara mengatur environment variables dan konfigurasi lainnya pada proyek situs web milik Ascendia HIMARPL. +--- + +Mengelola _environment variables_ dalam proyek kami adalah hal yang penting, namun juga menantang. Proyek ini menggunakan _environment variables_ untuk manajemen konfigurasi, memanfaatkan [t3-env](https://github.com/t3-oss/t3-env) untuk _environment variables_ yang _type-safe_ dengan _runtime validation_. Ketika Anda menambahkan _environment variables_ baru, Anda perlu memperbarui _file_ `.env.example` dan _file_ `src/env.js` untuk memastikan semuanya berjalan dengan benar. + +## File Konfigurasi + +### 1. Skema Environment (`src/env.js`) + +_File_ `env.js` mendefinisikan skema dan aturan validasi untuk semua _environment variables_ menggunakan Zod. Ini dibagi menjadi tiga bagian utama: + +```javascript title="src/env.js" +export const env = createEnv({ + // Server-side variables + server: { + DATABASE_URL: z.string().url(), + NODE_ENV: z.enum(["development", "test", "production"]).default("development"), + BASE_URL: z.string().url(), + BASE_PATH: z.string().optional(), + }, + + // Client-side variables (must be prefixed with NEXT_PUBLIC_) + client: { + NEXT_PUBLIC_POSTHOG_KEY: z.string(), + NEXT_PUBLIC_POSTHOG_HOST: z.string().url(), + }, + + // Runtime environment mapping + runtimeEnv: { + // ... variable mappings + DATABASE_URL: process.env.DATABASE_URL, + NODE_ENV: process.env.NODE_ENV, + BASE_URL: process.env.NEXT_PUBLIC_BASE_URL + ? process.env.NEXT_PUBLIC_BASE_URL + : process.env.NEXT_PUBLIC_VERCEL_URL + ? `https://${process.env.NEXT_PUBLIC_VERCEL_URL}` + : "https://himarpl.com", + // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing + BASE_PATH: process.env.NEXT_PUBLIC_BASE_PATH || "", + NEXT_PUBLIC_POSTHOG_KEY: process.env.NEXT_PUBLIC_POSTHOG_KEY, + NEXT_PUBLIC_POSTHOG_HOST: process.env.NEXT_PUBLIC_POSTHOG_HOST, + } +}); +``` + +### 2. File Environment (`.env`) + +Buat _file_ `.env` pada _root_ utama proyek dengan _values_ yang spesifik pada _environment_ Anda: + +```bash +# Database Configuration +DATABASE_URL="your-database-url" + +# Base URL Configuration +NEXT_PUBLIC_BASE_URL="http://localhost:3000" +NEXT_PUBLIC_BASE_PATH="" + +# PostHog Analytics +NEXT_PUBLIC_POSTHOG_KEY="your-posthog-key" +NEXT_PUBLIC_POSTHOG_HOST="https://us.i.posthog.com" +``` + +## Fitur Utama + +- **Type-Safety**: Semua _environment variables_ divalidasi saat _build_ dan _runtime_ +- **Runtime Validation**: Memastikan aplikasi Anda tidak dibangun dengan _environment variables_ yang tidak valid +- **Keamanan Client-Side**: Pemisahan yang jelas antara server dan variabel klien +- **Nilai Default**: Cadangan untuk variabel tertentu ketika tidak disebutkan +- **Penanganan String Kosong**: String kosong diperlakukan sebagai _undefined_ secara _default_ + +## Panduan Penggunaan + +1. **Variabel Server-Side**: + - Diakses menggunakan `env.VARIABLE_NAME` + - Tidak pernah diekspos ke klien + - Contoh: `env.DATABASE_URL` + +2. **Variabel Client-Side**: + - Harus diawali dengan `NEXT_PUBLIC_` + - Dapat diakses di kode server dan klien + - Contoh: `env.NEXT_PUBLIC_POSTHOG_KEY` + +3. **Pengembangan**: + - Buat _file_ `.env` lokal berdasarkan `.env.example` + - Jangan pernah melakukan _commit_ `.env` ke _version control_ + - Perbarui skema `env.js` saat menambahkan variabel baru + + +## Contoh Penggunaan + +```javascript title="src/server/db.ts" {1, 7, 16} +import { env } from "@/env"; +import { PrismaClient } from "@prisma/client"; + +const createPrismaClient = () => + new PrismaClient({ + log: + env.NODE_ENV === "development" ? ["query", "error", "warn"] : ["error"], + }); + +const globalForPrisma = globalThis as unknown as { + prisma: ReturnType | undefined; +}; + +export const db = globalForPrisma.prisma ?? createPrismaClient(); + +if (env.NODE_ENV !== "production") globalForPrisma.prisma = db; + +``` + +Anda dapat mengakses _environment variables_ pada kode seperti ini: + +```javascript +import { env } from "@/env.js"; + +// Server-side usage +const dbUrl = env.DATABASE_URL; + +// Client-side usage +const posthogKey = env.NEXT_PUBLIC_POSTHOG_KEY; +``` \ No newline at end of file diff --git a/src/content/docs/id/ascendia-himarpl/05-rules-and-conventions.mdx b/src/content/docs/id/ascendia-himarpl/05-rules-and-conventions.mdx new file mode 100644 index 0000000..ff3d61d --- /dev/null +++ b/src/content/docs/id/ascendia-himarpl/05-rules-and-conventions.mdx @@ -0,0 +1,107 @@ +--- +title: Peraturan dan Ketentuan +description: Mempelajari tentang aturan dan ketentuan yang digunakan dalam proyek situs web milik Ascendia HIMARPL. +--- + +Untuk menegakkan gaya kode yang konsisten dan menghindari masalah umum dalam basis kode, kami memiliki serangkaian aturan dan ketentuan yang kami ikuti dan terapkan di seluruh proyek. + +## Typescript + +Pengantar ini menggunakan TypeScript untuk menyediakan _type-safety_ dan menghindari _bug_ umum dalam basis kode. Konfigurasi proyek didasarkan pada T3 Stack dengan beberapa pembaruan. + +Jika Anda belum familiar dengan TypeScript, Anda bisa memeriksa artikel ini untuk mempelajari lebih lanjut : [Typescript for React Developers](https://elazizi.com/posts/how-to-learn-typescript-for-react-developers/) + +Anda bisa menemukan informasi lebih lanjut [di sini](https://create.t3.gg/en/usage/typescript). + +## Penamaan + +Kami mengikuti kabab-case untuk penamaan _file_ dan _folder_ karena kami pikir itu adalah cara paling mudah untuk dibaca dan konsisten untuk menamai _file_ dan _folder_ dalam proyek besar, serta merupakan cara paling umum untuk menamai _file_ dan _folder_ di komunitas React. + +Contoh penamaan kabab-case: `my-component.tsx` + +Untuk penamaan variabel, _function_, _class_, _interface_, dan _enum_, kami menggunakan camelCase karena itu adalah cara yang paling umum untuk menamai variabel di komunitas React. + +Contoh penamaan camelCase: `const myFunction = () => {}` + + +## Linting + +Menggunakan _linter_ adalah keharusan dalam proyek JavaScript mana pun. Untuk memulainya, kami menggunakan ESLint dengan konfigurasi T3 Stack dan beberapa aturan khusus untuk memastikan bahwa kami mengikuti aturan dan ketentuan terkait penamaan _file_, _class_ pada Tailwind CSS, _type_ pada TypeScript, urutan impor, dan lainnya. + +Berikut adalah _file_ konfigurasi ESLint lengkap: + +```javascript title="eslintrc.cjs" +/** @type {import("eslint").Linter.Config} */ +const config = { + parser: "@typescript-eslint/parser", + parserOptions: { + project: true, + }, + plugins: ["@typescript-eslint", "unused-imports", "simple-import-sort"], + extends: [ + "next/core-web-vitals", + "plugin:@typescript-eslint/recommended-type-checked", + "plugin:@typescript-eslint/stylistic-type-checked", + "prettier", + ], + rules: { + // These opinionated rules are enabled in stylistic-type-checked above. + // Feel free to reconfigure them to your own preference. + "import/prefer-default-export": "off", + "@typescript-eslint/array-type": "off", + "@typescript-eslint/consistent-type-definitions": "off", + + "simple-import-sort/imports": [ + "error", + { + groups: [ + // `react` first, `next` second, then packages starting with a character + ["^react$", "^next", "^[a-z]"], + // Packages starting with `@` + ["^@"], + // Packages starting with `~` + ["^~"], + // Imports starting with `../` + ["^\\.\\.(?!/?$)", "^\\.\\./?$"], + // Imports starting with `./` + ["^\\./(?=.*/)(?!/?$)", "^\\.(?!/?$)", "^\\./?$"], + // Style imports + ["^.+\\.s?css$"], + // Side effect imports + ["^\\u0000"], + ], + }, + ], + "simple-import-sort/exports": "error", // Export configuration for `eslint-plugin-simple-import-sort` + + "unused-imports/no-unused-imports": "error", + "unused-imports/no-unused-vars": [ + "error", + { + argsIgnorePattern: "^_", + varsIgnorePattern: "^_", + caughtErrorsIgnorePattern: "^_", + }, + ], + + "@typescript-eslint/consistent-type-imports": [ + "warn", + { + prefer: "type-imports", + fixStyle: "inline-type-imports", + }, + ], + + "@typescript-eslint/no-unused-vars": ["warn", { argsIgnorePattern: "^_" }], + "@typescript-eslint/require-await": "off", + "@typescript-eslint/no-misused-promises": [ + "error", + { + checksVoidReturn: { attributes: false }, + }, + ], + }, +}; + +module.exports = config; +``` diff --git a/src/content/docs/id/ascendia-himarpl/06-future-consideration.mdx b/src/content/docs/id/ascendia-himarpl/06-future-consideration.mdx new file mode 100644 index 0000000..f5d0422 --- /dev/null +++ b/src/content/docs/id/ascendia-himarpl/06-future-consideration.mdx @@ -0,0 +1,23 @@ +--- +title: Pertimbangan Masa Depan +description: Memandang kedepan, apa selanjutnya untuk situs web HIMARPL? +--- + +Halo! 👋 Mari kita bicara tentang beberapa hal penting yang perlu diingat untuk kabinet HIMARPL mendatangn ketika mereka membangu versi mereka sendiri dari situs web organisasi ini. + +## Apa yang Kami Pelajari + +- **Kami Butuh Desainer!** Saat ini, situs web kami dibangun tanpa desainer UI/UX, yang berarti seharusnya tampilannya bisa terlihat dan terasa jauh lebih baik. Kabinet mendatang sebaiknya mencoba untuk mendapatkan desainer di departemen Kominfo untuk membuat situs lebih ramah pengguna dan lebih menakjubkan secara visual. + +- **Dilema Animasi** Kami telah memikirkan sesuatu yang menarik - sementara animasi membuat situs lebih interaktif dan menyenangkan, secara tidak langsung juga dapat memperlambat kinerja dan tidak bagus untuk SEO. Tim mendatang mungkin ingin: + - Menghapus beberapa animasi + - Mencoba _Tech Stack_ yang berbeda + - Menemukan keseimbangan yang lebih baik antara efek yang keren dan performa + +## Tips untuk Tim Mendatang + +- **Pertahankan yang Berfungsi:** Silakan memakai struktur dasar situs web kami - halaman beranda, halaman _about_, halaman dedikasi, dll. Ini adalah fondasi yang solid! + +- **Jadikan Milik Anda Sendiri:** Meskipun _layout_ saat ini bagus, jangan takut untuk mencoba _tools_ atau teknologi yang berbeda yang mungkin bekerja lebih baik untuk Anda. Inovasi selalu diterima! + +- **Jangan Lupakan Footer:** Salah satu yang wajib ada adalah komponen _footer_ global - ini membantu pengguna menavigasi antara semua halaman situs web HIMARPL dengan mudah. Anggaplah sebagai perekat yang menyatukan semuanya! 🔗 \ No newline at end of file diff --git a/src/content/docs/id/getting-started/01-introduction.mdx b/src/content/docs/id/getting-started/01-introduction.mdx index 9a7a0a7..fb61f87 100644 --- a/src/content/docs/id/getting-started/01-introduction.mdx +++ b/src/content/docs/id/getting-started/01-introduction.mdx @@ -5,11 +5,11 @@ description: Pengantar Dokumentasi Teknis HIMARPL dan tujuannya ![Cabinet Ascendia HIMARPL Members](https://cdn.jsdelivr.net/gh/himarplupi/assets-himarpl@v1.3.2/www/bg/bg-home-1.png) -Selamat datang di dokumentasi resmi untuk proyek open-source milik HIMARPL! Dokumentasi ini berfungsi sebagai panduan komprehensif untuk seluruh proyek dan sumber daya teknis di HIMARPL UPI (Himpunan Mahasiswa Rekayasa Perangkat Lunak Universitas Pendidikan Indonesia). +Selamat datang di dokumentasi resmi untuk proyek _open-source_ milik HIMARPL! Dokumentasi ini berfungsi sebagai panduan komprehensif untuk seluruh proyek dan sumber daya teknis di HIMARPL UPI (Himpunan Mahasiswa Rekayasa Perangkat Lunak Universitas Pendidikan Indonesia). ## Apa itu HIMARPL? -HIMARPL (Himpunan Mahasiswa Rekayasa Perangkat Lunak) adalah Himpunan Mahasiswa Rekayasa Perangkat Lunak yang ada di Universitas Pendidikan Indonesia. Kami memelihara beberapa proyek open-source yang mendukung infrastruktur digital organisasi kami, mulai dari situs web utama kami hingga platform blog mirip Medium untuk staf dan kolaborator kami. +HIMARPL (Himpunan Mahasiswa Rekayasa Perangkat Lunak) adalah Himpunan Mahasiswa Rekayasa Perangkat Lunak yang ada di Universitas Pendidikan Indonesia. Kami memelihara beberapa proyek _open-source_ yang mendukung infrastruktur digital organisasi kami, mulai dari situs web utama kami hingga platform blog mirip Medium untuk staf dan kolaborator kami. ## Untuk siapakah ini? @@ -38,7 +38,7 @@ Dokumentasi ini didesain untuk: - Studi kasus terbaik dan standar yang terdokumentasi - Panduan pemeliharaan untuk tim di masa depan -## Kumpulan Teknologi Kami +## Tech Stack Kami Proyek HIMARPL telah menggunakan teknologi web yang sudah modern, seperti: @@ -46,13 +46,13 @@ Proyek HIMARPL telah menggunakan teknologi web yang sudah modern, seperti: - **Dokumentasi**: Astro, Starlight - **Deployment**: Vercel, GitHub Actions -Untuk informasi lebih rinci, silakan merujuk ke bagian [kumpulan teknologi](/overview/02-tech-stack). +Untuk informasi lebih rinci, silakan merujuk ke bagian [kumpulan teknologi](/id/overview/02-tech-stack/). ## Memulai Cara terbaik untuk memulai adalah dengan: -1. Menjelajahi [project overview kami](/id/getting-started/03-opensource-projects) +1. Menjelajahi [pengantar proyek kami](/id/getting-started/03-opensource-projects) 2. Memahami cara [berkontribusi](/id/getting-started/02-contributors-collaborators) 3. Memeriksa [repositori GitHub kami](https://github.com/himarplupi) diff --git a/src/content/docs/id/getting-started/02-contributors-collaborators.mdx b/src/content/docs/id/getting-started/02-contributors-collaborators.mdx index 40e9a98..2a9f1a9 100644 --- a/src/content/docs/id/getting-started/02-contributors-collaborators.mdx +++ b/src/content/docs/id/getting-started/02-contributors-collaborators.mdx @@ -9,8 +9,8 @@ Memahami peran kontributor dan kolaborator dalam proyek HIMARPL Kontributor adalah siapa saja yang berkontribusi pada proyek HIMARPL melalui: -- Membuat isu/PRs -- Mengomentari isu/PRs +- Membuat isu/PR (Pull Request) +- Mengomentari isu/PR - Memperbaiki bug - Menambahkan fitur - Memperbarui dokumentasi @@ -24,7 +24,7 @@ Kolaborator adalah anggota tim yang aktif berpartisipasi dalam diskusi dan penga - Meninjau isu/PR - Mengelola isu/PR - Melakukan tinjauan pada kode -- Menerima atau menolak pull request +- Menerima atau menolak Pull Request - Memelihara repositori Ini termasuk staf HIMARPL dan pemelihara web di Departemen Kominfo. diff --git a/src/content/docs/id/getting-started/03-opensource-projects.mdx b/src/content/docs/id/getting-started/03-opensource-projects.mdx index f5c3dd5..9f796b3 100644 --- a/src/content/docs/id/getting-started/03-opensource-projects.mdx +++ b/src/content/docs/id/getting-started/03-opensource-projects.mdx @@ -3,7 +3,7 @@ title: Proyek Open-Source pada HIMARPL description: Daftar serta penjelasan tentang proyek open-source pada HIMARPL --- -HIMARPL memelihara beberapa proyek open-source yang dapat dikontribusikan oleh siapa saja: +HIMARPL memelihara beberapa proyek _open-source_ yang dapat dikontribusikan oleh siapa saja: - [ascendia-himarpl](https://github.com/himarplupi/ascendia-himarpl) - Situs web utama kabinet HIMARPL saat ini - [blog-himarpl](https://github.com/himarplupi/blog-himarpl) - Platform blog staf HIMARPL diff --git a/src/content/docs/id/getting-started/04-staff-guide.mdx b/src/content/docs/id/getting-started/04-staff-guide.mdx index 52fb522..e3dc557 100644 --- a/src/content/docs/id/getting-started/04-staff-guide.mdx +++ b/src/content/docs/id/getting-started/04-staff-guide.mdx @@ -27,7 +27,7 @@ Berikut adalah daftar singkat teknologi yang perlu dipelajari oleh staf baru Kom - CockroachDB - Desain skema database -4. **Frontend** 🎨 +4. **Front-end** 🎨 - React.js - Next.js 14 (App Router) - TypeScript @@ -81,15 +81,15 @@ Sebagai anggota staf di Kominfo, Anda akan bertanggung jawab untuk: ## Prosedur Harian ### 1. Pemeliharaan Reguler -- Melakukan backup mingguan -- Memeriksa log sistem +- Melakukan _backup_ mingguan +- Memeriksa _log_ sistem - Memantau laporan kesalahan - Memperbarui konten jika diperlukan ### 2. Manajemen Masalah - Memantau masalah GitHub - Menanggapi laporan pengguna -- Mengkoordinasikan perbaikan bug +- Mengkoordinasikan perbaikan _bug_ - Melacak permintaan fitur ### 3. Komunikasi Tim @@ -145,7 +145,7 @@ Perhatikan perubahan yang akan datang ini: 3. Subdomain Acara - [lomba.himarpl.com](https://lomba.himarpl.com) - Tersedia untuk acara mendatang - - Dapat menggunakan repo yang ada atau membuat yang baru sesuai kebutuhan + - Dapat menggunakan repositori yang ada atau membuat yang baru sesuai kebutuhan ## Input Data Staf Baru @@ -153,14 +153,14 @@ Ikuti langkah-langkah ini untuk menambahkan anggota staf baru: 1. **Akses Panel Admin** - Buka [admin.himarpl.com](https://admin.himarpl.com) - - Login menggunakan akun utama HIMARPL + - _Login_ menggunakan akun utama HIMARPL 2. **Navigasi ke Bagian Staf** - Buka bagian `Staff` - Ubah periode ke tahun saat ini (misalnya, 2025) :::note[CATATAN] -Jika tidak ada data untuk periode saat ini, Anda dapat menambahkannya secara manual menggunakan prisma studio. +Jika tidak ada data untuk periode saat ini, Anda dapat menambahkannya secara manual menggunakan Prisma Studio. ::: 3. **Siapkan Gambar Staf** @@ -179,6 +179,6 @@ Anda dapat merujuk data staf periode sebelumnya untuk melihat contoh data entri ## Bacaan Lebih Lanjut -1. [Ringkasan Infrastruktur](/id/overview/01-infrastructure) -2. [Ringkasan Kumpulan Teknologi](/id/overview/02-tech-stack) -3. [Manajemen Konfigurasi & Rahasia](/id/overview/03-configuration-secrets) +1. [Pengantar Infrastruktur](/id/overview/01-infrastructure) +2. [Pengantar Kumpulan Teknologi](/id/overview/02-tech-stack) +3. [Manajemen Konfigurasi & Rahasia](/id/overview/03-configuration-secrets) \ No newline at end of file diff --git a/src/content/docs/id/getting-started/05-contribution-guide.mdx b/src/content/docs/id/getting-started/05-contribution-guide.mdx index bed66aa..aa9d6db 100644 --- a/src/content/docs/id/getting-started/05-contribution-guide.mdx +++ b/src/content/docs/id/getting-started/05-contribution-guide.mdx @@ -7,27 +7,27 @@ Sebelum berkontribusi, harap baca: - Kode Etik - Panduan Kontribusi -- Sertifikat Asal untuk Pengembang 1.1 +- _Developer Certificate of Origin_ 1.1 -di setiap repositori yang akan Anda kontribusikan di bagian [proyek open-source](/getting-started/04-opensource-projects). +di setiap repositori yang akan Anda kontribusikan di bagian [proyek _open-source_](/id/getting-started/04-opensource-projects). ## Panduan Commit -- Ikuti spesifikasi Conventional Commits -- Tanda tangani commit Anda (disarankan) -- Pesan commit tidak boleh diakhiri dengan titik -- Sertakan tipe yang sesuai (feat, fix, docs, dll.) +- Ikuti spesifikasi _Conventional Commits_ +- Tanda tangani _commit_ Anda (disarankan) +- Pesan _commit_ tidak boleh diakhiri dengan titik +- Sertakan tipe yang sesuai (_feat_, _fix_, _docs_, dll.) ## Kebijakan Pull Request (PR) -PR harus memenuhi persyaratan ini sebelum di-merge: +PR harus memenuhi persyaratan ini sebelum di-_merge_: - Semua pemeriksaan status yang diperlukan harus lolos - Semua diskusi harus diselesaikan -- Beberapa commit harus di-squash -- Ikuti template PR +- Beberapa _commit_ harus di-_squash_ +- Ikuti _template_ PR -## Sertifikat Asal untuk Pengembang 1.1 +## Developer Certificate of Origin 1.1 ``` Dengan berkontribusi pada proyek ini, saya menyatakan bahwa: diff --git a/src/content/docs/id/overview/01-infrastructure.mdx b/src/content/docs/id/overview/01-infrastructure.mdx index 84ad857..cb4e5e6 100644 --- a/src/content/docs/id/overview/01-infrastructure.mdx +++ b/src/content/docs/id/overview/01-infrastructure.mdx @@ -3,7 +3,7 @@ title: Pengantar Infrastruktur description: Panduan untuk Infrastruktur Cloud dan Arsitektur Teknis pada HIMARPL --- -HIMARPL memanfaatkan infrastruktur cloud modern untuk membangun aplikasi yang handal, dapat ditingkatkan, dan mudah dipelihara. +HIMARPL memanfaatkan infrastruktur _cloud_ modern untuk membangun aplikasi yang handal, dapat ditingkatkan, dan mudah dipelihara. ## Proyek Inti @@ -25,27 +25,27 @@ Setiap proyek menerapkan arsitektur tiga lapisan: UI modern dibangun dengan: -- 🎨 [TailwindCSS](https://tailwindcss.com/) - Styling berbasis utilitas +- 🎨 [TailwindCSS](https://tailwindcss.com/) - _Styling_ berbasis utilitas - 🧩 [Shadcn/UI](https://ui.shadcn.com/docs) - Komponen yang dapat digunakan kembali - ✨ [Motion](https://motion.dev) - Animasi halus - 🔄 [Tanstack Query](https://tanstack.com/query) - Pengambilan data #### 2. Lapisan Tengah ([T3 Stack](https://create.t3.gg/)) -Integrasi type-safe backend menggunakan: +Integrasi _type-safe_ _back-end_ menggunakan: -- [TypeScript](https://www.typescriptlang.org/) - Type safety -- [Next.js](https://nextjs.org/) - Kerangka kerja React -- [tRPC](https://trpc.io/) - API dengan type-safe end-to-end +- [TypeScript](https://www.typescriptlang.org/) - _Type-Safety_ +- [Next.js](https://nextjs.org/) - _Framework_ React +- [tRPC](https://trpc.io/) - API dengan _type-safe end-to-end_ - [Prisma](https://www.prisma.io/) - ORM basis data - [NextAuth](https://next-auth.js.org/) - Otentikasi -#### 3. Lapisan Backend (Next.js API Routes) +#### 3. Lapisan Back-end (Next.js API Routes) -Logika server-side dengan: +Logika _server-side_ dengan: -- Proxy analitik ([Integrasi PostHog](https://posthog.com/docs/advanced/proxy/nextjs)) -- [tRPC Router](https://trpc.io/docs/server/routers) - Endpoint API +- _Proxy_ analitik ([Integrasi PostHog](https://posthog.com/docs/advanced/proxy/nextjs)) +- [tRPC Router](https://trpc.io/docs/server/routers) - _Endpoint_ API - [tRPC Procedures](https://trpc.io/docs/server/procedures) - Logika bisnis - [@tRPC Next](https://trpc.io/docs/nextjs) - Integrasi Next.js @@ -56,18 +56,18 @@ Layanan inti yang digunakan di semua proyek: #### Basis Data ([CockroachDB](https://www.cockroachlabs.com/)) - Basis data SQL terdistribusi -- Menangani cross-project data +- Menangani _cross-project_ data #### Analitik ([PostHog](https://posthog.com/)) -- Pelacakan user behavior +- Pelacakan _user behavior_ - Pemantauan kinerja - Analitik terpusat #### Rate Limiting ([Upstash](https://upstash.com/)) -- Rate limiting berbasis Redis -- Rate limiting API +- _Rate limiting_ berbasis Redis +- _Rate limiting_ API ## Proyek Khusus Acara @@ -79,7 +79,7 @@ Kami memelihara proyek ringan untuk acara dan kebutuhan sementara: - `lomba-himarpl` - Situs web kompetisi - `mabim-himarpl` - Situs web orientasi mahasiswa -Ini menggunakan teknologi front-end only yang disederhanakan: +Ini menggunakan teknologi _front-end only_ yang disederhanakan: - Next.js + React - Styling TailwindCSS @@ -117,11 +117,23 @@ Bot Telegram kami menggunakan arsitektur khusus: - [NeonDB](https://neon.tech/) (PostgreSQL) - [Upstash](https://upstash.com/) Redis -## Deployment +## Penerapan +:::note +**Catatan Penting untuk Staf Kominfo** -Kami menggunakan [Vercel](https://vercel.com/) untuk Deployment dengan: +Proyek Vercel baru memerlukan pengaturan GitHub Actions secara manual: -- 🚀 Produksi Deployment yang otomatis -- 🔍 Pratinjau Deployment untuk PR +1. Buat repositori GitHub di [HIMARPL UPI](https://github.com/himarplupi) +2. Buat proyek Vercel (gunakan akun GitHub HIMARPL utama, bukan organisasi) +3. Dapatkan _deployment token_ Vercel +4. Atur GitHub Actions + +[Lihat panduan pengaturan](https://vercel.com/guides/how-can-i-use-github-actions-with-vercel) +::: + +Kami menggunakan [Vercel](https://vercel.com/) untuk _Deployment_ dengan: + +- 🚀 Produksi _Deployment_ yang otomatis +- 🔍 Pratinjau _Deployment_ untuk PR (_Pull Request_) - ⚡️ Dukungan Edge Functions diff --git a/src/content/docs/id/overview/02-tech-stack.mdx b/src/content/docs/id/overview/02-tech-stack.mdx index 22dd194..2b852c6 100644 --- a/src/content/docs/id/overview/02-tech-stack.mdx +++ b/src/content/docs/id/overview/02-tech-stack.mdx @@ -34,10 +34,10 @@ Proyek HIMARPL dibangun menggunakan teknologi web modern, terutama berpusat pada ## Layanan Infrastruktur -### Database +### Basis Data -- **Database Utama**: CockroachDB (Distributed SQL) -- **Database Bot**: PostgreSQL (NeonDB) +- **Basis Data Utama**: CockroachDB (Distributed SQL) +- **Basis Data Bot**: PostgreSQL (NeonDB) - **Caching**: Redis (Upstash) ### Analitik & Pemantauan @@ -57,7 +57,7 @@ Proyek HIMARPL dibangun menggunakan teknologi web modern, terutama berpusat pada (ascendia-himarpl, admin-himarpl, blog-himarpl, pmb-himarpl) - Implementasi penuh T3 Stack -- Arsitektur three-layer lengkap +- Arsitektur tiga lapisan lengkap - Integrasi layanan bersama ### Proyek Ringan @@ -78,7 +78,7 @@ Proyek HIMARPL dibangun menggunakan teknologi web modern, terutama berpusat pada Kami memilih T3 Stack ([create.t3.gg](https://create.t3.gg)) untuk proyek kami karena: -1. **Type Safety**: Type Safety end-to-end dengan TypeScript +1. **Type Safety**: _Type-Safety end-to-end_ dengan TypeScript 2. **Pengalaman Pengembang**: DX yang luar biasa dengan alat modern 3. **Kinerja**: Optimasi bawaan 4. **Skalabilitas**: Arsitektur siap produksi diff --git a/src/content/docs/id/overview/03-configuration-secrets.mdx b/src/content/docs/id/overview/03-configuration-secrets.mdx index ac9c4ae..095c234 100644 --- a/src/content/docs/id/overview/03-configuration-secrets.mdx +++ b/src/content/docs/id/overview/03-configuration-secrets.mdx @@ -3,15 +3,15 @@ title: Manajemen Kerahasiaan description: Panduan untuk mengelola konfigurasi dan rahasia di seluruh proyek HIMARPL --- -Manajemen konfigurasi dan rahasia yang tepat sangat penting untuk keamanan dan pemeliharaan. Setiap proyek memiliki pengaturan dan variabel lingkungan sendiri yang dapat Anda ikuti langkah-langkahnya di panduan kontribusi masing-masing proyek atau halaman dokumentasi ini. +Manajemen konfigurasi dan rahasia yang tepat sangat penting untuk keamanan dan pemeliharaan. Setiap proyek memiliki pengaturan dan _Environment Variable_ sendiri yang dapat Anda ikuti langkah-langkahnya di panduan kontribusi masing-masing proyek atau halaman dokumentasi ini. ## Environment Variables :::note **Catatan Penting untuk Staf Kominfo** -Semua Environment Variable disimpan di [Google Drive utama HIMARPL](https://drive.google.com). +Semua _Environment Variable_ disimpan di [Google Drive utama HIMARPL](https://drive.google.com). Terdapat di folder `/KABINET ASCENDIA 2024/BADAN EKSEKUTIF/DEPT. KOMINFO/Data/Environment Variables`. ::: -Untuk setiap proyek, terdapat file `.env.example`. Anda dapat menggunakan ini sebagai template untuk membuat file `.env` untuk Environment lokal Anda. +Untuk setiap proyek, terdapat _file_ `.env.example`. Anda dapat menggunakan ini sebagai _template_ untuk membuat _file_ `.env` untuk _Local Environment_ Anda. diff --git a/src/content/docs/id/overview/04-database-schema.mdx b/src/content/docs/id/overview/04-database-schema.mdx index 8f44ba0..af631be 100644 --- a/src/content/docs/id/overview/04-database-schema.mdx +++ b/src/content/docs/id/overview/04-database-schema.mdx @@ -1,21 +1,21 @@ --- -title: Skema Database -description: Panduan skema database untuk infrastruktur cloud HIMARPL +title: Skema Basis Data +description: Panduan skema basis data untuk infrastruktur cloud HIMARPL --- -HIMARPL menggunakan dua database untuk tujuan yang berbeda: +HIMARPL menggunakan dua basis data untuk tujuan yang berbeda: 1. **CockroachDB** dengan Prisma ORM - Untuk proyek inti dan infrastruktur utama 2. **PostgreSQL** (NeonDB) dengan Drizzle ORM - Untuk fungsionalitas bot -## Struktur Inti Database +## Struktur Inti Basis Data -![Class Diagram Database Inti](../../../../assets/diagrams/cockroach-db-class-diagram.png) +![Class Diagram Basis Data Inti](../../../../assets/diagrams/cockroach-db-class-diagram.png) ### Class Utama :::note[Skema Prisma] -Jika Anda ingin mengintegrasikan proyek baru Anda dengan database, Anda dapat menggunakan Skema Prisma di bawah ini. +Jika Anda ingin mengintegrasikan proyek baru Anda dengan basis data, Anda dapat menggunakan Skema Prisma di bawah ini.
Lihat Lengkap Skema Prisma @@ -169,11 +169,11 @@ model VerificationToken { - Informasi inti profil pengguna (nama, email, bio, posisi) - Dapat menjadi anggota satu departemen - - Memiliki role-based akses (admin/anggota) - - Melacak periode keterlibatan dan aktivitas login + - Memiliki _role-based_ akses (admin/anggota) + - Melacak periode keterlibatan dan aktivitas _login_ - **Otentikasi** - - **Akun**: Menangani koneksi OAuth (misalnya, login Google) + - **Akun**: Menangani koneksi OAuth (misalnya, _login_ Google) - **Sesi**: Mengelola sesi pengguna aktif - **Token Verifikasi**: Untuk verifikasi email @@ -182,13 +182,13 @@ model VerificationToken { - **Postingan** - Artikel blog dan entri konten - - Berisi metadata (judul, slug, gambar) + - Berisi metadata (judul, _slug_, gambar) - Melacak status dan tanggal publikasi - Setiap postingan memiliki satu penulis (Pengguna) - **Tag Postingan** - Kategorisasi konten hierarkis - - Dapat memiliki hubungan parent-child + - Dapat memiliki hubungan _parent-child_ - Digunakan untuk mengatur postingan berdasarkan topik #### 3. Struktur Organisasi @@ -214,9 +214,9 @@ model VerificationToken { 2. **Organisasi Konten** -- Postingan dapat memiliki beberapa tag -- Tag dapat memiliki hubungan parent-child -- Postingan memiliki slug unik per penulis +- Postingan dapat memiliki beberapa _tag_ +- _Tag_ dapat memiliki hubungan _parent-child_ +- Postingan memiliki _slug_ unik per penulis 3. **Organisasi** @@ -226,8 +226,8 @@ model VerificationToken { ### Prinsip Desain Skema Prisma -- Type-safe dengan enum yang ditentukan -- Foreign-key Constraints yang tepat +- _Type-safe_ dengan _enum_ yang ditentukan +- _Foreign-key Constraints_ yang tepat - Dapat dikembangkan untuk ekspansi di masa depan - Hubungan hierarkis yang jelas @@ -236,14 +236,14 @@ model VerificationToken { - Gunakan PascalCase untuk semua model - Gunakan camelCase untuk semua atribut -## Struktur Database Bot +## Struktur Basis Data Bot Bot menggunakan PostgreSQL (NeonDB) dengan Drizzle ORM untuk mengelola notifikasi dan interaksi pengguna. ### Kelas Utama :::note[Skema Drizzle] -Jika Anda ingin mengintegrasikan proyek baru Anda dengan database, Anda dapat menggunakan Skema Drizzle di bawah ini. +Jika Anda ingin mengintegrasikan proyek baru Anda dengan basis data, Anda dapat menggunakan Skema Drizzle di bawah ini.
Lihat Skema Drizzle Lengkap @@ -293,24 +293,24 @@ export const notifications = createTable( **Kolom Kunci:** -- `chatId`: Pengidentifikasi unik untuk Telegram Chat (primary key) +- `chatId`: Pengidentifikasi unik untuk Telegram Chat (_primary key_) - `firstName`: Nama depan pengguna dari Telegram - `lastName`: Nama belakang pengguna dari Telegram - `username`: Nama pengguna Telegram -- `createdAt`: Timestamp pembuatan obrolan -- `notifying`: Array dari topik notifikasi yang diikuti pengguna +- `createdAt`: _Timestamp_ pembuatan obrolan +- `notifying`: _Array_ dari topik notifikasi yang diikuti pengguna **Detail Teknis:** -- Menggunakan type spesifik PostgreSQL (bigserial, varchar, timestamp) +- Menggunakan _type_ spesifik PostgreSQL (bigserial, varchar, timestamp) - Termasuk pengindeksan pada chatId untuk pencarian lebih cepat -- Menerapkan timestamp yang beradaptasi dengan zona waktu -- Menggunakan type array untuk preferensi notifikasi +- Menerapkan _timestamp_ yang beradaptasi dengan zona waktu +- Menggunakan _type array_ untuk preferensi notifikasi ### Prinsip Desain Skema Drizzle -- Menggunakan prefix tabel untuk isolasi multi-proyek -- Menerapkan type PostgreSQL yang tepat +- Menggunakan _prefix_ tabel untuk isolasi multi-proyek +- Menerapkan _type_ PostgreSQL yang tepat - Termasuk optimasi kinerja melalui pengindeksan - Mengikuti studi kasus terbaik dari Drizzle ORM