Post Pertama

Dipublikasikan pada: 20 Mei 2024
cover post

Ini adalah post pertama saya di blog ini.
Post ini dibuat sebagai konten uji coba untuk memastikan layout, typography, dan fitur sticky element bekerja dengan baik pada halaman blog.

Konten ini sengaja dibuat cukup panjang agar halaman bisa di-scroll jauh ke bawah.

Pendahuluan

Dalam pengembangan website modern, terutama blog atau dokumentasi, pengalaman membaca sangat penting.
Penggunaan layout yang rapi, typography yang nyaman, dan navigasi yang konsisten akan sangat membantu pembaca.

Post ini bertujuan untuk:

  • Menguji tampilan layout blog
  • Menguji typography (heading, paragraf, list)
  • Menguji fitur sticky (sidebar, navbar, atau TOC)

Apa Itu Sticky Element?

Sticky element adalah elemen UI yang:

  • Tetap terlihat saat halaman di-scroll
  • Biasanya digunakan untuk:
    • Navbar
    • Sidebar kategori
    • Table of contents (TOC)

Contoh penggunaan:

  • Sidebar tetap di kiri saat membaca artikel
  • Judul artikel tetap di atas saat scroll

Contoh Paragraf Panjang

Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Paragraf panjang seperti ini penting untuk:

  • Menguji line-height
  • Menguji max-width konten
  • Menguji readability

Penggunaan Heading Bertingkat

Heading Level 3

Heading level 3 biasanya digunakan untuk sub-topik yang masih satu konteks dengan heading utama.

Heading Level 4

Heading level 4 cocok untuk detail teknis atau penjelasan tambahan.

Heading Level 5

Jarang dipakai, tapi tetap perlu dicek tampilannya.

List dan Bullet Point

Berikut contoh unordered list:

  • Server
  • Networking
  • DevOps
  • Security
  • Linux

Dan ordered list:

  1. Install environment
  2. Setup project
  3. Konfigurasi layout
  4. Testing
  5. Deployment

Contoh Inline Code dan Code Block

Inline code biasanya terlihat seperti ini: npm install atau git pull.

Contoh code block:

npm install
npm run dev