Karmaşık Siteler Vibe Coding ile Nasıl Yapılır: Dört Açılış Sayfası, 'Pahalı' Efektlere İki Yol ve Sprite'lardan 3B Logo

Yazar, AlpinaGPT CPO'su ve Alpina Digital'de Yapay Zeka Başkanı olan Zhemal Khamidun, vibe coding ile karmaşık açılış sayfaları oluşturmayı anlatıyor; burada yapay zeka ajanları onun yönlendirmesiyle kodu yazıyor. Dört açılış sayfası sergiliyor: Techpred Okulu, 'Tochka Sborki' konferansı, 'AI Ürün Yönetimi' kursu (aimipt.ru) ve kişisel bir sayfa. Bunlar iki teknik yola ayrılıyor: konferans sitesi harici kütüphane olmadan elle yazılmış vanilla WebGL kullanıyor, diğerleri ise yeniden kullanılabilir bir Three.js motoru kullanıyor. Araç zinciri, DESIGN.md içinde bir tasarım sistemi, Claude Design'da oluşturulan mockuplar ve üretim kodu olarak değil, referans olarak kullanılan handoff paketleri içeriyor. Ayrıca, paketini indirerek, küçültülmüş JavaScript'i güzelleştirerek ve 27 shader çıkararak üst düzey bir WebGL sitesini (dala.craftedbygc.com) analiz etti ve ping-pong FBO ile GPGPU, InstancedMesh ve post-processing efektleri hakkında bilgi edindi. Bu tür siteleri doğrudan klonlamanın marka ve lisanslı varlıklar nedeniyle uygun olmadığını, ancak parçacık morfingi gibi efektler için tarifler çıkarmanın değerli olduğunu vurguluyor. Makale ayrıca tamamen vanilla WebGL ve CSS ile oluşturulan, altı toplanmış sinüs dalgası içeren bir su yüzeyi shader'ına sahip 'Tochka Sborki' açılış sayfasını ve dosya boyutları ile satır sayıları hakkındaki detayları kapsıyor.