Ship 26 NYC - Workshop - Dari init hingga deploy dalam 30 menit
VVercel
Computing/SoftwareSmall Business/StartupsInternet Technology
Transcript
00:00:00Halo semuanya. Selamat datang. Nama saya Gordon Diggs. Saya seorang engineering manager di Stripe.
00:00:08Dan saya Colin Wren. Saya juga seorang insinyur di Stripe.
00:00:11Bagus. Jadi dalam hackathon ini, kita akan mulai dari nol dan membangun aplikasi yang dideploy
00:00:17menggunakan berbagai penyedia layanan, mudah-mudahan hanya dalam 30 sampai 40 menit. Tapi pertama-tama, kami ingin memastikan
00:00:24semua orang di sini memiliki persyaratan minimum untuk mengerjakan ini. Jadi Anda butuh
00:00:29laptop. Anda butuh semacam lingkungan koding berbasis agen, apakah itu Cloud Code atau Codex atau
00:00:35Cursor. Dan ini tidak benar-benar berfungsi di ponsel atau tablet. Jadi jika Anda tidak punya
00:00:43laptop, nikmati saja dan tonton. Itu juga tidak apa-apa. Keren. Jadi sekitar 10 menit pertama
00:00:51lokakarya ini, kita akan membahas Stripe Projects, memberi Anda beberapa ide aplikasi, membantu Anda
00:00:56menyiapkan CLI. Dan 30 menit setelahnya, Anda akan menggunakan agen Anda untuk membangun aplikasi
00:01:02dari awal hingga deploy dan menyediakan layanan dengan Stripe Projects. Di akhir, Anda dapat mengirimkan
00:01:09aplikasi terdeploy Anda ke papan peringkat kami. Lalu semua orang bisa memilih aplikasi yang mereka sukai. Dan
00:01:16mungkin akan ada pemenangnya. Kita lihat saja. Mari kita mulai dengan gambaran umum tentang Stripe Projects,
00:01:22yaitu produk baru dari Stripe yang memungkinkan Anda atau agen Anda dengan cepat dan aman
00:01:28menyediakan infrastruktur. Stripe Projects adalah plugin untuk Stripe CLI yang memungkinkan Anda atau agen Anda
00:01:36menyediakan layanan seperti hosting, basis data, nama domain, dan semacamnya. Sebagian besar layanan memiliki versi
00:01:44gratis dan berbayar. Jadi Anda tidak perlu mengeluarkan uang selama hackathon ini. Namun untuk apa pun
00:01:51yang berbayar, Projects memusatkan pembayaran Anda melalui Stripe secara terpadu sehingga Anda membayar semua
00:01:59layanan cloud Anda dengan satu metode pembayaran. Setelah penyedia terhubung, Projects menyimpan variabel
00:02:09lingkungan yang relevan ke komputer lokal dan cloud Anda, dan variabel tersebut tersedia untuk Anda tarik
00:02:15ke komputer lain dan semacamnya. Sekali lagi, untuk lokakarya ini, menggunakan versi gratis
00:02:21saja sudah cukup. Ini adalah kategori penyedia saat ini. Colin, sepertinya kamu sedikit menutupi
00:02:28kode QR-nya. Jadi itulah kategori yang kita miliki. Untuk daftar lengkap penyedia, Anda cukup menjalankan
00:02:35Stripe projects catalog di CLI atau lihat halaman penyedia di kode QR ini.
00:02:40Keren. Luar biasa. Beberapa dari Anda mungkin sudah punya ide proyek apa yang ingin
00:02:47dibangun. Itu bagus. Namun jika belum, kami ingin memberi Anda beberapa contoh aplikasi yang telah
00:02:52dibangun dengan Projects. Aplikasi ini memberi Anda gambaran tentang apa yang realistis untuk dibangun dan
00:02:58dideploy dalam waktu sekitar 30 menit agar rencana Anda tidak terlalu ambisius untuk waktu yang ada.
00:03:04Ya, berikut beberapa contoh aplikasi yang dibangun oleh tim Stripe saat pertama kali menguji Projects.
00:03:10Semua aplikasi ini dideploy secara langsung dan banyak di antaranya menggunakan hosting, maaf, penyedia basis data dan autentikasi.
00:03:17Di sini ada dasbor analitik GitHub. Ini dasbor kustom untuk menarik data dari API
00:03:22GitHub. Menggunakan web hosting, basis data, dan penyedia autentikasi. Lalu ada Happiness Jar di sini. Ini cara yang menyenangkan
00:03:27untuk menulis catatan bagi diri sendiri sepanjang hari demi mengisi toples Anda dengan kebahagiaan. Ini menggunakan autentikasi, basis data,
00:03:33dan hosting. Lalu My Garden. Ini aplikasi berkebun kecil. Anda bisa mencatat tanaman Anda dan mengingatkan
00:03:40kapan harus menyiramnya, menggunakan hosting dan basis data. Terakhir, kita punya Tiny Tails. Ini aplikasi kecil
00:03:45yang menggunakan agen untuk merekomendasikan buku anak-anak berdasarkan berbagai topik. Yang ini menggunakan API AI LLM dan
00:03:52hosting. Sekali lagi, pikirkan saja proyek yang skalanya kira-kira seperti ini yang bisa
00:03:57Anda bangun dalam waktu yang dialokasikan. Setelah Anda punya ide untuk proyek Anda, kita akan menghabiskan
00:04:02sisa waktu lokakarya untuk membangunnya menggunakan agen. Penting untuk memulai dengan prompt yang baik saat
00:04:08bekerja dengan agen. Khususnya, sebutkan jenis layanan apa yang ingin Anda gunakan. Katakan saja,
00:04:13“Saya ingin mengideploynya. Saya ingin menggunakan basis data,” dan semacamnya. Anda bisa lebih spesifik mengenai
00:04:17jenis layanan yang ingin Anda gunakan. Katakan saja, “Saya ingin menggunakan Vercel untuk hosting,” atau biarkan
00:04:21Stripe, maaf, atau biarkan agen Anda memilih dari katalog Stripe Projects untuk Anda. Jadi Anda bisa
00:04:26mengatakan, “Saya butuh basis data.” Stripe Projects akan memilih dan menginisialisasikannya untuk Anda. Di bagian akhir
00:04:32lokakarya ini, seperti yang disebutkan Gordon, kita punya papan peringkat projects.dev tempat Anda akan mengirimkan
00:04:38proyek Anda dan memilih proyek mana yang paling Anda sukai. Hanya dengan membagikan proyek Anda di sini,
00:04:45Anda akan mendapatkan kredit Stripe. Sekarang Gordon akan memandu Anda untuk memulai penggunaan Stripe
00:04:50Projects. Keren. Baiklah. Mari kita mulai. Seperti yang saya katakan, untuk menyelesaikan lokakarya ini, Anda membutuhkan
00:04:58tiga hal. Empat hal jika menghitung laptop: lingkungan berbasis agen, akun Stripe,
00:05:05dan Stripe CLI. Kami punya panduan peserta. Ada baiknya Anda memindai ini.
00:05:11Ini akan memberi Anda semua informasi yang ada di beberapa slide berikutnya,
00:05:15sehingga Anda bisa menyimpannya. Sangat disarankan untuk memindai kode QR ini. Saya beri waktu satu menit.
00:05:21Mengerikan rasanya saat Anda berbicara dan semua orang mengeluarkan ponsel mereka,
00:05:23tapi memang saya yang menyuruhnya. Jadi tidak apa-apa. Jika Anda belum memiliki akun Stripe,
00:05:30yang juga gratis, Anda bisa memindai ini. Tautannya ke [dashboard.stripe.com/register](https://www.google.com/search?q=https%3A%2F%2Fdashboard.stripe.com%2Fregister).
00:05:38Itu akan berhasil. Saya beri waktu sebentar untuk memindainya jika perlu.
00:05:47Keren. Hal berikutnya yang Anda butuhkan adalah Stripe CLI dengan plugin Stripe Projects.
00:05:52Ada perintah NPX berguna yang bisa Anda jalankan di sini. Pastikan Anda mencentang Stripe
00:05:58best practices dan Stripe projects saat ditanya skill apa yang ingin Anda tambahkan. Lalu ini
00:06:05adalah prompt yang dapat digunakan di lingkungan agen Anda untuk memasang Stripe CLI.
00:06:13Atau jika ingin memasangnya langsung di Mac, gunakan brew install. Di Windows, gunakan scoop.
00:06:23Itu juga berfungsi. Saya belum pernah memakai scoop karena jarang ngoding di Windows,
00:06:27tapi Homebrew luar biasa. Jadi saya bisa merekomendasikannya. Mantel.
00:06:33Jadi, setelah menjalankan semua perintah ini, plugin Stripe Projects seharusnya sudah terpasang.
00:06:40Anda dapat mengujinya dengan menjalankan Stripe projects dash dash help,
00:06:44seperti yang ditunjukkan di sini. Ada yang mengalami masalah saat penyiapan? Angkat tangan Anda jika butuh
00:06:51waktu lebih untuk memasang Stripe Projects CLI. Oke, kita tunggu satu atau dua menit lagi,
00:06:57lalu kita lanjutkan. Sekali lagi, jalankan Stripe projects dash dash help. Jika Anda melihat
00:07:02output Bantuan di sana, artinya instalasi berhasil dan siap digunakan.
00:07:08Jika masih mengalami masalah, kami bisa menghampiri dan membantu dalam beberapa menit. Jadi jangan
00:07:13terlalu khawatir.
00:07:14Semoga semua orang sudah memasangnya. Jika belum, tidak masalah. Panggil kami nanti, kami siap membantu.
00:07:26Setelah terpasang, masuk ke direktori tempat Anda ingin membuat proyek lalu jalankan Stripe projects
00:07:35init. Anda opsional bisa memasukkan nama proyek Anda. Jika tidak, perintah ini akan menggunakan nama
00:07:40direktori tersebut. Saat menjalankan perintah init ini, beberapa berkas utama akan dibuat. Ini akan
00:07:45membuat folder .projects yang berisi state.json dan state.local.json. Berkas-berkas ini menjadi sumber kebenaran untuk
00:07:53akun yang Anda gunakan, informasi penyedia, dan sumber daya proyek Anda.
00:07:59Anda juga akan melihat adanya berkas skill Stripe project CLI. Ini adalah skill yang akan memberi tahu agen Anda
00:08:08cara menggunakan Stripe Project CLI. Dan setelah Anda mulai menambahkan layanan ke proyek Anda,
00:08:14kami akan mengambil kunci rahasia untuk layanan tersebut dan menambahkannya ke berkas .env Anda. Kami juga mengunduh skill
00:08:24agen untuk layanan tersebut ke direktori .agent/skills untuk mengajari agen cara terbaik memanfaatkan
00:08:31layanan tersebut. Sekarang Anda punya semua yang dibutuhkan untuk mulai membangun. Kembali ke Anda, Gordon. Mantap.
00:08:37Luar biasa. Baiklah. Sekarang giliran Anda. Anda bisa mulai membangun. Waktu Anda sekitar 30 menit untuk membuat
00:08:45proyek Anda. Jika ada pertanyaan tentang Stripe Projects, kami siap menjawabnya. Cukup angkat
00:08:50tangan Anda. Jika butuh bantuan menyiapkan lingkungan, kami akan datang dan memandu.
00:08:57Saya akan menampilkan beberapa hal. Ini adalah beberapa perintah yang bisa digunakan di Stripe Project.
00:09:03Perintah init sudah kita bahas. Perintah catalog juga sudah, tempat Anda melihat penyedia. Gunakan add untuk menambah
00:09:10penyedia atau layanan. Perintah open akan membuka dasbor penyedia. Sinkronisasi variabel lingkungan.
00:09:19Jika ingin melihat pengeluaran Anda, kami punya perintah khusus untuk itu. Dan
00:09:24menjelang akhir, saat Anda siap membagikan proyek, ada perintah Stripe project share,
00:09:29yang akan membagikan tech stack yang dipilih. Yaitu daftar penyedia yang sudah dipilih.
00:09:34Jika butuh ID akun, Anda bisa mendapatkannya di sana juga. Ya, terima kasih sudah hadir.
00:09:40Terima kasih sudah berpartisipasi. Kita punya waktu sekitar 30 menit. Silakan bangun, deploy, angkat tangan jika ada
00:09:46pertanyaan, dan kirimkan karya Anda di sini. Tapi saya akan kembali ke slide ini. Ini adalah panduan
00:09:55partisipasi asli yang memuat semua informasi dari slide tadi. Ya. Ada yang mau
00:10:01berbagi ide aplikasi yang sedang dibangun? Jika bisa meluangkan waktu sekitar 10 detik
00:10:08dari pengerjaan aplikasi untuk berbagi.
00:10:12Ya. Aplikasi yang ingin saya buat pernah coba saya bangun sendiri sebelumnya,
00:10:22tapi saya ingin mencoba membuatnya dengan ini. Pada dasarnya ini aplikasi untuk mencari rekan latihan
00:10:31seni bela diri, misalnya Jiu Jitsu. Saya menyadari aplikasi seperti ini belum ada. Jadi,
00:10:36katakanlah tempat latihan Anda tutup, atau saat akhir pekan, atau Anda sedang bepergian dan ingin berlatih,
00:10:40tetapi semua tempat latihan tutup. Jika ada seseorang di sekitar Anda yang juga berlatih, Anda tidak akan pernah
00:10:43tahu kecuali jika ada aplikasi ini yang memungkinkan Anda untuk mencocokkan dengan orang lain yang juga
00:10:48mencari teman berlatih, dan kemudian berlatih bersama. Kerenn. Itu ide saya. Maksud saya,
00:10:52saya ingin mencobanya. Luar biasa. Ya. Semoga berhasil. Itu hebat sekali. Sempurna. Ya. Itu contoh yang
00:10:56bagus karena Anda bakal butuh web hosting, butuh basis data,
00:11:00butuh autentikasi, dan butuh nama domain. Ya, ide yang sangat bagus.
00:11:04Keren. Jika ada pertanyaan lain tentang Stripe Projects atau Stripe secara umum,
00:11:08kami punya stan di luar sana. Saya akan berada di sana. Saya yakin Colin juga akan ke sana.
00:11:12Jangan ragu untuk mampir dan berbincang tentang Stripe, kami juga punya beberapa souvenir Stripe. Terima kasih
00:11:17semuanya sudah datang dan semoga Anda menikmati penggunaan Stripe Projects. Keren. Terima kasih semuanya. Terima kasih semuanya.