▲ Sesi Komunitas: Meluncurkan dan memvalidasi lebih cepat dengan PostHog + v0

VVercel
컴퓨터/소프트웨어창업/스타트업AI/미래기술

Transcript

00:00:00[Hening]
00:00:30[Hening]
00:01:00[Hening]
00:01:29Halo, semuanya.
00:01:32Selamat datang di sesi komunitas Vercel minggu ini.
00:01:36Kami sangat senang Anda ada di sini.
00:01:41Sangat menyenangkan melakukan sesi langsung ini karena saya merasa
00:01:44sudah lama tidak melakukannya.
00:01:46Jadi halo, semuanya.
00:01:47[Tertawa] Jika ini pertama kalinya Anda mengikuti sesi komunitas kami,
00:01:53saya Pauline Navas dari tim komunitas di Vercel.
00:01:57Anda mungkin pernah melihat saya di ruang komunitas pada platform kami sendiri
00:02:03[www.vercel.com](https://www.vercel.com), atau mungkin di X atau LinkedIn, menjawab pertanyaan dan
00:02:08berinteraksi dengan komunitas untuk benar-benar memahami apa yang Anda bangun
00:02:12di Vercel.
00:02:13Jadi ini selalu menjadi kesempatan komunitas untuk terhubung dengan komunitas,
00:02:18pelanggan, dan pengguna kami secara langsung.
00:02:22Keren, senang melihat begitu banyak dari Anda yang sudah hadir.
00:02:25Saya melihat ucapan selamat malam dari Adam di obrolan.
00:02:29Halo, halo, halo.
00:02:31Kirimkan pesan di obrolan dan beri tahu kami dari mana Anda menonton hari ini.
00:02:36Jika Anda menonton ini di X atau YouTube atau LinkedIn dan
00:02:39ingin bergabung dalam obrolan langsung, kunjungi [community.vercel.com/live](https://community.vercel.com/live).
00:02:46Anda akan menemukan sesinya tepat di bagian atas, lalu kirimkan komentar di obrolan.
00:02:53Sesi hari ini, saya sangat bersemangat setiap kali ada sesi
00:02:58integrasi marketplace Vercel, karena sangat keren melihat apa
00:03:03yang bisa Anda bangun di atas Vercel menggunakan integrasi kami.
00:03:07Jadi hari ini kita berbicara dengan PostHog.
00:03:11Dan jika Anda belum pernah mendengarnya, singkatnya PostHog
00:03:16adalah platform analitik produk sumber terbuka.
00:03:19Anggap saja sebagai feature flag, pengujian A/B, pelacakan peristiwa, dan
00:03:25pada dasarnya semua alat yang Anda butuhkan untuk membantu memahami apa yang sebenarnya terjadi
00:03:29saat orang menggunakan produk Anda.
00:03:31Yang membuat sesi hari ini sangat menarik adalah PostHog kini
00:03:36terintegrasi langsung dengan v0.
00:03:38Artinya, Anda bisa beralih dari ide ke eksperimen langsung tanpa perlu
00:03:43meninggalkan alat pembangun Anda.
00:03:45Jadi tidak ada lagi istilah luncurkan dulu baru pikirkan analitik kemudian.
00:03:50Anda bisa mengatur feature flag, menjalankan pengujian, dan melacak peristiwa khusus
00:03:55sebagai bagian dari proses pembangunan itu sendiri.
00:03:58Jadi saya akan berhenti mengoceh, tapi halo semuanya, saya melihat banyak dari Anda bergabung di sini.
00:04:06Bagus.
00:04:06Beri tahu kami dari mana kalian menonton, teman-teman.
00:04:09Keren.
00:04:10Tanpa basa-basi lagi, saya ingin menyambut tamu kita, Brooker, dari PostHog.
00:04:16Hai, Brooker.
00:04:17- Halo.
00:04:17Senang berada di sini.
00:04:19Ya, seperti kata Pauline, nama saya Brooker.
00:04:21Saya seorang product engineer di tim pertumbuhan.
00:04:25Dan untuk memulai, saya akan memberi tahu sedikit tentang apa yang ditawarkan PostHog,
00:04:30mengapa Anda ingin menggunakan sesuatu seperti PostHog di v0.
00:04:34Lalu kita akan membahas beberapa kasus penggunaan di v0, di Vercel, dan v0.
00:04:41Saya akan melakukan demo langsung.
00:04:42Jadi kita akan benar-benar menerapkan beberapa kasus pengunaannya.
00:04:46Ada dua hal yang ingin saya bahas secara khusus, saya rasa saya akan mulai
00:04:49dengan apa itu PostHog, mengapa Anda akan tertarik padanya sebagai pengguna v0
00:04:54dan Vercel.
00:04:56Jadi, Anda menggunakan v0, membangun aplikasi terkeren, meluncurkannya,
00:05:02Anda ingin melihat bagaimana kinerjanya, bagaimana cara mengetahuinya?
00:05:06Bagaimana Anda memahami cara orang menggunakan aplikasi Anda, apa yang mereka sukai,
00:05:11apa yang tidak mereka sukai?
00:05:12Bagaimana Anda paham saat ada yang tidak beres?
00:05:15Sering kali, Anda meluncurkan aplikasi dan, aplikasinya berjalan lancar
00:05:19dalam mode pratinjau.
00:05:20Mungkin Anda sudah mengujinya sendiri, tapi saat berjalan di produksi,
00:05:26muncul beberapa masalah yang tidak Anda duga.
00:05:29Di situlah pengecualian mungkin muncul, dan akan sangat membantu bagi Anda
00:05:33untuk memiliki visibilitas ke sana, dan terutama membawa visibilitas
00:05:39dan konteks itu ke v0, ke agennya, sehingga agen dapat memahami semua
00:05:45yang terjadi di produksi dan memperbaiki masalahnya untuk Anda tanpa perlu
00:05:50repot mengumpulkan konteks di tempat berbeda, entah itu di sistem
00:05:55pencatatan log, sistem kesalahan, atau mereproduksinya sendiri
00:05:59dan menyalin-tempel dari Chrome DevTools.
00:06:02Bukannya saya pernah melakukan itu sebelumnya.
00:06:04- Kita semua pernah melakukannya, saya rasa.
00:06:07- Ya.
00:06:09Jadi itu salah satu kasus penggunaan yang ingin saya tunjukkan yaitu penanganan kesalahan.
00:06:13Dan yang lainnya adalah feature flag dan pengujian A/B.
00:06:17Jadi, saya benar-benar menikmati metode pengembangan ini.
00:06:23Misalnya, Anda sedang bekerja dengan tim.
00:06:26Anda mendiskusikan fitur yang ingin ditambahkan.
00:06:29Dan mungkin Anda punya pendapat berbeda dengan rekan tim tentang cara
00:06:33menerapkan fitur ini.
00:06:34Misalnya, saya ingin melakukannya dengan cara ini.
00:06:36Mereka ingin melakukannya dengan cara itu.
00:06:39Satu cara jitu untuk menyelesaikannya adalah lakukan keduanya lalu uji
00:06:42di produksi dan lihat mana yang memberikan hasil lebih baik.
00:06:46Jadi kita juga akan membahas itu.
00:06:48Tanpa basa-basi lagi, izinkan saya berbagi layar.
00:06:51Dan saya akan memandu Anda melalui seluruh proses dari awal hingga akhir.
00:06:55Ada sedikit bagian yang sudah disiapkan di akun ini.
00:06:58Jadi saya akan beralih ke akun yang belum terpasang PostHog.
00:07:06Dan tolong beri tahu saya saat layar saya sudah muncul.
00:07:09- Layarnya sudah terlihat, Brooker.
00:07:11Ayo kita mulai.
00:07:11- Bagus.
00:07:12Oke.
00:07:12Kita sedang di Vercel.
00:07:14Kita akan masuk ke integrasi dan mencari PostHog.
00:07:18Saya tidak tahu kenapa tulisannya...oh, Jelajahi Marketplace.
00:07:21Jadi kita ke Jelajahi Marketplace.
00:07:22Kita cari PostHog, pilih PostHog di sini, lalu klik Instal.
00:07:29Ini akan menanyakan apakah saya ingin buat akun baru atau tautkan yang sudah ada.
00:07:32Jika Anda sudah punya akun PostHog, Anda bisa menautkannya.
00:07:35Dan apa yang akan dilakukan ini untuk saya adalah... mari kita instal di sini.
00:07:39Ini akan... sebentar... maaf, saya tidak bisa klik sambil bicara.
00:07:46Kenapa saya harus memasukkan alamat penagihan?
00:07:48Oke.
00:07:49Jadi Anda akan mengisi formulir ini.
00:07:52Klik Lanjutkan.
00:07:53Ini akan menyinkronkan... biarkan saya tunjukkan apa yang dilakukannya.
00:07:59Ini akan menyinkronkan variabel lingkungan Anda, jika saya ke Pengaturan...
00:08:06Oh, saya akan ke Ringkasan saja.
00:08:09Oh, saya pikir ini sudah terinstal.
00:08:14Mari lakukan ini dengan cepat.
00:08:15Jadi kita akan menginstalnya untuk sebuah proyek.
00:08:17Saya memilih proyek mana yang ingin dipasangi.
00:08:20Klik Lanjutkan.
00:08:22Bagus.
00:08:23Ini akan... jadi saya sudah pilih proyeknya.
00:08:25Mari kita lihat.
00:08:30Maaf, saya pikir tadi sudah ada satu di sini.
00:08:32Oh, saya tahu apa masalahnya.
00:08:33Saya menggunakan akun yang salah di sini.
00:08:35Sepertinya saya pakai yang ini.
00:08:37- Ini yang terbaik, melihat proses debugging dan langkah-langkahnya.
00:08:41Ini bagus sekali.
00:08:42- Ya.
00:08:44Oke, ya, saya sudah menghubungkannya di sini.
00:08:47Jadi yang ingin saya tunjukkan, hal keren tentang integrasi ini adalah Anda
00:08:51tidak perlu mengelola variabel lingkungan sendiri.
00:08:55Jika Anda punya pengalaman dengan itu, itu tidak menyenangkan, terutama saat Anda
00:08:59harus merotasi kunci Anda, yang mana itu ide yang sangat bagus.
00:09:03Jadi Vercel, sebenarnya integrasi Vercel dengan PostHog akan mengurus semuanya untuk Anda.
00:09:08Jadi yang harus Anda lakukan hanyalah mengeklik proses instalasi,
00:09:12seperti yang baru saja saya tunjukkan.
00:09:13Ini juga menangani penagihan, di mana kami punya tingkat gratis yang sangat royal.
00:09:17Jadi semoga Anda tidak perlu memikirkan itu di awal sampai produk Anda
00:09:21sukses besar, dan setelah itu, itu akan jadi kekhawatiran terkecil Anda.
00:09:24Tapi ya, ini akan menyinkronkan variabel lingkungan Anda.
00:09:28Hal utama yang kita butuhkan di sini, host PostHog adalah... saya tidak akan pamerkan
00:09:33karena saya tidak mau dikritik, tapi host-nya hanyalah sebuah URL.
00:09:39Jadi itu hanya seperti us.i.posthog.com.
00:09:43Kunci PostHog ini adalah bagian penting, dan itu yang akan memberi tahu PostHog,
00:09:48itu yang akan mengidentifikasi proyek Anda dengan PostHog.
00:09:50Jadi saat aplikasi Anda berjalan di produksi dan, kesalahan serta penggunaan
00:09:58dan feature flag dilaporkan kembali ke PostHog, kunci inilah yang akan
00:10:02mengidentifikasi produk Anda dengan proyek PostHog.
00:10:07Jadi sangat berguna memiliki pengaturan otomatis seperti itu di sini.
00:10:12Ada pertanyaan tentang sisi Vercel?
00:10:16Cukup sederhana.
00:10:17Tadi saya jelaskan sekilas dan sempat ada kendala juga, jadi mohon maaf.
00:10:21Tapi intinya, Anda instal, tautkan ke proyek Vercel yang ingin
00:10:25Anda gunakan, dan selesai.
00:10:28Ada juga, Anda tahu, kami punya panduan memulai di sini.
00:10:32Anda bisa melihat feature flag Anda di sini jika sudah diatur.
00:10:35Saya belum punya di proyek ini, tapi sebentar lagi akan ada.
00:10:40- Ya, ini bagus.
00:10:41Saya baru mau bilang, belum ada pertanyaan sekarang, yang menurut saya menunjukkan prosesnya cukup mulus.
00:10:47Saya tadi bertanya di obrolan, apakah ada yang sudah mencoba integrasi ini?
00:10:51Jika sudah, beri tahu kami dan silakan bertanya selagi kita lanjut.
00:10:54- Ya, dan jangan sungkan untuk memotong pembicaraan.
00:10:58Mari kita lanjut ke demo.
00:10:59Jadi saya punya aplikasi yang sedang berjalan.
00:11:01Saya membuat game kecil.
00:11:02Namanya Hog Hop.
00:11:04Dan saya punya PostHog kecil di sini.
00:11:06Ada beberapa serangga yang berkeliaran, dan saya mencoba mengumpulkan poin data.
00:11:12Max sedang melompat-lompat mengumpulkan poin data.
00:11:15Saya menemukan bug.
00:11:16Saat saya mengumpulkan poin data tertentu, permainannya macet.
00:11:21Saya tidak bisa melakukan apa-apa sekarang.
00:11:23Saya mengalami ini di produksi, dan saya butuh bantuan untuk mencari tahu apa yang terjadi.
00:11:28Saya bisa saja, seperti kata saya tadi, membuka DevTools.
00:11:32Saya bisa melihat log Vercel untuk mencoba mencari kesalahan.
00:11:41Tapi saya akan tunjukkan bagaimana Anda tidak perlu melakukan semua itu.
00:11:44Dan di v0, Anda bisa mengumpulkan semua konteks yang dibutuhkan tentang kesalahan tersebut dan memperbaikinya
00:11:50langsung di sana.
00:11:51Pertama, saya akan tunjukkan cara menambahkan MCP.
00:11:54Di pojok kiri bawah obrolan v0, ada tombol plus kecil ini,
00:12:01dan di sana ada tempat untuk MCP.
00:12:04Dan Anda tinggal klik Tambah MCP.
00:12:06Lalu PostHog sudah diatur sebagai semacam preset MCP.
00:12:10Saya sudah menghubungkannya, jadi tidak akan saya putuskan.
00:12:13Tapi Anda tinggal klik tombol plus, lalu Anda akan diminta masuk
00:12:18dengan akun PostHog Anda.
00:12:19Satu hal yang tidak saya tunjukkan tadi adalah saat Anda membuat integrasi ini
00:12:25dengan PostHog dan Vercel, Anda mendapatkan tombol "Buka di PostHog",
00:12:30dan itu akan memasukkan saya ke PostHog jadi saya tidak perlu mengurus kredensial.
00:12:36Saya sudah masuk di sini, lalu di v0, saat saya ingin menghubungkan MCP,
00:12:42saya tinggal klik untuk autentikasi, dan itu akan membuka tab PostHog untuk
00:12:48mengautentikasi MCP.
00:12:50Saya baru sadar saya belum mendefinisikan MCP, mohon maaf.
00:12:52MCP, Model Context Protocol, pada dasarnya adalah cara untuk mengumpulkan informasi
00:12:58guna memberi agen v0 kemampuan mengumpulkan informasi atau semacam
00:13:03memanggil fungsi yang terhubung ke akun ini.
00:13:07Jadi dalam kasus ini, kita bilang, "Hei, v0, jika kamu perlu bertanya atau mengelola
00:13:14sesuatu di PostHog," dan ini... produknya punya fitur yang sangat lengkap,
00:13:19MCP dari PostHog ini, jadi Anda bisa melakukan banyak hal di sana.
00:13:24Saya akan tunjukkan... kita punya dokumen... PostHog Docs, Model Context Protocol.
00:13:29Ini menunjukkan semua hal yang bisa Anda lakukan.
00:13:33Jangan merasa kewalahan dengan daftar ini.
00:13:35Semuanya sudah dimuat ke dalam agen.
00:13:36Jadi Anda bisa bertanya, seperti, "Apa yang bisa saya lakukan dengan PostHog MCP?"
00:13:42Dan dia akan memberi tahu Anda.
00:13:43Dan pastikan saja sakelar kecil ini sudah saya nyalakan di sini.
00:13:50Dan, ya, jadi yang ingin saya tunjukkan di sini adalah, sekali lagi,
00:13:55saat saya mencoba mengumpulkan titik data ketiga ini, saya mengalami bug.
00:14:00Aplikasi ini membeku begitu saja.
00:14:01Jadi saya akan menjelaskannya di sini.
00:14:04Tadi sudah disebutkan semua hal yang bisa saya lakukan dengan PostHog MCP.
00:14:08Jadi saya akan menjelaskannya kepada agen.
00:14:10Saya akan bilang, "Saat saya mengumpulkan titik data dengan max, terkadang ia membeku.
00:14:23Bisakah kamu menemukan bug tersebut menggunakan eror PostHog MCP dan memperbaikinya untukku?"
00:14:35Dan selagi proses berjalan, saya akan menunjukkan dasbor PostHog.
00:14:39Jadi saat saya di PostHog, saya bisa ke bagian apps lalu error tracking.
00:14:47Seperti yang saya katakan, PostHog bisa melakukan banyak hal.
00:14:50Jadi ada cukup banyak fitur yang bisa Anda jelajahi di sini.
00:14:55Kita hanya fokus pada beberapa saja agar Anda mendapat gambaran nyata tentang apa yang bisa dilakukan.
00:15:01Jika Anda lebih berpikiran teknis dan ingin melihat apa yang sebenarnya terjadi
00:15:04dengan eror-eror ini, Anda bisa membukanya dan melihat, Anda tahu, Anda bisa seperti,
00:15:11klik ke dalam eror tersebut dan melihat stack trace-nya.
00:15:14Anda bisa melihat berapa kali eror itu muncul.
00:15:17Dan apa lagi yang bisa Anda lihat?
00:15:20Masalah serupa.
00:15:21Satu hal, mari kita lihat apakah ini masih berfungsi.
00:15:25Oh, sudah diperbaiki.
00:15:26Oke. Saya akan tunjukkan hal lain saat kita harus menunggu agen nanti.
00:15:30Jadi ini menyatakan bahwa masalahnya sudah diperbaiki.
00:15:32Coba saya lihat apakah saya bisa melakukan deploy atau mengetesnya di preview.
00:15:37Mari kita lakukan itu saja.
00:15:39Baiklah.
00:15:39Jadi saya akan melompat-lompat, mengumpulkan sesuatu.
00:15:41Oh, ini berhasil.
00:15:42Bagus. Semudah itu.
00:15:46Jadi saya punya bug.
00:15:48Saya beri tahu apa yang saya lihat terjadi.
00:15:51Bahkan jika Anda tidak punya banyak informasi tentang cara mereproduksinya,
00:15:55Anda bisa memberi lebih sedikit informasi, cukup suruh dia mencari eror.
00:15:59Jadi saya bisa bertanya, apa ada eror lain di PostHog MCP yang harus kita perbaiki?
00:16:09Saya akan bilang eror hari ini saja, agar tidak terlalu jauh ke belakang.
00:16:12Hal lain yang ingin saya pamerkan adalah session replay, ini fitur yang sangat keren.
00:16:21Jadi saya sebenarnya bisa melihat -- oh, tampilannya tidak begitu bagus di sini.
00:16:27Oh, itu menarik.
00:16:28Oke. Kita lewati saja bagian itu, tapi saya akan memeriksanya nanti.
00:16:33Biasanya, Anda bisa melihat apa yang sebenarnya dilakukan orang-orang.
00:16:36Saya rasa mungkin karena teknologi yang kami gunakan pada game ini,
00:16:42rekamannya menjadi berantakan.
00:16:44Tapi mungkin di jenis aplikasi lain atau pastinya di aplikasi jenis lain.
00:16:50Saya belum pernah melihat ini terjadi di aplikasi lain.
00:16:51Jadi Anda bisa melihat bagaimana orang menggunakan aplikasi Anda dan apa masalah yang mereka hadapi.
00:16:58Dan hanya dengan melihat video langsung dari apa yang mereka lakukan bisa sangat membantu memberikan konteks.
00:17:04Itu memberi Anda jauh lebih banyak informasi daripada mencoba melihat
00:17:08aktivitas atau event atau hal-hal semacam itu, atau log.
00:17:13Baiklah, jadi kita punya beberapa eror lainnya.
00:17:16Dan ini adalah sesuatu yang ingin saya tekankan juga.
00:17:18Anda sebagai pembuat mungkin tidak tahu semua hal yang dialami pengguna di tahap produksi.
00:17:25Mereka mungkin tidak melaporkannya kepada Anda.
00:17:26Anda sendiri mungkin belum pernah mengalaminya.
00:17:28Maka dari itu, memiliki visibilitas ke semua eror bisa sangat membantu Anda.
00:17:34Dalam hal ini, ada beberapa eror lain yang sedang kita hadapi.
00:17:40Oh, sepertinya keduanya sudah diperbaiki.
00:17:43Bagus sekali. Ada pertanyaan tentang itu?
00:17:47Saya ingin lanjut ke bagian feature flag di sini.
00:17:51>> Belum ada pertanyaan di chat untuk saat ini, tapi ada beberapa komentar.
00:17:54Seseorang di chat bilang mereka punya banyak alat di satu tempat, skema gratis yang sangat murah hati,
00:18:01dan DX (Developer Experience) yang luar biasa di platform mereka, yang selalu menyenangkan untuk didengar.
00:18:05Pertanyaan dari saya sebenarnya, saya yakin Anda mungkin akan menyinggungnya di bagian selanjutnya.
00:18:11Tapi selain eror, apa saja hal bernilai tinggi lainnya yang bisa dilakukan PostHog MCP
00:18:19untuk pengguna v0 yang menurut Anda sering dilewatkan orang?
00:18:23>> Ya. Menurut saya, feature flag dan eksperimen adalah salah satu hal yang paling bermanfaat.
00:18:30Saya rasa banyak tim dan aplikasi yang belum menggunakannya padahal seharusnya iya.
00:18:38Jadi saya akan menunjukkannya sebentar.
00:18:40>> Ya, tentu saja.
00:18:41Transisi yang sempurna.
00:18:42>> Ya. Jadi mari kita tambahkan -- dalam hal ini, saya punya game ini.
00:18:46Saat ini saya belum punya cara untuk membasmi bug-nya.
00:18:48Khususnya yang satu ini, ada bug yang bergerak bolak-balik di platform kecil ini.
00:18:52Dan saya kesulitan mendapatkan titik data itu.
00:18:55Begitu juga dengan para pengguna saya.
00:18:57Jadi saya ingin membangun fungsionalitas tambahan.
00:19:01Mari kita buat kemampuan agar landak saya bisa menembakkan laser dari bola matanya.
00:19:16Tapi saya ingin menguji ini terhadap fungsionalitas yang berbeda.
00:19:22Saya sedang memikirkan tentang laser.
00:19:24Saya rasa kita bisa melakukan gaya klasik seperti Mario.
00:19:27Juga -- baiklah, mari kita mulai dengan membangun feature flag multivariant dengan laser sebagai satu varian
00:19:43dan kemampuan untuk melompat di atas bug untuk membunuh bug tersebut sebagai varian lainnya.
00:19:52Dan kemudian -- jadi ini akan -- yang ingin saya tunjukkan di sini adalah beberapa hal.
00:19:59MCP ini sangat kuat.
00:20:02Jadi Anda bisa menggunakan MCP untuk sebagian besar hal yang biasanya Anda lakukan di dasbor.
00:20:07Anda bisa melakukannya di dasbor.
00:20:10Akan saya tunjukkan jika kita pergi ke bagian apps.
00:20:17Lalu ke feature flag.
00:20:21Sebagian besar hal yang bisa Anda lakukan di MCP juga bisa dilakukan melalui chat di sini.
00:20:25Jika Anda menggunakan -- saya akan buka tab baru di sini.
00:20:29Oh, tidak ada cara untuk chat di tab tersebut.
00:20:33Ups.
00:20:34Saya kehilangan jejaknya.
00:20:37Jadi buka chat baru, nah ini dia.
00:20:39Saya bisa memberikan perintah yang serupa.
00:20:43Satu-satunya perbedaan adalah chat ini tidak akan punya kemampuan untuk memperbarui kode V0 saya, tentu saja.
00:20:48Saya harus menerimanya.
00:20:52Tapi saya masih bisa menggunakannya untuk mengelola feature flag.
00:20:55Atau di sini saya bisa membuat feature flag, Anda tahu, menggunakan -- dan itu seharusnya sedang dibuat
00:21:01sekarang juga.
00:21:02Nah ini dia.
00:21:03Eksperimen, buat.
00:21:04Saya bisa membuatnya melalui antarmuka pengguna (UI).
00:21:07Saya menunjukkan cara melakukannya via agen V0 menggunakan MCP karena menurut saya
00:21:16semakin banyak yang bisa saya lakukan langsung di agen saya seperti V0, semakin baik.
00:21:20Saya tidak ingin menghabiskan waktu mengklik sana-sini, mempelajari UI baru.
00:21:24Meskipun dasbornya sangat keren dan saya suka tampilannya, saya lebih suka menghabiskan
00:21:31lebih banyak waktu membangun langsung di V0.
00:21:35Bagus.
00:21:36Jadi eksperimen ini sudah disiapkan.
00:21:39Dan kita sudah menyiapkan beberapa metrik.
00:21:40Ini adalah salah satu kunci untuk eksperimen -- atau kunci utama eksperimen adalah
00:21:47apa hipotesis yang ingin Anda uji?
00:21:49V0 langsung membuatkan hipotesis untuk kita.
00:21:53Itu cukup keren.
00:21:55Mungkin saya ingin membacanya dan memperbaruinya.
00:21:58Ini menyatakan menguji mana yang menghasilkan tingkat penyelesaian game yang lebih baik.
00:22:02Itu keren.
00:22:03Mungkin tujuan saya adalah tingkat penyelesaian game.
00:22:05Tapi mungkin tujuan saya hanya durasi waktu yang dihabiskan untuk bermain.
00:22:09Saya rasa tingkat penyelesaian game cukup masuk akal.
00:22:13Jadi itu ditetapkan sebagai metrik utama.
00:22:16Pertama-tama Anda harus menentukan hipotesis.
00:22:18Apa yang sedang saya uji?
00:22:19Dalam hal ini, saya menguji apakah injakan lebih menarik atau laser yang lebih menarik?
00:22:26Dan kemudian kita akan menyiapkan metrik-metrik utama.
00:22:29Lalu ada juga konsep metrik sekunder yang menurut saya sangat penting.
00:22:33Metrik utama adalah tujuan utama yang ingin Anda capai.
00:22:38Tapi dengan fitur apa pun yang Anda tambahkan atau perubahan yang Anda buat, mungkin ada semacam
00:22:43efek sekunder dari hal tersebut.
00:22:44Dalam hal ini, mungkin mereka membunuh bug lebih banyak atau lebih sedikit per sesi.
00:22:49Bisa jadi mereka menyelesaikan game lebih cepat tapi membunuh bug lebih sedikit.
00:22:52Kemungkinan kecil terjadi.
00:22:53Atau, Anda tahu, jumlah kematian per sesi adalah hal lain yang perlu diperhatikan.
00:22:57Jadi setiap kali Anda menyiapkan eksperimen, penting untuk memikirkan, apa
00:23:02tujuan saya?
00:23:03Dan hal-hal apa saja yang mungkin terpengaruh oleh ini yang mungkin bukan
00:23:09tujuan utama, tapi saya ingin menyadarinya saat membuat keputusan tersebut.
00:23:14Pertanyaan cepat di sini, Brooker.
00:23:17Jika seseorang tidak sengaja menetapkan metrik tujuan yang salah di awal, seberapa mudah di PostHog
00:23:23untuk menyesuaikan eksperimen itu tanpa kehilangan semuanya di V0?
00:23:30Ya, Anda bisa melakukannya baik melalui MCP lagi atau chat atau di UI ini.
00:23:36Ada ikon pensil kecil di samping metrik tersebut.
00:23:39Anda tinggal mengkliknya.
00:23:41Lalu, katakanlah Anda ingin mengubahnya dari game selesai menjadi durasi waktu di
00:23:46aplikasi atau semacamnya.
00:23:47Anda akan klik di sini dan mencari sebuah event atau mungkin, kita memutuskan
00:23:53bahwa sebenarnya kita ingin memeriksa apakah mereka meninggalkan halaman lebih sering.
00:23:58Jadi saya bisa mengubahnya ke 'page leave'.
00:24:00Dan dalam hal ini, tujuan saya adalah agar angka tersebut menurun.
00:24:03Saya ingin orang-orang meninggalkan halaman dengan tingkat yang lebih rendah.
00:24:08Semudah itu.
00:24:10Anda juga bisa menggunakan MCP untuk melakukannya, yang menurut saya pribadi jauh lebih mudah.
00:24:16Tapi bagus untuk melihat kedua cara tersebut.
00:24:19Ya.
00:24:20Bagus.
00:24:21Ya.
00:24:22Dan sistem akan menghitung ulang hal tersebut.
00:24:23Terkadang yang saya alami adalah, saya mungkin menjalankan eksperimen.
00:24:27Saya melihat hasilnya dan itu membantu saya menyadari bahwa saya punya pertanyaan lain
00:24:32yang ingin saya ajukan.
00:24:33Seperti yang Anda katakan, saya ingin memperbarui metrik yang saya pantau.
00:24:36Ada kalanya mungkin saya belum punya event atau cara untuk memantau hal itu.
00:24:43Itu adalah tempat lain di mana MCP bisa sangat membantu.
00:24:46Anda bisa mengatakan sesuatu seperti tambahkan sebuah event.
00:24:48Saya sedang memikirkan contoh yang bagus seperti, saya tidak tahu, mungkin lompatan.
00:24:53Saya bisa menambahkan seperti, tambahkan event setiap kali si landak melompat.
00:25:02Dalam hal itu, Anda hanya akan memantau event tersebut tergantung apa
00:25:08yang Anda pantau untuk hal-hal seperti itu.
00:25:10Anda mungkin hanya memantaunya sejak saat Anda menambahkannya ke aplikasi Anda.
00:25:15Dan kemudian dalam hal itu, Anda bisa mengubah durasi eksperimen Anda untuk mulai dari
00:25:21waktu tertentu.
00:25:22Anda juga bisa menargetkan -- Oh, maaf.
00:25:24Saya minta maaf.
00:25:25Tapi jika Anda mengubahnya di tengah eksperimen, apakah ada rekomendasi
00:25:31praktik terbaik apakah sebaiknya mengulang tes atau aman untuk terus mengumpulkan data
00:25:38dalam eksperimen yang sama?
00:25:40Ya, itu pertanyaan yang bagus.
00:25:42Selama Anda menyadari berbagai perubahan yang mungkin berdampak pada apa yang
00:25:48sedang Anda lakukan.
00:25:49Saya tidak melihat masalah dengan meneruskan eksperimen yang sama.
00:25:55Mungkin ada skenario di mana ada perubahan lain yang terjadi pada saat bersamaan
00:25:59yang bisa berdampak pada eksperimen Anda.
00:26:02Jadi Anda harus benar-benar sadar akan semua pengujian berbeda yang Anda jalankan, dan
00:26:06bagaimana mereka bisa saling memengaruhi satu sama lain.
00:26:09Itu sebabnya saya merasa secara umum, dalam kasus ini kita melakukan multi-variant,
00:26:15di mana saya punya injakan dan laser, sepertinya laser ditetapkan sebagai kontrol.
00:26:20Tapi saya mungkin ingin kontrol yang seperti tidak ada senjata.
00:26:30Bisa sangat membantu untuk mengelompokkan semuanya ke dalam satu eksperimen agar Anda tidak mengalami
00:26:35masalah di mana eksperimen yang berbeda saling bersaing.
00:26:38Apakah itu masuk akal?
00:26:39Ya, itu masuk akal.
00:26:41Ya.
00:26:42Dan mari kita lihat di mana kita, oh, saya belum memasukkannya ke antrean.
00:26:45Oke, jadi sudah selesai.
00:26:47Kita sudah punya mata laser.
00:26:48Mari kita lihat apa yang terjadi jika kita menggunakan aplikasinya sekarang.
00:26:51Oke, keren.
00:26:52Saya punya laser, tapi tidak membunuh musuhnya.
00:26:57Itu payah.
00:26:58Jadi, Anda mungkin akan mengalami hal ini juga.
00:27:02Saya tidak memberikan perintah yang efektif pada v0.
00:27:05Jadi kita tidak akan menyalahkan v0 untuk hal itu.
00:27:07Saya hanya bilang tembakkan laser dari matanya.
00:27:10Tapi saya tidak bilang bunuh serangganya dengan laser tersebut.
00:27:12Jadi Anda juga bisa menargetkan pengguna yang berbeda.
00:27:16Misalnya, saya bisa bilang, targetkan pengguna saya untuk fitur menginjak.
00:27:23Lalu kita lihat apakah ia bisa menemukan siapa pengguna saya.
00:27:26Ini agak menguji batas kemampuan agen dan MCP, tapi MCP
00:27:31memang memiliki kemampuan untuk menemukan pengguna.
00:27:35Dan kemudian mengatur varian eksperimen untuk pengguna tersebut.
00:27:41Dan Anda bisa menargetkan kohort yang berbeda untuk varian yang berbeda.
00:27:46Jadi jika Anda ingin bilang, semua orang di Australia dapat mata laser, Anda bisa melakukannya.
00:27:51Bisa begitu.
00:27:53Dan ya, sepertinya waktu kita hampir habis, bukan?
00:27:56Saya lupa berapa lama.
00:27:57Ya, benar.
00:27:58Saya baru saja memeriksanya.
00:27:59Tapi ya.
00:28:00Oke, ya.
00:28:02Saya bisa membiarkan ini terus berjalan.
00:28:03Tapi jika Anda punya pertanyaan lain atau hal yang belum saya bahas, itu akan
00:28:08sangat menarik.
00:28:09Ya, ada pertanyaan lain yang masuk, yaitu bagi
00:28:15pengguna v0 yang baru dalam hal eksperimen, apakah Anda punya semacam daftar periksa
00:28:21agar orang-orang tidak membuat eksperimen yang “buruk” atau mungkin menyesatkan?
00:28:27Ya, itu... saya tidak yakin 100%.
00:28:31Saya tahu kita punya panduannya.
00:28:32Saya tidak ingin mencoba mencarinya di sini secara langsung.
00:28:34Tapi saya pasti bisa memberikan panduannya nanti.
00:28:38Kita bisa.
00:28:39Ya, kami pasti bisa melampirkannya di bagian sumber daya di obrolan ini.
00:28:43Jadi ya, tentu saja.
00:28:44Ya.
00:28:45Lalu Anda bisa mencoba lewat AI, saya sarankan orang-orang untuk
00:28:50bertanya di chat, jelajahi UI-nya, ada banyak hal yang membantu, seperti
00:28:55hipotesis yang saya sebutkan, Anda tidak melihatnya di v0.
00:28:58Jadi mungkin membantu untuk membuka UI-nya dan melihat apa lagi yang ada di sana
00:29:02yang bisa Anda coba mainkan.
00:29:05Atau sekadar bertanya pada v0, seperti, hal apa saja yang mungkin
00:29:10saya lewatkan di sini?
00:29:11Apa lagi yang bisa kita lakukan dengan ini?
00:29:13Jadi saya sarankan Anda manfaatkan v0 semaksimal mungkin untuk hal seperti itu,
00:29:18atau AI PostHog adalah pilihan lain untuk mengobrol di PostHog.
00:29:23Wah, saya bahkan tidak tahu kalian punya fitur itu.
00:29:26Itu keren sekali.
00:29:27Saya rasa saya menanyakan ini di setiap sesi integrasi kami, tapi untuk jangka panjang,
00:29:35apa yang sedang kalian siapkan?
00:29:36Ada yang bisa dibagikan dengan kami?
00:29:38Ya, jadi kami melihat masa depan pengembangan perangkat lunak dan produk akan lebih otonom.
00:29:45Dan saya rasa itu sudah mulai terjadi.
00:29:47Tapi menurut saya masih ada jalan panjang yang harus ditempuh.
00:29:53Jadi hal-hal seperti resolusi kesalahan yang saya tunjukkan tadi, saya rasa tidak lama lagi
00:29:59hal itu akan menjadi standar dalam sebuah aplikasi, seperti, saya punya aplikasi yang berjalan.
00:30:04Dan ada sesuatu yang berjalan di latar belakang yang memperbaiki kesalahan tanpa saya harus
00:30:09menyuruhnya, dan mungkin saya mendapatkan semacam laporan tentang apa yang terjadi.
00:30:15Tapi pada akhirnya, di masa depan, saya tidak ingin harus memerintah AI untuk memeriksa kesalahan,
00:30:20saya tidak ingin harus mendapatkan peringatan di tengah malam dan
00:30:24terbangun karena adanya eror.
00:30:26Saya rasa, di masa depan, semacam sistem, bisa jadi PostHog,
00:30:35bisa jadi Vercel, atau mungkin kolaborasi keduanya.
00:30:38Mereka pada dasarnya akan mengumpulkan informasi; eror hanyalah satu hal.
00:30:43Ada pemutaran ulang sesi yang saya tunjukkan, analitik produk, eksperimen adalah hal lainnya,
00:30:49di mana saya tidak perlu lagi membuat metrik yang berbeda secara manual.
00:30:53Dan menariknya, di sini kita melihat v0 sebenarnya sudah memilihkan beberapa
00:30:57metrik yang menarik untuk kita.
00:31:00Tapi saya mungkin akan memiliki agen yang memantau hal-hal itu di masa depan dan melakukan
00:31:05pembaruan kode tanpa saya perlu memberikan perintah yang sangat spesifik seperti itu,
00:31:14tapi saya pasti akan tetap memandu secara strategis, seperti pengalaman eksperimen
00:31:19apa yang saya inginkan untuk game saya?
00:31:20Apa metrik yang saya targetkan?
00:31:22Tapi untuk hal-hal teknis tingkat bawah, menurut saya banyak yang akan
00:31:26ditangani secara otonom.
00:31:28Ya, pengembangan otonom.
00:31:30Ya.
00:31:31Ya, saya suka visi itu karena pada dasarnya selaras dengan semua yang kami bicarakan
00:31:37di Vercel dan juga v0.
00:31:40Semuanya tentang menutup siklus dari penerapan (deploy).
00:31:43Lalu observasi di PostHog, lalu memperbaiki dan mengulang secara otomatis.
00:31:49Itu luar biasa.
00:31:50Satu pertanyaan terakhir sebelum kita tutup karena saya tahu waktu kita sudah habis.
00:31:56Bagaimana orang-orang bisa terlibat dalam komunitas PostHog?
00:32:00Saya tadi bilang di awal bahwa PostHog itu sumber terbuka (open source).
00:32:03Apakah Anda menerima kontribusi?
00:32:05Saya tidak tahu apakah informasi saya benar.
00:32:06Ngomong-ngomong.
00:32:07Saya pernah membacanya.
00:32:08Ya.
00:32:09100%.
00:32:10Ada beberapa PR yang masuk dari berbagai tempat yang kami tinjau.
00:32:16Ada juga forum PostHog tempat Anda bisa mengajukan pertanyaan.
00:32:21Kami mengadakan acara langsung.
00:32:22Sekali lagi, andai saja saya ingat URL-nya, tapi saya akan berikan nanti.
00:32:26Ya, tentu saja.
00:32:27Ya, ada acara langsung.
00:32:29Dan silakan daftar saja.
00:32:30Gunakan aplikasinya.
00:32:31Beritahu kami pendapat Anda.
00:32:32Hubungi kami di X atau LinkedIn atau apa pun yang Anda gunakan.
00:32:37Beri tahu kami pendapat Anda, kami sangat aktif di platform tersebut.
00:32:40Luar biasa.
00:32:41Terima kasih banyak, Brooker.
00:32:43Ini sungguh luar biasa.
00:32:44Dan untuk semua penonton, jika Anda punya pertanyaan lanjutan, silakan tulis di
00:32:49chat dan kami akan pastikan tim PostHog menindaklanjutinya.
00:32:54Tapi ya, terima kasih banyak, Brooker.
00:32:56Saya menghargai waktu Anda di sini.
00:32:58Terima kasih.
00:32:59Ya.
00:33:00Terima kasih sudah mengundang saya.
00:33:02Luar biasa.
00:33:03Terima kasih banyak semuanya sudah bergabung dalam obrolan dan sesi langsung hari ini.
00:33:08Jika Anda belum tahu, kami mengadakan sesi komunitas langsung hampir setiap minggu.
00:33:14Jadi jika Anda mengunjungi [community.vercel.com/events](https://www.google.com/search?q=https://community.vercel.com/events), Anda akan melihat kalender
00:33:21berisi semua acara tatap muka dan daring kami.
00:33:24Beri tahu kami integrasi apa yang ingin Anda lihat selanjutnya di sesi komunitas kami?
00:33:31Dan kami pasti akan mewujudkannya.
00:33:33Hebat.
00:33:34Baiklah, terima kasih banyak semuanya sudah bergabung hari ini.
00:33:39Dan sampai jumpa di sesi langsung berikutnya.

Key Takeaway

Integrasi PostHog dengan v0 di platform Vercel merevolusi siklus pengembangan dengan memungkinkan deteksi kesalahan otomatis dan pengujian fitur berbasis data langsung dari antarmuka AI.

Highlights

Integrasi langsung antara PostHog dan v0 memungkinkan pengembang untuk beralih dari ide ke eksperimen langsung tanpa meninggalkan lingkungan kerja.

PostHog menyediakan platform analitik sumber terbuka yang mencakup feature flag, pengujian A/B, pelacakan peristiwa, dan pelacakan kesalahan.

Model Context Protocol (MCP) memberikan kemampuan bagi agen v0 untuk mengidentifikasi dan memperbaiki bug secara otomatis berdasarkan data dari PostHog.

Eksperimen multivariant dapat dikelola langsung melalui obrolan v0, memungkinkan pengujian fitur seperti laser vs injakan dalam game secara efisien.

Visi masa depan pengembangan perangkat lunak mengarah pada sistem otonom yang dapat memperbaiki kesalahan dan mengoptimalkan kode berdasarkan analitik produk secara mandiri.

Pemasangan integrasi PostHog di Vercel sangat mudah dan menangani sinkronisasi variabel lingkungan serta penagihan secara otomatis.

Timeline

Pembukaan dan Pengenalan Sesi Komunitas Vercel

Sesi dimulai dengan Pauline Navas dari tim komunitas Vercel yang menyambut para peserta di platform live. Ia menjelaskan peran tim komunitas dalam memahami apa yang dibangun pengguna di Vercel melalui interaksi di media sosial dan platform internal. Pauline menekankan pentingnya sesi ini sebagai sarana koneksi langsung antara pengembang dan penyedia layanan. Suasana awal diisi dengan sambutan hangat kepada penonton yang bergabung dari berbagai lokasi di seluruh dunia. Bagian ini menetapkan panggung untuk diskusi teknologi integrasi yang akan menjadi fokus utama pertemuan hari ini.

Pengenalan PostHog dan Integrasi v0

Pauline memperkenalkan PostHog sebagai platform analitik produk sumber terbuka yang sangat komprehensif untuk pengembang. Alat ini mencakup fitur penting seperti pengujian A/B, pelacakan peristiwa khusus, dan feature flag untuk membantu memahami perilaku pengguna. Highlight utama adalah integrasi baru PostHog dengan v0 yang memungkinkan pengembang melakukan eksperimen tanpa hambatan. Konsep "luncurkan dulu, pikirkan analitik kemudian" kini digantikan oleh proses pembangunan yang terintegrasi dengan data. Hal ini memungkinkan pemantauan produk yang lebih cerdas sejak tahap awal pengembangan di lingkungan Vercel.

Visi Pengembangan dan Penggunaan PostHog di Produksi

Brooker, seorang product engineer dari PostHog, bergabung untuk menjelaskan manfaat konkret menggunakan platform ini bagi pengguna v0. Ia menyoroti tantangan dalam memahami kinerja aplikasi dan kepuasan pengguna setelah peluncuran ke tahap produksi. Brooker menjelaskan bagaimana kesalahan yang tidak terduga sering muncul di produksi meskipun aplikasi terlihat lancar saat mode pratinjau. Dengan PostHog, pengembang mendapatkan visibilitas dan konteks yang dibutuhkan agen AI untuk memperbaiki masalah tersebut tanpa harus mereproduksinya secara manual. Fokus utama sesi ini adalah penanganan kesalahan (error handling) serta penerapan feature flag yang strategis dalam tim.

Demo Pemasangan Integrasi PostHog di Vercel

Brooker melakukan demonstrasi langsung mengenai cara menginstal integrasi PostHog melalui Marketplace Vercel. Prosesnya sangat mulus karena Vercel secara otomatis menangani variabel lingkungan (environment variables) dan sinkronisasi kunci proyek. Pengguna tidak perlu lagi mengelola kredensial secara manual, yang seringkali menjadi beban teknis dan berisiko keamanan. Brooker menunjukkan bahwa integrasi ini juga mencakup manajemen penagihan dengan tingkat gratis yang sangat royal bagi pengembang baru. Langkah-langkah teknis ini membuktikan betapa mudahnya menghubungkan analitik canggih ke dalam alur kerja Vercel saat ini.

Debugging Otomatis Menggunakan MCP di v0

Bagian ini menunjukkan kekuatan Model Context Protocol (MCP) dalam menghubungkan v0 dengan data real-time dari PostHog. Brooker memperlihatkan sebuah game bernama "Hog Hop" yang mengalami bug membeku di produksi, lalu ia meminta agen v0 untuk memperbaikinya. Agen tersebut menggunakan MCP untuk mengakses log kesalahan di PostHog, mengidentifikasi penyebabnya, dan menerapkan perbaikan kode secara instan. Fitur session replay juga diperkenalkan sebagai cara untuk melihat rekaman visual tentang bagaimana pengguna berinteraksi dengan aplikasi. Demonstrasi ini menekankan bahwa pengembang tidak perlu lagi menebak-nebak penyebab eror karena konteksnya sudah disediakan oleh AI.

Implementasi Feature Flag dan Eksperimen Multivariant

Diskusi berlanjut ke penggunaan feature flag dan eksperimen untuk menguji fitur baru seperti kemampuan menembakkan laser pada karakter game. Brooker menjelaskan cara mengatur hipotesis dan metrik utama, seperti tingkat penyelesaian game, langsung melalui perintah chat di v0. Ia menekankan pentingnya metrik sekunder untuk memantau efek samping dari perubahan fitur terhadap perilaku pengguna secara keseluruhan. Pengguna dapat menargetkan varian tertentu kepada kelompok pengguna yang berbeda, misalnya berdasarkan lokasi geografis, melalui MCP. Fleksibilitas ini memungkinkan pengambilan keputusan berbasis data yang jauh lebih cepat daripada metode pengembangan tradisional.

Masa Depan Pengembangan Otonom dan Penutup

Dalam bagian penutup, Brooker berbagi visi tentang masa depan pengembangan perangkat lunak yang akan menjadi lebih otonom. Ia memprediksi sistem di mana AI secara mandiri memantau, memperbaiki kesalahan, dan mengoptimalkan kode tanpa intervensi manual yang intens dari pengembang. Kolaborasi antara platform seperti Vercel dan PostHog akan menutup siklus dari penerapan hingga observasi dan perbaikan otomatis. Pauline menutup sesi dengan memberikan informasi tentang cara berkontribusi ke komunitas sumber terbuka PostHog dan mengundang penonton ke acara komunitas berikutnya. Sesi berakhir dengan ajakan bagi para pengembang untuk mencoba integrasi ini dan memberikan umpan balik untuk pengembangan lebih lanjut.

Community Posts

View all posts