Migrate framework cuma biar bisa keliatan keren

“No sophisticated frameworks, library, design system, etc. Just pure React framework”

Katanya sih gitu ya, kata gua sendiri di tanggal 21 Desember 2024 waktu mulai bikin website ini.

Sekarang? Gua malah tiba-tiba migrate ke framework sebelah. Yang kalau dipikir-pikir… ini kayak ngerjain dua kali.

Bukan gara-gara masalah performance, search engine optimization, ataupun maintainability. Tapi cuman gara-gara satu hal doang, biar keliatan keren doang waktu share ke sosmed.

Jadi pertama kali gua notice hal ini itu di waktu gua coba share URL ke sosmed. Di mana ekspektasi gua URL yang di-share itu bakal keliatan oke di sosmed. Tapi taunya…

“Kok gini doang ya?”

“Kok jelek?”

Gua gatel banget liatnya.

Bland banget kayak nggak ada konten di dalem page yang ditampilin sewaktu share URL, nggak bikin orang tertarik buat klik link-nya, sama sekali. Walaupun sebenernya aneh juga sih, karena gua jarang banget nge-share web ini ke sosmed.

Setelah baca-baca sana-sini, basically permasalahannya ini muncul karena meta tags yang di-render di client, yang idealnya di-render di server. Jadi in summary, gua harus mindahin data meta tags nya buat di-render di server.

Sebetulnya ini bisa diatasin sama nambahin code dikit di web gua sekarang. But my lazy ass self is too lazy to learn something new and decided to migrate the whole codebase 🤦‍♂️.

Berangkat dari keresahan ini, gua mulai lagi buka-buka file project website gua yang ini. Ini malah bikin gua nyoba lagi buat ngoding di luar perkuliahan dan kerjaan, padahal sebelumnya gua udah enek sama yang namanya VS Code.

Sok-sokan misterius

Beberapa hari setelah gua beres adjust meta tags, muncul satu keresahan lagi yang muncul waktu gua buka DevTools di Chrome.

“Ah network call-nya ini keliatan, gua gamau orang-orang bisa liat gua call API apa aja”

Padahal buat konteks personal web gini, rasanya unnecessary buat nge-hide network. Lagian nggak ada data sensitif juga. Paling yang bisa didapet malahan data-data receh gua lagi dengerin Spotify di device apa dan berapa volume gua.

Tapi lagi-lagi, keresahan gua ini bisa diatasin dengan cara mindahin dari client side ke server side. Nantinya karena data-datanya jadi diambil dari server side, user nggak akan bisa liat si data ini diambil dari mana di network call DevTools.

Jelek emang, gara-gara hal sereceh website gua pengen keliatan misterius, jadinya gua ngedit puluhan code yang ada di codebase gua, seharian.

Sebetulnya waktu gua ngerjain ini, gua lagi liburan lebaran, dan gua mulai ngerasain sesuatu,

“Terakhir kali gua suka ngoding di waktu liburan gini tuh jaman semester 5, dan sekarang baru ngerasain lagi? Aneh.”

A literal dump

Kalau lu notice, ada satu tab baru yang namanya “Snaps” di homepage, yang kalau diklik itu bakal munculin gallery dari Pinterest gua.

Ide ini tuh sebetulnya udah ada dari awal gua bikin web ini, cuman mager. Lumayan juga, daripada foto-foto random gua nganggur di folder HP, mending sekalian gua upload aja.

Niatnya sih biar kayak dump account orang-orang di Instagram. Yang seringkali kalau gua liat dump account mereka malah keliatan lebih rapi sama estetik dibanding main account-nya—nggak keliatan “dump”. At least yang di web gua ini beneran “dump”, secara literal: nyampah.

Waktu awal banget kepikiran ide ini, gua udah netapin buat ngehubungin website gua sama web-web foto biar gua gak ribet upload, kayak 500px, VSCO, ataupun Pinterest.

Tapi kenyataannya begini:

• 500px udah nggak set API mereka jadi public
• VSCO sama sekali ga set API nya public
• Pinterest punya API, tapi butuh business account dan perlu request access permission buat pake API nya

Kayanya set account ke business account adalah hal yang paling memungkinkan sekaligus hal yang paling gak mengenakan bagi orang kayak gua 🙅‍♂️.

Tapi akhirnya gua research ulang sana-sini, nemu beberapa opsi lain kayak pake API third party, sampai pake RSS yang ternyata berbayar. Ribet juga ya ternyata.

Di sela-sela research pun gua sempetin juga buat curhat ke ChatGPT yang malah jadi dapet metode lain dan metode ini yang paling memungkinkan: scraping data.

Intinya sih, metode yang gua lakuin ini bakal nge-scrape semua data image yang ada di Pinterest Board gua. Nantinya data image itu bakal disimpen ke file JSON, dan script buat nge-scrape data image ini bakal dijalanin tiga hari sekali. Dan ya, jadi lah tab baru ini.

Setelah ngoding beberapa jam, akhirnya gua bisa nyelesain fitur ini. Yang tadinya tampilan homepage-nya begini:

Sekarang udah jadi begini:

Oh iya, buat yang update meta tags yang pertama banget, sekarang udah jadi gini:

Burnout

Kurang lebih gua ngerjain ini sekitar lima hari di liburan lebaran. Ini bikin gua sadar akan sesuatu, ternyata gua burnout.

Skripsi yang bisa lebih nyantai, ditambah nggak ada kewajiban kerja karena cuti ini bisa bikin gua lepas dari VS Code.

Tapi nyatanya gua cuman meninggalkan laptop gua selama beberapa hari, dan ternyata gua balik lagi buka VS Code—kali ini dengan kemauan sendiri dan ide sendiri. Ternyata selama ini gua masih punya niatan dan motivasinya, tapi yang membedakan sekarang energi gua gak sebanyak dulu karena gua kebanyakan berurusan sama kodingan.

Ke depannya, gua belom tau mau apain lagi sih website ini. Mungkin, ga bakal ada apa-apa juga dalam waktu dekat juga.

Soalnya… belom ada libur panjang lagi.