{"id":134,"date":"2026-10-07T11:20:35","date_gmt":"2026-10-07T11:20:35","guid":{"rendered":"https:\/\/handika-pkl.nyxstudios.site\/?p=0"},"modified":"2026-10-07T11:20:35","modified_gmt":"2026-10-07T11:20:35","slug":"laporan-pkl-handika-pratama-w-day-25-di-cyberlabs","status":"publish","type":"post","link":"https:\/\/handika-pkl.nyxstudios.site\/?p=134","title":{"rendered":"LAPORAN PKL Handika Pratama W DAY 25 DI CYBERLABS"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">Nama: Handika Pratama WIcaksono<br>Kelas: 12<br>Asal Sekolah: SMK Skye Digipreneur<a href=\"https:\/\/handika-pkl.nyxstudios.site\/?author=1\"><\/a><\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"936\" height=\"120\" src=\"https:\/\/handika-pkl.nyxstudios.site\/wp-content\/uploads\/2026\/08\/936x120-1.png\" alt=\"\" class=\"wp-image-20\" srcset=\"https:\/\/handika-pkl.nyxstudios.site\/wp-content\/uploads\/2026\/08\/936x120-1.png 936w, https:\/\/handika-pkl.nyxstudios.site\/wp-content\/uploads\/2026\/08\/936x120-1-300x38.png 300w, https:\/\/handika-pkl.nyxstudios.site\/wp-content\/uploads\/2026\/08\/936x120-1-768x98.png 768w\" sizes=\"auto, (max-width: 936px) 100vw, 936px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Pada kegiatan PKL hari ke-25 ini, fokus utama pekerjaan adalah tahap <strong>pengembangan fitur halaman baca berita dinamis (single post detail page), integrasi routing dinamis Laravel, pengujian publikasi konten melalui Filament CMS, serta optimalisasi responsivitas antarmuka mobile (mobile UI responsiveness)<\/strong> pada sistem website Tasty Food di lingkungan server hosting industri.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Adapun rincian implementasi teknis yang diselesaikan pada hari ini meliputi:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Optimalisasi Responsivitas Menu Card pada Mobile:<\/strong> Memperbaiki tampilan kartu menu rekomendasi (<em>TASTY PICK<\/em>) di layar smartphone yang sebelumnya saling bertumpuk akibat elemen foto bundar melayang (<em>top: -70px<\/em>). Dilakukan penyesuaian <code>row-gap: 5.5rem<\/code> dan penataan ulang margin vertikal sehingga setiap piring menu memiliki ruang bernapas (breathable space) yang proporsional dan teks deskripsi tersusun rapi di tengah.<\/li>\n<li><strong>Pembuatan Route &amp; Controller Detail Berita:<\/strong> Mengimplementasikan rute dinamis <code>\/berita\/{article}<\/code> pada file <code>routes\/web.php<\/code> serta menambahkan metode <code>show(Article )<\/code> pada <code>ArticleController<\/code> untuk menangani pengambilan data artikel spesifik beserta validasi status publikasi.<\/li>\n<li><strong>Perancangan Antarmuka Halaman Baca (View Template):<\/strong> Membangun template <code>berita\/show.blade.php<\/code> yang responsif dengan header hero kategori, foto sampul artikel resolusi tinggi dari storage symlink, isi konten berita lengkap berformat tipografi Poppins, tombol navigasi kembali, dan seksi rekomendasi artikel terkait (<em>related stories<\/em>).<\/li>\n<li><strong>Penautan Interaktif Tombol Baca:<\/strong> Memperbarui kartu berita pada katalog utama (<code>\/berita<\/code>) agar tautan tombol <em>Baca selengkapnya \u2197<\/em> secara otomatis mengarahkan pengunjung langsung ke halaman detail artikel yang dipilih.<\/li>\n<li><strong>Pengujian Manajemen Konten (CMS):<\/strong> Melakukan uji coba pembuatan dan pengelolaan artikel secara langsung melalui panel admin Filament untuk memastikan artikel yang baru diterbitkan tersimpan di database dan langsung dapat dibaca oleh publik tanpa kendala.<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Berikut adalah dokumentasi implementasi fitur halaman detail berita dan hasil perbaikan tampilan responsif mobile:<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"https:\/\/handika-pkl.nyxstudios.site\/wp-content\/uploads\/2026\/10\/revisi-menu-mobile.jpg\" alt=\"Dokumentasi Revisi Tampilan Mobile Menu Card\"\/><figcaption class=\"wp-element-caption\">Proses analisis dan penataan ulang jarak vertikal kartu menu pilihan pada tampilan layar smartphone<\/figcaption><\/figure>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"https:\/\/handika-pkl.nyxstudios.site\/wp-content\/uploads\/2026\/10\/halaman-berita-database.jpg\" alt=\"Katalog Berita Tasty Food\"\/><figcaption class=\"wp-element-caption\">Tampilan katalog artikel berita dengan tautan baca selengkapnya yang terhubung dinamis<\/figcaption><\/figure>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" src=\"https:\/\/handika-pkl.nyxstudios.site\/wp-content\/uploads\/2026\/10\/revisi-grid-card.jpg\" alt=\"Desain Grid Artikel\"\/><figcaption class=\"wp-element-caption\">Struktur tata letak kartu berita yang rapi dan terintegrasi dengan basis data produksi<\/figcaption><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Dengan integrasi ini, tampilan website Tasty Food kini telah nyaman dan proporsional saat diakses melalui perangkat seluler (mobile friendly) maupun desktop, serta alur publikasi berita telah berjalan secara utuh.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Nama: Handika Pratama WIcaksonoKelas: 12Asal Sekolah: SMK Skye Digipreneur Pada kegiatan PKL hari ke-25 ini, fokus utama pekerjaan adalah tahap pengembangan fitur halaman baca berita dinamis (single post detail page), integrasi routing dinamis Laravel, pengujian publikasi konten melalui Filament CMS, serta optimalisasi responsivitas antarmuka mobile (mobile UI responsiveness) pada sistem website Tasty Food di lingkungan [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-134","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"blocksy_meta":{"styles_descriptor":{"styles":{"desktop":"","tablet":"","mobile":""},"google_fonts":[],"version":7}},"_links":{"self":[{"href":"https:\/\/handika-pkl.nyxstudios.site\/index.php?rest_route=\/wp\/v2\/posts\/134","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/handika-pkl.nyxstudios.site\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/handika-pkl.nyxstudios.site\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/handika-pkl.nyxstudios.site\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/handika-pkl.nyxstudios.site\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=134"}],"version-history":[{"count":0,"href":"https:\/\/handika-pkl.nyxstudios.site\/index.php?rest_route=\/wp\/v2\/posts\/134\/revisions"}],"wp:attachment":[{"href":"https:\/\/handika-pkl.nyxstudios.site\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=134"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/handika-pkl.nyxstudios.site\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=134"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/handika-pkl.nyxstudios.site\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=134"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}