Catatan teknis · DikaGlorya (DikaOfc)
Arsitektur portofolio statis yang sederhana dan mudah dirawat
Mengenal metadata halaman bersama, route project berbasis data, sitemap otomatis, dan trade-off portofolio statis dengan Astro.
Masalahnya: portofolio bisa berubah menjadi tumpukan halaman terpisah
Portofolio membutuhkan halaman proyek, informasi identitas yang jelas, dan metadata untuk pencarian. Menyalin detail tersebut ke setiap halaman membuat judul, nama penulis, URL kanonis, dan tautan sosial mudah berbeda satu sama lain.
Situs ini dibuat dengan Astro sebagai HTML statis. Tujuannya bukan mengklaim skor performa, tetapi menjaga konten dan aturan halaman tetap mudah dipahami, lalu memastikan route yang diterbitkan dapat diperiksa saat proses build.
Simpan identitas situs dan metadata bersama di satu tempat
Identitas situs disimpan di `src/data/site.ts`. Layout bersama membaca data tersebut untuk menghasilkan metadata canonical, Open Graph, Twitter, dan structured data. Halaman tetap dapat memberikan judul, deskripsi, dan schema khusus tanpa menggandakan entitas Person dan WebSite global.
Pemisahan ini membantu membedakan nama utama seseorang, brand website ObitoGlory, dan origin kanonis. Nama alternatif menjelaskan satu orang; website tetap menjadi entitas tersendiri.
// origin comes from astro.config.mjs (Astro.site), so no page hardcodes a host
const canonicalURL = new URL(canonicalPath, Astro.site);
const personSchema = {
'@type': 'Person',
'@id': `${origin}/#person`,
name: 'DikaGlorya',
alternateName: ['DikaGlory', 'DikaCode', 'DikaOfc'],
url: origin,
};
Buat halaman proyek berulang dari data terstruktur
Ringkasan proyek disimpan di `src/data/projects.ts`. Astro membuat setiap route detail proyek dari daftar tersebut, sehingga judul, deskripsi, detail teknologi, dan URL proyek mengacu ke entri yang sama.
Route berbasis data hanya berguna jika sumber datanya akurat. Portofolio tidak menampilkan tautan repositori atau demo kecuali tujuan nyatanya tersedia; deskripsi proyek bukan bukti bahwa source code-nya publik.
export function getStaticPaths() {
return projects.map((project) => ({
params: { slug: project.slug },
props: { project },
}));
}
Buat sitemap mengikuti sumber konten yang sama
Sitemap dihasilkan dari route statis serta data proyek dan artikel. Karena itu, menambahkan konten nyata juga menambahkan URL kanonisnya ke hasil build yang sama, tanpa mengandalkan daftar manual yang bisa kedaluwarsa.
Repositori ini juga memiliki skrip pemeriksa tautan yang mencocokkan tautan internal dan URL sitemap dengan file hasil `dist/`. Ini menangkap tujuan lokal yang hilang, tetapi tidak membuktikan bahwa situs pihak ketiga akan selalu aktif.
const paths = [
...staticPaths,
...projects.map((project) => `/projects/${project.slug}/`),
...articles.map((article) => `/journal/${article.slug}/`),
];
Ketahui kapan publikasi statis bukan pilihan yang tepat
Output statis menghindari server konten saat runtime untuk halaman ini dan menyederhanakan deployment. Konsekuensinya, perubahan konten memerlukan build dan deploy; repositori ini tidak memiliki editor atau alur publikasi langsung.
Pilihan ini cocok untuk portofolio kecil dan jurnal sederhana. Jika volume publikasi atau kebutuhan kolaborasi meningkat, alur konten sebaiknya ditinjau berdasarkan kebutuhan tersebut, bukan menambahkan CMS terlalu dini.
Hal yang dibuktikan dan tidak dibuktikan
Implementasi ini menunjukkan cara repositori berbagi metadata identitas, membuat route konten, dan memeriksa tautan statisnya sendiri. Ini tidak membuktikan peringkat pencarian, peningkatan kecepatan yang terukur, ataupun adopsi oleh developer lain.
Langkah berikutnya yang bermanfaat adalah merilis proyek nyata beserta dokumentasinya, lalu memakai data pencarian dan masukan yang menjaga privasi untuk menentukan perbaikan.
Catatan ini menjelaskan implementasi di repositori website ini. Tidak ada klaim tentang peringkat pencarian, benchmark performa, atau adopsi proyek.