Ngobrolin Monorepo - Ngobrolin WEB
Yuk mari kita diskusi dan ngobrol ngalor-ngidul tentang dunia web. Agar tetap up-to-date dengan teknologi web terkini. Topik, tautan dan pertanyaan menarik bisa dilayangkan ke https://ksana.in/ngobrolinweb Kunjungi https://ngobrol.in untuk catatan, tautan dan informasi topik lainnya.
Ringkasan Episode
Bantu KoreksiEpisode ini membahas konsep Monorepo dalam pengembangan software, sebuah strategi di mana kode dari banyak proyek disimpan dalam satu repository. Host membahas definisi Monorepo, perbedaannya dengan monolitik dan multirepo, serta kelebihan dan kekurangannya. Diskusi mencakup berbagai tools yang mendukung Monorepo seperti Lerna, NX, Turborepo, dan workspace features dari NPM, Yarn, PNPM, dan Bun. Episode juga menampilkan contoh implementasi Monorepo dari perusahaan besar seperti Google dan proyek open source populer seperti React, Next.js, dan Bun.
Poin-poin Utama
- •Monorepo adalah strategi pengembangan software di mana kode dari banyak proyek disimpan dalam satu repository, berbeda dengan multirepo yang memisahkan setiap proyek
- •Kelebihan Monorepo termasuk berbagi resource dan business logic dengan mudah, dependensi yang terpusat, dan memudahkan onboarding tim baru
- •Kekurangan Monorepo meliputi ukuran repository yang besar, proses build yang menjadi satu, dan kurang cocok untuk organisasi dengan silo unit bisnis yang rahasia
- •Tools populer untuk Monorepo: Lerna (sekarang diakuisisi oleh NX), NX, Turborepo (ekosistem Vercel), dan workspace features dari package manager modern
- •Perusahaan besar seperti Google menggunakan Monorepo dengan miliaran baris kode dalam satu repository, menggunakan tools proprietary seperti Bazel
- •Contoh implementasi Monorepo di proyek open source: React repository menggunakan NX, Next.js dan Bun juga menggunakan struktur Monorepo
- •Workspace features dari NPM, Yarn, PNPM, dan Bun memungkinkan pengelolaan dependensi yang efisien dengan symbolic linking untuk menghemat storage
- •Episode disponsori oleh Hektivate yang menawarkan bootcamp dengan diskon Rp 10 juta untuk full-time dan Rp 4 juta untuk night bootcamp selama Ramadhan
- •Topik minggu depan akan membahas Basic Web Security berdasarkan voting dari penonton
0:00[Music]
0:10[Music]
0:14[Music]
0:17Udah sering ya? Halo-halo-halo kebiasaan.
0:20Harus ganti ya, berarti next-nya aja.
0:23[Music]
0:26Delolet-delolet ya.
0:30Selamat malam semuanya, gimana kabarnya?
0:35Gimana cuaca malam hari ini?
0:38Iya, selamat menaikan di Bada Kepuasa.
0:40Banjir ya, wah mudah-mudahan teman-teman gak ada yang kena ya atau kalau udah beraluh lah, mudah-mudahan.
0:46Tadi barusan ujan sih, ujan lagi ya.
0:50Di tengsal dan sekitarnya.
0:53Tapi lokasi parah juga ya, ternyata ya.
0:56Dairah saya sih alhamdulillah aman, cuma keluar dari daerah saya gak bisa gitu misalnya kemana-mana, jadi ya stay at home.
1:05Untung sekolah anak-anak masih dalam komplek.
1:08Oh iya tadi anak saya juga gak sekolah.
1:11Diliburkan?
1:13Enggak sih, karena kita meliburkan saya dan istri saya meliburkan anak saya, karena jalan menuju ke sekolah, banjir.
1:22Macet, oh banjir.
1:24Iya, lumayan kata yang lewat hanya mobil Pak Jero, sudah saya mundur teratur.
1:34Yang bisa lewat cuma Pak Jero gitu.
1:38Atau Fortuner, jadi kan tinggi ya.
1:41Di mobil saya kayaknya, ah udahlah males gitu kan. Pernah sekali maksa, akhirnya nyesel gitu, karena kayak keter-ketir selama jalan, aduh masuk gak ya, masuk gak ya.
1:57Gitu, setelah efeknya tuh, ini ya panjang ya.
2:04Iya, jadi ya meskipun pendek, tapi kan kalau kena gelombang kan.
2:10Kayak masuk juga ya.
2:12Masuk juga, kayak risiko.
2:15Lagi mobil saya ada baterainya, bahaya.
2:19Hybrid, hybrid.
Lihat transkrip lengkap
2:21Iya.
2:23Ini Dui, Mas atau Umba?
2:30Namanya umum ya. Selamat malam Mas Riki, kalau ini kita tau ya Mas ya.
2:39Selamat malam.
2:41Mbak Eka mana Mbak Eka?
2:43Mbak Eka mana dia?
2:44Oh masih OTW ya.
2:46Iya, jadi malam hari ini kita akan membahas satu topik yang sebenarnya sudah cukup lama disarankan oleh salah satu penonton.
2:58Cuman baru kita realisasikan malam ini.
3:03Jadi 2 minggu yang lalu kita buka GitHub Discussion.
3:10Kita buka GitHub Discussion, terus ternyata salah satu yang paling banyak foodnya adalah Monorepo.
3:19Yang paling tinggi sebenarnya Web Security.
3:25Cuman Web Security ini kayaknya kita butuh narasumber.
3:30Sebenarnya Monorepo juga sebenarnya butuh narasumber nih, karena kita gak tau banyak tentang Monorepo.
3:36Jadi berhubung belum ada yang bisa digadikan narasumber, jadi kita sambil belajar aja.
3:45Karena Ivan udah pengalaman belum pakai Monorepo.
3:53Jadi satu Repo bisa untuk host beberapa komponen kan maksudnya kan ya?
3:58Untuk banyak aplikasi.
4:00Apa sih definisinya?
4:02Definisinya? Oke kita langsung, ini aja ya. Langsung, eh bentar jangan langsung-langsung dong.
4:09Ada pesan sponsor dulu.
4:11Oh iya. Nah harus ada ini nih, harus ada rundownnya di kita sekarang.
4:16Jadi episode ini disponsori oleh Hektivate yang kebetulan lagi buka promo selama Ramadhan.
4:27Kalau temen-temen tertarik ya, mau meningkatkan skill, mau ikutan bootcamp.
4:34Jadi bootcamp yang ada diskonnya itu ada dua.
4:39Yang pertama untuk full time yang bootcampnya itu pagi sampai malam lah ya, sampai sore.
4:46Eh eh kak, kita lagi sponsor nih.
4:49Bootcamp ya. Bootcamp, jadi kalau yang full time bootcamp itu setidaknya sampai Jumat. Kayak kerja lah ya, jam 9 sampai jam 5, jam 6.
4:58Nah kalau yang bekerja dan gak mau full time ada kelas malam atau night bootcamp.
5:04Diskonnya kalau yang full time itu 10 juta, kalau yang night bootcamp itu 4 juta selama Ramadhan.
5:09Jadi langsung aja, kalau ada yang tertarik langsung ke hektivate.com.
5:13Kalau yang kena banjir ada diskon tambahan gak?
5:23Promo code, saya yang korban banjir.
5:30Korban banjir misalnya.
5:33Jadi saya lagi ngungsi ya kan, lagi ngungsi gak bisa kerja, yaudah ikut bootcamp online aja.
5:39Ikut bootcamp aja gitu ya.
5:44Lendem banget.
5:45Mudah-mudahan ya temen-temen yang susah keluar, aksesnya kena banjir atau ada keluar yang kena banjir, mudah-mudahan cepat beralulah ya.
5:57Ngeri juga ngeliatnya, sampai ke puncak segala ya.
6:01Uar biasa.
6:09Oh longsor, kira puncak bisa banjir gimana ceritanya.
6:13Kalau puncak banjir kita keren dong mas, abis.
6:17Bukan banjir, longsor, longsor ya.
6:20Apa namanya, apa sih banjir, longsor, gunung melektos itu namanya apa?
6:26Pencana alam.
6:28Pencana alam, pencana alam, ya ampun.
6:33Banjir bukan pencana alam ya?
6:35Ya dia apa?
6:36Nggak, banjir bukan pencana alam.
6:38Pencana alam lah.
6:40Tapi kita kira kebanjir, air tergenang.
6:44Semantik.
6:47Gara-gara ujan, atau gara-gara orang yang buang sampah sembarangan gitu ya.
6:53Nggak sih, kan gara-gara seru-seru dibekasi mah.
6:58Namanya sama, ngobrolin banjir.
7:01Ngobrolin banjir.
7:03Terima kasih kepada sponsor Hektifate untuk setelah memponsori episode malam ini.
7:14Oke, kita kembali ke Monorepo.
7:17Monoservice lagi, Monorepo.
7:20Tadi Ivan nanyain tentang definisi.
7:23Definisi.
7:24Definisi, Monorepo adalah mono itu single.
7:29Repo itu adalah singkasan dari repository.
7:34Jadi repository yang jumlo.
7:38Single kan?
7:40Gue nggak punya soundboard.
7:42Tapi sebenarnya gagal.
7:46Tapi sebenarnya berisi keluarga besar.
7:51Ini biasanya Eka suka mengeluarkan analogi-analogi yang di luar nurul ya biasanya.
7:56Jadi kita tuh lagi.
7:59Monorepo.
8:00Jadi terdiri dari dua kata, mono dan repo.
8:05Mono itu kan satu.
8:07Repo itu repository kumpulan kode lah ya.
8:11Nah, ini adalah salah satu strategi di dalam software development.
8:16Dimana kode dari banyak project disimpan di satu tempat.
8:21Ya.
8:23Gitu.
8:25Jadi ini tidak ada hubungannya dengan monolitik ya?
8:33Ya, saya pernah menggunakan Monorepo kalau definisinya begini.
8:40Oh, pernah ya?
8:42Saya nggak tahu itu namanya Monorepo jaman itu.
8:45Ini kan mungkin kapan sih ditulis?
8:48View history coba, view history kapan ditulis?
8:50Ini? 2000?
8:52Nggak, ini view history, penjelasan view history-nya.
8:57Kapan ditulis?
8:59Karena terlalu banyak istilahnya.
9:01Iya, terlalu banyak repo kayak saya tahun 2015.
9:072015 tuh nggak ada gitu, saya nggak nggak nggak nggak nggak.
9:13Jadi praktiknya udah ada, tapi namanya Monorepo belum pakai itu lah gitu kan maksudnya.
9:19Berarti jaman itu saya belum menyebutnya Monorepo.
9:22Eh 2018, sorry 2018 belum ada ya.
9:25Dan saya pakai itu di 2015.
9:29Tapi ini katanya praktiknya sudah ada di tahun 2000an.
9:33Iya.
9:34Katanya.
9:35Contohnya Gnu.
9:37Gnu kan?
9:39SSG gitu kan udah dipakai dari SSG lah.
9:41Iya.
9:43Cuma istilahnya nggak tahu ya.
9:45Itu Gnu kan project yang ini kan?
9:51Monorepo ya.
9:52Monorepo yang sesemua isi utilitasnya dalam situ semua kan, satu repo.
9:57Nggak tahu ya kalau jaman itu pakai repo ya?
9:59Iya kayaknya.
10:00Nah soal terminologi nih, coba deh buka di private chat.
10:03Ada penjelasan yang lumayan bagus soal perbandingnya.
10:08Oh ini bagus nih, monolid, multirepo, monorepo.
10:13Monolid, multirepo, monorepo.
10:15Hello awesome people.
10:17Ini micro front-end, beda lagi ya micro front-end ya.
10:21Nah kalau ini kan kita pernah bahas ya sama Rehow.
10:25Ya jadi satu aplikasi, satu aplikasi berisi micro apps.
10:33Banyak micro apps dijalankan di satu environment yang sama gitu ya.
10:37Gnu patokannya apa sih kita butuh itu kalau anggota tim kita mulai berantem ya.
10:41Mulai berantem, betul.
10:43Ya kalau udah tenyok-tenyokan.
10:45Kalau nggak salah kalau dependensi, urusan dependensi.
10:51Jadi kalau misalnya tim ini sudah butuh dependensi A dan tim B.
10:55Maksudnya sama-sama ada react nih.
10:57Satu tim sudah naik ke 19, satu lagi masih 18, tetapi belum mau naik.
11:02Akhirnya udah bikin aja sendiri gitu.
11:05Ya itu di episode 105, berarti 15 episode yang lalu.
11:11Kita sekarang sudah di episode 120.
11:14Oke, jadi kurang lebih micro front-end itu adalah satu aplikasi bisa terdiri dari banyak micro-micro apps gitu ya.
11:24Yang bisa dikerjakan oleh orang yang independen, tim independen ya masing-masing ada.
11:29Ya ada yang recommendation, tim popular, popular recommendation, ada yang search, ada yang playlist, macem-macem ya.
11:38Kurang lebih kayak gitu.
11:39Nah kalau monolitik, apa nih, monolitik ya.
11:44Satu projek yang besar, satu projek yang besar, dijadikan satu projek secara keseluruhan.
11:55Jadi dia tightly coupled ya, artinya sangat tergantung satu dengan yang lain, sulit terpisahkan.
12:03Lawannya adalah micro service, micro service itu hampir sama kayak micro front-end.
12:09Yang ini kan kalau micro service back-end ya berarti ya.
12:13Yang satu service itu, satu service itu bisa berdiri sendiri.
12:21Ya mungkin dia tetap butuh dependency, misalkan kayak login itu kan sama ya service yang sama.
12:27Dia bisa konsumsi service lain tapi dia bisa istilahnya tidak tergantung,
12:35tidak banyak tergantung kepada tim yang lain atau dengan service yang lain.
12:39Jadi bisa asingkronus lah kerjanya ya, tidak tergantung.
12:45Kalau biasanya misalkan kita udah mulai mengarah ke micro front-end atau micro service gitu ya,
12:57kita kan biasanya karena tim yang terpisah secara otomatis repo-nya juga biasanya dipisahkan.
13:06Itu kan nalurinya ya, ideal, bukan idealnya, biasanya gitu ya.
13:12Biasanya.
13:13Ya kita bikin tim, ya udah kita bikin repo baru gitu kan, atau bikin service kita bikin repo baru.
13:18Bikin repo, bikin repo, bikin repo jadi banyak kan, multi repo kan istilahnya kan.
13:22Ini juga saya pernah bikin bikini dulu juga, jaman dulu.
13:27Waktu jamannya micro service saya bikin multi repo, micro service.
13:33Problemnya apa kalau banyak repo kayak gini?
13:37Maintainnya susah, pindah-pindah repo.
13:43Betul, kalau kita mau jalani aplikasinya, semua repo-nya harus kita klon,
13:50kita jalani npm start, terus tiba-tiba ada yang konflik portnya kah, atau apa, terus dependensinya banyak.
13:57Misalkan yang satu pakai React versi berapa?
14:00Iya.
14:01Berapa sekarang React?
14:02Kalau jaman itu belum jaman, waktu saya pakai multi repo, belum jamannya React React kan.
14:08Anggap itu masih PHP, dan masih pakai Code Inventor.
14:11Di query?
14:12Nggak, Code Inventor, jadi backend-nya.
14:14Oh, CI, oke.
14:16Jadi micro service saya buatnya.
14:18Jadi saya pisah-pisah, oke, payment endpoint sendiri repo-nya, terus admin.
14:27Admin dashboard sendiri.
14:30Admin dashboard sendiri, terus kemudian untuk shop, apa, public shop front-end-nya sendiri.
14:38Landing page sendiri.
14:40Landing page, lebih tepatnya untuk redirect.
14:45Oh, user facing-nya sendiri, admin-nya sendiri, back-office sama front-office-nya.
14:50Iya, betul. Jadi pisah-pisah. Aku pisah-pisah proses deployment-nya pun yang bisa nge-deploy sendiri ya.
15:02Terus dependensi, misalnya payment butuh REST API dari database mana, gitu.
15:10Terus REST API-nya yang di sini harus di-update, yang di sana harus di-update.
15:15Kalau misalnya skema-nya berbeda ya, dua-duanya harus di-update berbarengan dan di-deploy.
15:20Jadi maintain-nya jadi, cost of maintenance-nya jadi tinggi.
15:24Hmm, oke.
15:27Kalau multi repo.
15:29Termasuk juga ini, kalau kita punya bisnis logic yang sama, yang digunakan oleh banyak project kan nggak bisa dipakai ya.
15:38Harus masing-masing punya sendiri kan. Harus di-duplicate, gitu kan.
15:45Nggak, atau dipublish jadi package.
15:48Oh iya, dipublish sama package.
15:50Dan jaman itu juga saya melakukan sebuah kesalahan. Jadi setiap aplikasi itu bisa langsung akses ke database.
15:57Wah!
15:59Jadi kalau misalnya di aplikasi tertentu update skema database, di aplikasi yang lain berusak, bisa jadi rusak.
16:12Soal proses migrasi database-nya.
16:15Wah, ini bukan microservice ini. Belum masih tightly coupled.
16:20Itu namanya Cowboy Service lah.
16:23Cowboy Service.
16:25Kesalahan asetiknya saya jaman dulu.
16:28Soal apa istilahnya terbakan hype.
16:33Ikutin hype.
16:34Iya, tapi salah kamu.
16:36Ngesan.
16:39Akhirnya dibangun, karena sudah terjadi masalah, dibangunlah satu aplikasi middle layer yang digunakan.
16:46Jadi semuanya aplikasi harus lewat API. Jadi API Gateway gitu ya.
16:51Ya udah, berarti secara cost of maintenance-nya lagi nambah.
16:56Jadi ada satu-satu tim lagi yang ngurus API.
16:59Oh, kirain tadi mau ngomong akhirnya, akhirnya saya resign gitu.
17:06Reset kabur.
17:09Mumut ah gitu dah, terlalu banyak.
17:15Timnya kecil, repo yang diurus banyak. Jadi nggak imbang.
17:20Terus update link-in, implement microservice.
17:24Implement API Gateway gitu ya.
17:28Itu apa, problem atau masalah-masalah yang terjadi di multi repo dan juga microservice ya.
17:38Bukan hanya multi repo.
17:39Nah, bayangin aja misalkan yang tadi ya, kayak microservice yang beneran lah ya.
17:45Yang beneran yang sudah independent, masing-masing.
17:49Terus repo-nya masing-masing.
17:51Misalkan saya mau cobain ada nambahin fitur yang bisa konek ke Payment Gateway
17:57di project kita, di Git yang satunya.
18:00Ya, kita kan harus klon dulu, jalanin dulu kan.
18:04Jadi sangat sulit gitu.
18:07Belum lagi yang tadi ya apa, kayak mau share code atau mau share bisnis, ya bisnis logic.
18:13Lojik yang pure function lah, yang sebenarnya bisa dipisah, tapi akhirnya jadi harus kopas-kopas.
18:21Apalagi project 1, project 2, project 3, project 4.
18:25Desain sistemnya, kayak kalau di front-end UI kan, kalau bisa aja kita punya banyak web app,
18:33tapi kan kayak warna, bright colors-nya, desain toker-nya kan sama.
18:37Itu juga jadi nggak bisa di-use.
18:40Betul. Jadi anggap kata-kata kita pakai teknologi yang sama lah ya.
18:46Project 1, 2, 3, 4 ini 4-4-nya adalah Node.js Application.
18:51Tapi bisa aja di project 1 Node.js versi 20, yang ini versi 21, versi 22, versi 23 gitu.
19:00Masing-masing juga pakai express.
19:02Express-nya juga entah mungkin sama, entah juga berbeda.
19:05Kalaupun sama, masing-masing punya node module sendiri.
19:09Jadi besar sekali kan.
19:11Makanya muncul lah solusi Monorepo.
19:15Monorepo ini kita masih di dalam satu Git, tapi project-nya ada di dalam situ.
19:20Jadi kalau misalkan kita mau jalanin aplikasinya, kita nggak usah repot-repot Git satu-satu,
19:27tapi kita klon semuanya, jalankan yang kita butuhkan.
19:32Install dan jalankan yang kita butuhkan.
19:35Benar nggak sih?
19:38Betul.
19:40Betul ya.
19:42Nah ini ada monolitik ya. Ini bahasa monolitik.
19:45Nah itu Monorepo.
19:49Monorepo is well-defined relationship between multiple different repos and each other.
19:56Ini case statement-nya terlalu philosophic ya.
20:00Terlalu philosophic ya.
20:02Tapi sekejap lagi kelebihan kekurangannya bagus sih, penjelasan kelebihan kekurangannya.
20:07DG to share resource tadi ya. Codebase atau business logic ya.
20:12Itu bisa di-share di berbagai lapisan.
20:19Kayak lerna salah satu ini ya.
20:23Nah saya dulu pernah pakai lerna.
20:25Dependensinya jadi satu. Oh lerna ya.
20:28Selamat malam Mas Abu Lucu.
20:31Halo.
20:32Ini lucu banget.
20:34Common dependencies tadi. Dependensisnya jadi satu.
20:38Ya nggak sih ya.
20:40Kalau sekarang.
20:42Karena lerna itu udah lama banget.
20:44Kayaknya udah.
20:46Emang udah outdated deh lerna.
20:49Iya udah outdated.
20:50Jadi gampang sih.
20:52Saya bikin ini.
20:54Bikin satu repo sendiri, Monorepo.
20:58Terus khusus untuk komponen-komponen.
21:01Dump komponennya saya. Semua-semua dump komponen dimasukin situ.
21:05Dan apa namanya?
21:09Pernah nggak sih kalian mendengarkan?
21:12Atomic architecture.
21:15Atomic architecture.
21:18Atomic architecture tapi di front-end taunya.
21:20Ya front-end.
21:21Iya taunya CSS.
21:23Atomic CSS.
21:24Jadi dari.
21:25Atomic komponen.
21:26Organism.
21:28Itu kan yang website dokumentasinya warna orange itu kan?
21:32Molekul.
21:33Iya betul ada molekul.
21:35Terus segala macem.
21:36Jadi saya bikin Atomic architecture.
21:38Atomic komponen disitu.
21:40Jadi mulai dari paling kecil nih misalnya button.
21:43Di atas button ada.
21:45Ada text.
21:47Habis itu ada card.
21:49Habis ada card.
21:50Ada.
21:51I don't know.
21:53Bisa makin lama makin isinya komposite dari berbagai macam atom-atom-atom.
21:59Jadi komposite jadi molekul.
22:01Di molekul jadi apa?
22:03Organism.
22:04Sampai sebuah satu page misalnya.
22:07Jadi saya publish itu pakai learner semua ke github.
22:12Untuk sebagai kayak NPM-nya gitu ya.
22:16Jadi NPM-nya tapi koniknya ke private repo.
22:19Ini dia atom design.
22:21Design system.
22:22Mana yang gambarnya?
22:23Gambar atom-atom itu?
22:26Di mana ya?
22:27Iya itu desainnya.
22:30Read now, read now.
22:32Ini.
22:33Atomic design dulu nih.
22:34Mungkin yang 2.
22:36Nah ini.
22:40Pusing-pusing lah.
22:42Mau bikin UI doang harus ketemu kimia.
22:45Nah ini dia.
22:46Atom, Molekul, Organism, Template, Pages.
22:50Jadi semuanya dipublish ke...
22:53Jadi satu repo, tetapi komponennya dipublish semua ke private.
23:01Kayak NPM-nya tapi private di github.
23:04Jadi saat di projeknya, saya tinggal kayak install komponen-komponen ini.
23:14Tinggal pakai.
23:15Jadi mau pakai di aplikasinya, saya hanya tinggal pakai organismnya aja.
23:22Mau postcard, articlecard, apekard.
23:27Itu tinggal import-import pasang-pasang.
23:33Itu pun ada, tapi ada challenge-nya juga.
23:36Nggak semuanya bahagia di situ.
23:39Pastilah.
23:40Versioning itu bahaya di situ.
23:43Versioning-nya susah.
23:44Kalau mau update sebuah komponen, itu runtetannya banyak yang harus diupdate.
23:52Jadi kalau saya update satu yang paling kecil atomnya, button misalnya, jadi semuanya kena.
23:59Harus diupdate.
24:01Dan kalau udah banyak projek yang pakai, ya harus hati-hati mengupdate sebuah komponen.
24:08Karena bisa jadi regression di tempat lain.
24:12Nah ini kan tadi kita udah lihat keunggulannya, kekurangannya juga ada.
24:21Yang pertama adalah reponnya jadi besar.
24:24Terus untuk deploy-nya juga jadi satu.
24:31Lama jadi satu semuanya sekaligus.
24:35Yang ketiga adalah kalau teman-teman bekerja di perusahaan yang silo,
24:42yang masing-masing unit bisnisnya itu punya rahasia,
24:46yang tidak boleh diketahui oleh unit bisnis lain, ya nggak bisa.
24:49Reponnya jadi satu, kita bisa lihat semua kodenya.
24:52Berarti emang peruntukannya bukan buat tim-tim yang tertisah.
24:58Mungkin lebih baik buat solo developer atau tim kecil.
25:03Tim kecil, ya kalau tim yang istilahnya yang transparan dan mungkin secara,
25:11kalau misalkan microservice itu dia masih ada, apa ya,
25:15masih ada ketergantungan dengan fungsi-fungsi atau dengan service-service yang lain,
25:20kan kalau microservice kan kayaknya dia bener-bener terpisah gitu kan.
25:24Kalau ini masih ada hubungannya, masih konek lah, masih harus konek gitu ya kayaknya lebih cocok gitu.
25:30Untuk hal-hal yang seperti itu.
25:33Terus apa lagi tadi? Nah ini, storage ya udah pasti ya, jadi lebih besar gitu ya.
25:42Cuman kalau dipikir-pikir kalau misalkan kita punya empat versi Node.js lebih gede dong gitu kan,
25:49dibandingkan cuma satu versi Node.js yang dipakai rame-rame.
25:52Halaman wiki ini mungkin apa, lama kali, lama nggak diupdate.
25:57Kan sekarang ada rolling stack membantu ya, kayak yarnwork spaces aja udah ngebantu.
26:04Habis itu sekarang ada kayak turbo repo atau semacamnya, justru lebih kecil sih.
26:09Node modules-nya tuh kayak ada semacam same link gitu, jadi kalau yang dependensinya sama,
26:15pnpm contohnya, untuk parallel packages, yarnwork spaces-nya tuh paling enak, the best.
26:30Iya, jadi perusahaan-perusahaan yang menggunakan juga perusahaan-perusahaan besar ya,
26:34kayak Google itu codebase-nya jadi satu semua, jadi satu repo.
26:38Jadi kalau temen-temen join salah satu perusahaan ini, kalau kita mau mulai onboarding dan masuk ke project-nya,
26:47itu kita bisa lihat semua code-nya dalam satu repo.
26:50Oh? Serius?
26:53Kalau yang udah ke Google, masih nggak ya?
26:56Masalah kan, Mas Risa kan ex-Meta, ex-Google, ex-Microsoft kan?
27:02Amin, amin. Masuk aja belum udah ex gimana sih?
27:09Ini ada paper-nya. Ada paper-nya, billions of lines of code in a single repository.
27:21Dan mereka punya ini sendiri.
27:26Ya, makanya dibikin artikel-nya karena itu menarik berarti kan?
27:33Kan yang waktu kita interview, Mas siapa tuh yang kita di Google sama Mas Arya Hidayat juga?
27:39Saya masih ada fotonya.
27:44Mas Bram.
27:46Oh iya Mas Bram.
27:48Bukan Bramus ya, bukan Bramus.
27:50Bukan Bramus.
27:51Mas Bram, orang Surabaya. Iya kan dia bilang semuanya jadi satu.
27:56Nggak ingat. Saya kan sibuk merekam dan mempertahankan stand-nya kamera.
28:12Nggak boleh geraknya.
28:15Dan kedinginan.
28:21Ini semua perusahaan yang besar ini ya itu.
28:25Apa?
28:27Itu kapan?
28:29CDS kan itu ya?
28:31Chrome Dev Summit 2018.
28:33Ya, bulan November ya.
28:36Belum kenal kalian sama sekarang ya.
28:38Belum kenal.
28:40Iya, dingin.
28:42Ya, intinya adalah jadi satu repo besar itu dijadikan satu.
28:51Meskipun, ada tadi yang Ivan sebutkan di PNPM atau NPM itu ada namanya workspaces.
28:57Jadi meskipun kita download semuanya jadi satu, tapi bisa aja kita NPM installnya yang paket-paket tertentu aja.
29:06Atau proyek-proyek tertentu aja nggak semua.
29:09Itu kelebihan ya kan dibanding monolith, kalau tadi kan monolith ya skopnya luas banget.
29:15Tapi kalau dianggap satu proyek.
29:18Nah, kalau ini kalau mono repo itu kita mindset-nya banyak proyek, tapi dalam satu kontainer lah bisa dianggap.
29:27Jadi perproyek itu bisa punya paket sendiri.
29:30Kalau yang nggak, bukan kapan dependensi kan bisa nginstall paket masing-masing, bisa saling menginstall sama lain.
29:39Paket A punya dependensi B, B punya dependensi C.
29:44Kalau dulu mungkin itu repo, tapi kalau sekarang dengan tooling-tooling yang udah ada, itu kayak bisa diurusin lah sama situs itu.
29:52Nah, terus bisa juga dipapis.
29:54Basal ya, salah satunya ya?
29:56Bisa dipapis separately juga, jadi misalnya kalau konteksnya kita bikin UI library atau komponen library kan kadang-kadang tuh yang diinstallnya satu persatu.
30:08Maksudnya kita cuma mau nginstall kartu komponen atau data picker.
30:13Kalau mau, proyek-proyek itu juga bisa dipapis ke NPM separately.
30:19Atau kalau misalnya web app, Next.js atau apapun, ya bisa di deploy secara terpisah juga ya.
30:26Jadi publishingnya itu bisa terpisah-pisah walaupun dalam satu mono repo.
30:31Itu salah satu kelebihan utamanya juga nggak sih?
30:35Ya. Basal ini yang dipakai Google ya?
30:40Kayaknya iya ya. Yang bikin Google ya.
30:43Oh iya benar. Tools, semua tools-nya.
30:49Dari style UI-nya aja udah.
30:52Oh iya, material design ya.
30:55Ini adalah tools untuk mono repo-nya mereka kan?
30:59Basal, ada Lerna, ada banyak sih sekarang Turbo Repo, NX.
31:09Mau contoh lagi, ada contohnya di sini ada,
31:14kalau temen-temen pernah buka repository-nya React.
31:20React library-nya ya, yang buat development-nya, bukan buat make-nya.
31:26Kalau make-nya kan tinggal NPM install ya.
31:29Tadi soalnya ada yang nanya juga sekalian ya. Masih rekomendasi, masih.
31:34Jadi kalau di Repo-nya React di sini, NX mono repo, ya NX betul.
31:41NX itu ternyata mengakuisisi Lerna. Nah kita bahas nanti aja dulu.
31:46Ya, ada packages. Jadi di package-nya React itu ada banyak dependensi lain.
31:53Tapi dependensi-nya bukan di NPM. Dependensi-nya di Repo-nya sendiri.
31:58Contohnya ada React DOM pasti di sini. React DOM.
32:02Mau dipublish ke, itu masih-masih kan dipublish ke NPM juga.
32:06Jadi maksudnya secara external, orang kan kita bisa install React DOM.
32:12Pakai apa dia di sini?
32:14Iya, pakai apa dia?
32:16Pakai package design.
32:18Kalau dulu saya pakai Lerna.
32:20Bukan. Untuk nge-publishnya itu.
32:22Workspace.
32:23Pakai workspace.
32:25NPM workspace kan? NPM workspace, PNPM workspace,
32:29Deno workspace, Boon workspace, semuanya pakai package design aja.
32:33Kayak gini aja udah sama dia.
32:35Jadi bisa gontah-ganti sebenarnya.
32:37Eh, nggak tahu sih bisa gontah-ganti atau nggak.
32:39Tapi mereka pakai notasi yang sama.
32:42Ih, pakai roll-up mereka.
32:45Iya.
32:47Nah, tuh lihat aja build script-nya. Build for dev tools.
32:52Build lah, kalau React mah yarn lah pastinya ya. Karena yarn juga dibikin oleh timnya React kan.
33:00Pakai yarn ya.
33:02Coba aja, apa, scroll ke bawah, ada nggak publish?
33:06Publish?
33:08Publish pre-releases.
33:10Ini, this comment has been deprecated.
33:15Oh, dia ganti.
33:21Ya, intinya gitu. Ada lagi, contoh lagi, misalkan Boon.
33:26Boon juga repo-nya menggunakan Monorepo.
33:30Sveil.
33:34Sama.
33:35Ini, ah, spell. Apanya spell?
33:37Nggak, maksudnya Sveil juga Monorepo kan.
33:40Oh, iya.
33:42Ada packages juga.
33:44Berarti proyek-proyek open source yang populer tuh rata-rata Monorepo ya?
33:48Karena nggak makes sense itu.
33:51Kalau core-nya, maksudnya package yang disupport dari core-nya.
33:57Nggak makes sense sih kalau dibikin repo terpisah.
34:00Nah, handle-nya susah. Maintaining-nya susah.
34:05Karena sudah bisa beda repo, beda build tools, harus di-maintain, dependensi.
34:11Itu cost of maintenance-nya tinggi.
34:15Wah, Mas Ricky juga sudah pakai Boon workspace ya.
34:19Mantap.
34:21Di Deno juga ada, jadi sudah lengkap ya.
34:24IARN ada, NPM ada, PNPM ada, Deno, Boon, ada semua.
34:29Kalau kita pakai workspace ya.
34:32Tapi adanya teknologi workspace itu membantu banget sih sekarang.
34:39Untuk bisa Monorepo sangat-sangat membantu.
34:42Iya.
34:44Karena setiap packages itu kita bisa define itu tadi.
34:47Bisa ada global dependency.
34:50Bisa ada workspace dependency atau private dependencies-nya.
34:54Dan bisa interlink antar packages kita sendiri.
34:58Waktu nge-build dia cukup.
35:02Itu kan kalau ngurus sendiri rada ribet ya. Masa rawan bahaya.
35:06Dependensinya A, bergantung pada B.
35:09B bergantung pada C dan seterusnya.
35:12Kalau pakai tools yang sudah ada, kita bikin command-command-nya saja.
35:17Abis itu diurus sama tools.
35:20Ini ada contoh juga.
35:22Next.js Monorepo ya.
35:25Nah, ini nih favorite sih.
35:28Jadi ini kalau buat yang front-end, front-end atau full stack.
35:33Ini contoh yang ini unofficial.
35:36Tapi, aduh, gue seneng banget nih.
35:38Karena, apa ya, well-structured sama well-documented kayak rapih banget.
35:43Penjelasannya juga bagus.
35:45Tuh, lihat kontributurnya yang di kanan atas.
35:48Sampai pernah full request.
35:51Eka ada Eka.
35:53Itu benar-benar sesuatu. Nggak tahu, nggak inget apa.
35:56Nah, cuma kalau pengen tahu...
35:58Bukan. Nggak kelihatan nih.
36:00Jadi kepu Eka commit apa nih?
36:05Minorefix sih. Karena pakai...
36:09Mana?
36:11Ya, pokoknya pernah.
36:13Nggak tahu, itu 5 commit.
36:17Klik 5 commit.
36:19Nggak ada.
36:21No, no, no, no.
36:23Di reset.
36:25Karena kelihatannya 5 commit ada.
36:29Gimana bisa masuk kalau...
36:32Kenapa sih nggak mungkin ada?
36:35Kenapa dianggap 0 ya?
36:37Oh iya, dulu belum digerasi Gavik VT.
36:42Sekarang itu untuk digerasi Pulley ke VT.
36:46Ya, ininya sih nggak penting.
36:49Tapi itu minorefonnya menarik deh.
36:51Jadi, skenario-nya adalah Web App Next.js.
36:56Tapi ada UI library-nya yang separate.
36:59Nah, terus UI library-nya itu dibikin pakai storybook.
37:04Dulu kita pernah pakai storybook.
37:07Jadi maksudnya enak kan?
37:09Untuk utility, core, ada UI-nya.
37:13Ada storybook-nya.
37:15Kalau yang bukan UI, nggak ada storybook-nya.
37:18Ya, UI-nya dipisah di satu tempat.
37:21Web App-nya, kita mau bikin 1 web app...
37:24Atau mau bikin 10 web app, misalnya.
37:26Kita punya macem-macem, misalnya.
37:29Micro-site atau apapun itu.
37:32Ya, nggak harus pakai NCS juga kan.
37:35Misalnya kita satu produk pakai NCS.
37:38Produk lain, kita cuma pakai.
37:40Lebih simpel nih.
37:41Pengen read sama react yang client-site aja misalnya.
37:45Atau pakai apapun itu.
37:47Ya, udah ditambah. Ini mau 1, mau 2, mau 10.
37:50Bisa kayak dengan relatif gampang tambahin di sini.
37:54Nah kan, kalau hal-hal kayak branding,
37:56mungkin design tokens, yang UI yang common,
37:59itu bisa di-install dari CUI lib tadi.
38:02Tapi ya, sebetulnya kalau ada yang khusus internal di web app tadi,
38:06ya bikin UI di web app-nya sendiri juga bisa.
38:10Nah, terus itu tadi ada package juga.
38:14Jadi buat kayak logic-logic yang pure JavaScript function,
38:17utility, itu bisa kepisah juga.
38:20Terus ada yang mirip sama yang dibahas event tadi
38:24buat interaksi sama database.
38:26Kayak ada satu package-nya sendiri.
38:28Itu kalau yang di starter template ini pakai Prisma.
38:32-Pakai apa? -Prisma.
38:36Prisma atau database ORM.
38:40Jadi ini nggak spesifik ke Next.js ya?
38:43Kenapa disebutnya Next.js Monorepo?
38:45Ya, karena awalnya itu buat contoh pakai web Next.js.
38:51Tapi kan buat perintilannya kayak bisa interaksi ke database-nya,
38:55ORM database layer-nya sendiri,
38:58UI-nya sendiri, UI pakai Storybook, ada Tailwind-nya,
39:01terus Pure Function Utility sendiri.
39:04Nah, cuma kan udah.
39:06Nah, tunggu, kalau nggak salah gue ada yang propose.
39:08Ya udah, gimana kalau tambahin satu contoh
39:12buat bikin beat app biasa?
39:16Nah, terus cuma ini yang bikin impressed,
39:19itu kayak penjelasan ini sama contoh-contohnya tuh jelas banget.
39:23Detail buat seneng deh kalau lihat contoh kayak gini.
39:26Jadi apa ya? Jadi lebih gampang ngerti.
39:28Kalau misalnya tadi kan kayak baca artikel,
39:30"Oke, kita paham konsepnya, cuma maksudnya bentuknya kayak gimana?"
39:34Apa? Ini sih.
39:36Lihat contoh ini jadi, "Oh, ya, ngerti."
39:39Nah, itu juga ada internationalization-nya tuh,
39:42jadi kayak buat apa? Language Key-nya,
39:44misalnya kita pakai multiple language,
39:47bisa apa?
39:50Oh, nggak deh, itu di web app-nya, di Next.js-nya.
39:53Ini ada packet common.
39:55Oh, ada common-nya.
39:57Itu kayaknya cuma JSON, ya JSON keys.
40:02Tapi kan usual-lah.
40:05Itu sampe ada contoh-contoh yang udah di-deploy-nya.
40:09Terus, readme-nya juga, apa sih, readme-nya lengkap.
40:16Jadi kalau kita nge-port, tinggal find and replace semua.
40:21Kayak your app nama-nama gitu.
40:24Oh, iya, jadi gampang di duplikasi, ya.
40:28Find, replace.
40:31Contohnya juga, apanya semua ada contohnya.
40:36Ini, eh, bukan. New York App.
40:39Minus, oh, nggak ada.
40:41New York Dash, nggak tahu.
40:44New York Dash apa?
40:47Ini, bukan. My App.
40:49Oh, My Dash App.
40:51My Dash App.
40:53Ini, tinggal diganti aja ya semuanya?
40:56Iya.
40:58Oke.
41:01Kalau ini, contoh, ini pakai yardmode spaces.
41:04Terus ada kayak itu, nah, ini common-common-nya.
41:08Kayak test, build, clean.
41:11Clean, ya, oke.
41:15Oh, menarik ya.
41:20Oke, ini contoh yang menarik juga.
41:23Tentang per-package, testing-nya bisa per-package.
41:29Iya, per-project ya, per-package ya benar-benar.
41:34Per-project, per-package.
41:37Ya, unit testing-nya per-package.
41:39Kalau end-to-end kan sebetulnya ya web app-nya aja kan.
41:42Kalau yang lain-lainnya nggak perlu.
41:45Ya, itu namanya ada unit testing, habis itu ada integration testing.
41:49Atau ada end-to-end testing. Jadi bisa unit test-nya bisa per-package.
41:55Iya, tadi kita ngomongin tentang tools-nya kan ya.
42:00Tools-nya tadi ada Bazel.
42:02Terus ada Lerna. Lerna berarti udah di...
42:05Lerna itu cloporn-nya, tapi menarik sih buka aja coba.
42:09Lerna.js.
42:11Masih hidup nggak sih Lerna?
42:13Masih ada, tapi itu makanya buka website-nya.
42:17Itu cloporn-nya ya, ternyata itu cloporn tooling.
42:21Iya, juga GitHub-nya.
42:23Masih ada.
42:25Masih, masih, cuma konteksnya buka website-nya.
42:28Tadi itu Pernadon.js.
42:30Nah, itu kan original tool for JavaScript Monorepo.
42:34Nah, itu yang di atas ada link to new, NRWL.
42:38NRWL itu produknya NX.
42:41Narwhal, NX.
42:43Jadi ini si maintainernya, dia stepping down.
42:47Terima kasih, dia mengundurkan diri.
42:51Karena burn out standarnya.
42:54Nah, lanjutannya adalah itu.
42:57The company behind NX ya.
43:01A tool already recommended for too many folks looking for a Lerna replacement.
43:08Jadi kayak semacam diurus sama si Narwhal ya.
43:13Diurus? Diurus ya, berarti bukan dimatiin ya?
43:17Ya, mungkin nggak di-develop lebih lanjut, tapi di-maintain lah.
43:22Tapi bakasnya di-maintain, kodenya di-maintain.
43:26Baksanya di-maintain, kodenya dihilangin, fiturnya dihilangin.
43:31Jadi sudah diakuisisi oleh CNX ini ya, nggak tahu nih Lernanya mau diapain, mungkin dalam maintenance mode ya.
43:41Bukan akuisisi, tapi kayak diurusin lah.
43:44Diurusin, dibantuin lah ya.
43:46Karena maintainer aslinya burn out.
43:49Stepping down, mengundurkan diri.
43:52Kenapa ya burn out?
43:54Kita nggak sanggup, Pak.
43:56Dunia open source itu berat.
44:00Biar Dilan aja yang itu open source.
44:04Sudah, nggak enaknya open source itu sudah kita volunteer, habis itu dikejar-kejar.
44:12Memakai-makai orang.
44:14Memakai-makai orang, yang dapat duit orang lain.
44:17Oke, kalau kita mau mulai gimana?
44:22Misalkan saya punya project baru, saya mau pakai Monorepo.
44:27Mulainya dari mana?
44:29Pakai apa yang paling gampang?
44:31Itu siapa yang paling gampang?
44:33Turborepo.
44:35Turborepo, oke.
44:37Yang gue pernah pakai cuma satu sih, jadi nggak bisa bilang paling gampang.
44:41Yang sama Yarnwork Spaces tadi.
44:44Yang pernah dipakai, jadi kan yang familiar, jadi kan bisa ngajarin gitu ya.
44:50Turborepo kan bagian dari Turborepo.
44:56Ya kayak helper buat Monorepo, khususnya yang aplikasi berbasis JavaScript sih.
45:04Ya ekosistemnya Vercel lah.
45:06Jadi kalau buat yang penggunanya Next.js, yang udah familiar.
45:11Turbopec ini masih belum bisa replacement webpec ya?
45:19Untuk project lain.
45:21Belum.
45:23Belum, non-next.
45:26Selain Next.js ya.
45:28Belum bisa kayaknya.
45:30Turborepo, The Monorepo Problem.
45:34Ini juga ada ya, kita bisa baca dari sini ya.
45:36Tapi ini kan kurang objektif.
45:41Kurang objektif, bukan kurang subjektif.
45:45Vercel Universe ya.
45:47Jadi sama kayak tadi kan sebenarnya kan.
45:50Packages, terus ada apps, ada misalkan docsnya mau pakai spelt disini, contohkan boleh-boleh aja.
45:57Terus apa lagi?
45:59Solusinya adalah, ini kan beda repo nih.
46:02Nah, kalau Monorepo dia jadi satu.
46:06Semuanya yang tiga-tiga ini.
46:09Tinggal jalankan turbo run, lean, build, test.
46:13Ya salah satu kali ya, turbo run, lean.
46:16Dia ngelinting semuanya.
46:19Tiga proyek ini sekaligus gitu ya.
46:22Enggak satu-satu.
46:24Banyak banget tuh, run, lean, build, test.
46:27Bisa di, ini ya.
46:31Bisa di apa?
46:33Di chaining.
46:35Chaining, di chaining.
46:37Mungkin, gak tau juga.
46:39Lean, build, test.
46:41Jadi kayak CI.
46:43Kalau CI kan jawabnya satu-satu tuh.
46:46Keren ya.
46:48Installing turbo.
46:51Terus, ada generator nya, turbo generate.
46:56Masih pake RAS gak sih, mereka buildnya ini.
47:00Ini ada, ada GitHub repo nya gak?
47:03Oh masih-masih RAS-RAS, tadi tulisannya di atas.
47:07Ada kok tadi tulisannya build with RAS.
47:11Mana? Nih, RAS.
47:13Iya.
47:16Paling atas, di ininya dia.
47:19Tuh, written in RAS.
47:21Makeshift happen.
47:23Oh ini, ini jadi itu ya, jadi, apa namanya?
47:28Jadi Unix selling point ya.
47:31Iya.
47:32Everything in RAS.
47:34Kan kan cepat, kan apa identiknya cepat?
47:36500 kali lipat atau 1000 kali lipat atau?
47:38500 kali lipat.
47:40Hanya terjadi di perusahaan Indonesia.
47:43Nggak ada mereka berapa kali lipat.
47:45Coba aja lihat nih, turbo pack, berapa kali lipat dibandingkan webpack.
47:48Nggak ada dia banding-bandingin.
47:50Ada tuh.
47:51Ada sih, ada ya, ada yang bandingin ya.
47:53Tapi nggak sampai 500 kali lipat juga.
47:55Ada.
47:57Itu benchmark tuh benchmark, benchmark di kiri bawah.
48:00Nah.
48:02Mana?
48:04Oh sudah nggak ada.
48:06Di benchmark.
48:08Dulu kan ada.
48:10Belum stabil berarti.
48:13Ada, bandingin antara Shell sama Vivo misalnya.
48:19Bukan dengan Pertamax ya.
48:26Kasian.
48:31Kasian. Kita baru minggu lalu ya waktu ketemu ngobrolin Shell ya.
48:35Terus tiba-tiba muncul beritanya seminggu kemudian.
48:41Kacau, kacau.
48:43Oke, Turbo Repo. Caranya pertama install dulu kan.
48:47Ini bisa langsung generate ya?
48:49Ini langsung generate ya?
48:51Iya kan NPX.
48:53Iya, NPX.
48:55Ini kayak create rate app-nya nih.
48:58Iya kayak from template.
49:00Create from official starter template.
49:06Itu penyelesaannya, starter repository will have blah-blah-blah.
49:112 deployable applications, 3 shared libraries for use in the rest of the monorepo.
49:19Wow, langsung bikin monorepo, dan arkitekturnya tuh.
49:23Ya, ya, that's the point.
49:25Pertanyaannya apakah ini akan menjadi vendor login?
49:30Kalau kita pakai ini, tapi kita nggak mau pakai NXJS.
49:34Kalau nggak mau deploy Covarsel, bisa nggak?
49:37Coba aja.
49:38Iya, nggak apa-apa. Tapi ini didesain untuk JavaScript Ecosystem.
49:44Apa yang kemarin itu? Tutorial kit ya?
49:47Yang buat ngetes kayak ada VM sendiri buat ngetes ini.
49:55Stack Blitz.
49:57Banyak sih sekarang.
50:02Tutorial kit ya, tutorial kit?
50:04Iya, tutorial kit.
50:06Install, oh ini kalau mau install sendiri.
50:10Nah, kayak UI Library ini, kalau cuma React UI Library biasa,
50:16mau publish ya publish aja kan, nggak Covarsel pun, bebas.
50:20Tapi kalau misalnya app-nya NXJS, ya apa?
50:25Masalah standar web app NXJS apapun, yang kalau kayak pakai fitur SSR-nya kan,
50:31nggak bisa langsung di deploy ke postingan lain,
50:37atau apa sih yang image, image library-nya nggak jalan.
50:42Masalahnya sama standar.
50:45Ini example-nya ada spelt, tapi yang NXJS-nya nggak ada ya?
50:49Apa by default udah NXJS ya?
50:51Ada, defaultnya ada NXJS ya.
50:54Ini spelt doang adanya sih?
50:56Nggak, ada NXJS.
50:58Banyak banget, itu puluhan.
51:03Kayaknya yang default dari TurboRepo itu ada NXJS.
51:10Oh defaultnya udah next.
51:13Minimum requirement specifying, sama ya, pakai all spaces juga.
51:23Terus sama yang kayak tadi ya, contoh repo tadi, ada apps dan repackages.
51:29Packages ini adalah shared code atau business logic ya,
51:35atau package yang dipakai bersama.
51:38Library-library yang dipakai bersama.
51:41Kalau apps itu berarti aplikasinya.
51:43Apakah misalkan landing page, ada back office, ada front office, ada apa lagi itu, banyak ya.
51:49Ada dokumentasi. Yang mengkonsum package.
51:53Ya, yang menggunakan si packages.
51:57Jadi kalau pattern yang umum, masing-masing package,
52:02di dalam package itu bisa saling bergantung.
52:05Maksud saya packages kan misalnya ada TS utility, ada business logic,
52:11itu bisa saling bergantung.
52:15Cuma kalau apps, nggak boleh saling, nggak boleh punya dependensi dari project lain di apps juga.
52:22Cuma bisa bergantung pada packages.
52:40Bentar, kalau gitu packagesnya cuma satu yang di-root level doang ya, berarti ya?
52:45- Nggak, masing-masing. - Di dalam packages ada ya?
52:48Di dalam packages ada, iya iya benar benar.
52:50Terus itu buat identifinya kan, namenya.
52:54Iya, iya iya.
52:57Untuk menjalankan app-nya, baru yang pakai di packages yang di-root level ya?
53:04Kalau di app-nya sendiri nggak ada kan?
53:08Ada lah, ada semua.
53:11- Ada juga ya? - Semua punya packages yang bukan.
53:15- Masing-masing punya sendiri ya? - Iya.
53:17Jadi itu sebetulnya, ini kayak package Next.js biasa, kayak web app.
53:26Hampir seperti web app Next.js biasa pada umumnya yang bukan monorepo.
53:32Cuma bedanya dia bisa dengan gampang pakai dependensi dari packages ini.
53:38Iya, oh ini kayak git repo sendiri sebenarnya kan?
53:43Cuman ini sekarang jadi satu, kira-kira gitu ya?
53:46Ini packages juga sama, misalkan ada kita pakai UI library di sini.
53:52Ada package JSON, ada storybook dependensi, atas macamnya.
53:59Dibuild nanti jadi sebuah distributable sendiri.
54:06Mau jadi NPM packages sendiri, mau jadi installable sendiri, ya terserah sih.
54:13Dan itu bisa diikutin masing-masing project-nya.
54:17Jadi kalau misalkan Next.js app, kita build, kalau emang perlu build kan di disk-nya,
54:23HTML, JavaScript, jadi static HTML asset kan.
54:28Nah sedangkan kalau misalnya UI library, JavaScript, React lah.
54:32React UI library, kita misalnya masih harus yang banyak formatnya tuh,
54:36yang harus jadi command.js lah, harus jadi ngjs.
54:41Nah itu kan terus harus generate type script definition lah.
54:45Itu kan ada setting-nya sendiri, jadi masing-masing project bisa punya build setting
54:51sesuai nature-nya, sesuai jenis project-nya.
54:55Dan dia ini pakai TurboRepo ternyata ya.
54:59Iya, ini kan ekosistem fair-sell banget lah ini.
55:04Iya, iya, iya.
55:06Menarik, menarik. Nah ini mas Ricky ada opinion ini.
55:14Sebelumnya sempat kepikiran pakai TurboRepo, cuman pas nyoba workspace-nya lebih simpel,
55:18karena cuman mau share dependency.
55:20Ya, kalau mau yang simpel ya pakai workspace-nya saja.
55:24Udah aja semua ya. Sekarang IARN workspace-nya ada.
55:28Dulu banget pertama kali kan cuma di IARN ya, IARN workspace-nya.
55:32NPM belum ada, sekarang udah ada semua.
55:35Semua udah ada. Termasuk Deno, Bun, dan lain-lain juga udah ngikut juga ya.
55:39Ini saya punya artikel sebenarnya ya, artikel yang berhubungan dengan Monorepo juga.
55:48Cuman dia ada kasih contoh, dan contohnya bagus.
55:51Contohnya itu kita bikin dari bener-bener enggak pakai TurboRepo dan lain-lain.
55:58Ini kan dia bilang the most popular, blablabla, Lerna, NX sama TurboRepo.
56:02Tapi kita bisa set up sendiri.
56:05Nah, tujuannya supaya dia ngerti, supaya dia mengerti behind the scene-nya,
56:11cara kerjaannya, ini dia pakai manual.
56:14Jadi kita bikin directory structure-nya dulu, ada packages, ada SRC.
56:19Terus abis itu, ini kita bikin folder-nya terus di-init.
56:27Terus dibikin packages-nya ditambahin workspaces.
56:33Jadi nanti ketika kita tulis atau kita bikin tambahin package di sini, secara otomatis,
56:41dia akan masuk kesini, dia akan nge-simling ya, atau linking kesini.
56:49Apa kepanjangan simling?
56:53Ya, kepanjangan simling apa?
56:58Simling-nya ya?
57:01Simbolik.
57:03Apa?
57:05Simbolik.
57:07Simbolik, iya simbolik.
57:10Ada satu lagi yang mirip kan, tapi heartlink atau apa ya?
57:14Heartlink.
57:16Simling, heartlink, ya itulah.
57:19Ya itu.
57:21Terus dia contohin juga disini kalau dependensinya,
57:24kalau semuanya pakai TypeScript, ya diinstall-nya di root level.
57:28Termasuk juga TSNode kalau semuanya pakai TSNode.
57:32Terus pakai Yeslin, Prettier juga semuanya kan, jadi seragam, biar seragam.
57:38Ini sekarang lagi cerita di global.
57:41Bukan di global, di root level.
57:44Di root level kan.
57:46Bukan global, install global bukan ya?
57:49Terus, ya kan tujuannya supaya seragam kan.
57:53Oh Yeslin rule-nya daripada satu-satu, ya udah satu project aja semuanya sama gitu kan.
57:59Biar nggak capek.
58:01Tapi bisa di-extend, tapi mengkonsumsi kan.
58:05Oh iya betul, bisa di-extend.
58:07Terus misalkan ada utility.
58:10Kita bikin init lagi, tapi scope-nya adalah monorepo.
58:13Monorepo ini adalah nama project-nya.
58:16workspace-nya di packages/utils.
58:20Jadi di init juga.
58:23Nah, dia punya packages-nya sendiri.
58:28Terus ada tsconfig dan lain-lain lain.
58:31Misalkan UI kita butuh react lah, atau UI library lain.
58:36Terus kalau misalkan dibuild, dia akan masuk ke node modules yang di root level.
58:41Terus kalau mau global tsconfig juga boleh.
58:44Sendri-sendri juga boleh.
58:46Apalagi yang menarik ya.
58:48Misalkan kita mau add package terparti.
58:53Ada nggak contohnya?
58:54Nah ini external package.
58:56Misalkan moment, moment.js.
58:58Itu kita bisa install satu dipakai buat ke semua.
59:02Ada yang tahu loh, simbolik link.
59:06Nantap.
59:07Palu gada developer.
59:08Ini cocok buat monorepo.
59:12Palu gada.
59:15Iya, pakai Google ya.
59:18Palu gada.
59:20Kita install moment.js hanya di package UI ya, berarti ya?
59:24Kalau gini ya?
59:25Kenapa sih pakai moment?
59:27Contoh.
59:29Dari antar dukungan ini.
59:33Biar gede itu.
59:35Dfns aja cukup kok.
59:37Dfns ya.
59:38Pakai temporal aja temporal.
59:40Pakai web API aja.
59:46Beda konteks ya kita ngomongnya ya.
59:48Beda konteks.
59:51Udah, jadi ini salah satu contoh yang
59:55mungkin kalau temen-temen mau bikin dari scratch nggak pakai Turborepo, NS, dll.
59:59Bisa belajarnya di sini.
1:00:01Karena cukup pakai...
1:00:02Sama biar tahu juga, biar nggak magic kan.
1:00:04Maksudnya biar nggak...
1:00:06Habis kita bikin ini, kita jadi tahu Turborepo itu ngapain.
1:00:09Jadi kayak bukan sulap, bukan sihir ya sebenarnya.
1:00:12Bukan sulap, bukan sihir.
1:00:13Langkah-langkahnya.
1:00:16Langkah-langkahnya.
1:00:18Dan dengan itu aja udah solving masalahnya ya udah.
1:00:21Nggak usah pakai Turborepo, nggak usah pakai yang lain.
1:00:23Cukup, box spaces aja.
1:00:25Seperti yang Mas Ricky mencoba juga.
1:00:28Kalau cuma muser dependensi ya cukup kan.
1:00:31Oh ya kalau Turborepo itu kelebihannya kayak proyek versi lainnya.
1:00:42Dokumentasinya bagus sih.
1:00:45Mantap ya.
1:00:47Mengapun.
1:00:48Ya karena emang mereka hire orang buat itu kan.
1:00:52Jadi dibayar untuk supaya proyeknya laku.
1:00:56Dijual dengan cara ini kan.
1:00:58Developer experience-nya harus bagus.
1:01:00Supaya vendor locking.
1:01:02Supaya orang mau...
1:01:05Karena itu ya bisnis ya.
1:01:08Ya wajar lah, bener.
1:01:10Nggak salah, nggak salah.
1:01:14Bukan sesuatu yang salah.
1:01:16Dan Turborepo-nya sendiri kan fully open source.
1:01:19Maksudnya biar kita terpikat masuk ke ekosistem mereka.
1:01:22Pakai Next.js, deploy, cover, sell.
1:01:24Terus banyak pake cloud function dan fitur-fitur semacamnya.
1:01:29Akhirnya jadi bayar cloud jasa-jasa posting sama cloud-nya kan.
1:01:37Ini cara menjebak yang elegan.
1:01:44Tapi sebetulnya kalau proyeknya nggak terlalu besar, ya nggak bakal...
1:01:48Masih gratis kan?
1:01:50Ya Turborepo-nya kan ini tooling yang tinggal diinstall aja.
1:01:55Next.js-nya maksudnya.
1:01:57Betul.
1:01:59Fender lock-in kita bang.
1:02:01Handphone-nya apa ayo?
1:02:03Pengennya Apple, tapi nggak mampu.
1:02:08Android kan?
1:02:10Itu vendor lock-in juga.
1:02:12Ya iya.
1:02:14Tapi kan bisa mengurang-urangi.
1:02:16Kalau hape, opsinya kan cuma dua.
1:02:19Iya, ke Apple juga vendor lock-in.
1:02:21Memang ada yang netral, handphone.
1:02:23Lebih vendor lock-in lagi sih.
1:02:25Ada dulu.
1:02:26Nokia.
1:02:27Nokia bikin.
1:02:29Tapi gagal.
1:02:31Firefox bikin.
1:02:33Gak ada duitnya.
1:02:35Gak ada duitnya.
1:02:37Iya kan vendor lock-in itu kan buat cari duit.
1:02:39Bisnis.
1:02:43Masalahnya vendor lock-in yang kita senang terjebak di situ,
1:02:46atau yang kita sedih terjebak di situ?
1:02:48Tinggal pilihannya itu aja.
1:02:50Sama kita sadar atau nggak jebakannya itu dimana.
1:02:54Maksudnya kita kalau emang dengan, kita konsen nih kita bersedia,
1:02:58ya udahlah bayar.
1:03:00Ya kan nggak apa-apa.
1:03:02Terus kalau ternyata kita nggak cocok atau apa,
1:03:06kita anggap nggak worth it,
1:03:08ya kita harus tahu jebakannya dimana biar kita muter kan.
1:03:11Terus kalau dari sisi CDN, Cloudflare.
1:03:17Cloudflare juga ya.
1:03:19Kita vendor lock-in loh.
1:03:21Memang gratis.
1:03:23Karena bayar to entry-nya sudah mulai masuk.
1:03:25Masuk bayar, buah halnya minta ampun.
1:03:28Iya, tapi vendor lock-in,
1:03:31bayar to entry-nya Cloudflare itu gampang sekali.
1:03:34Tipis.
1:03:36Kita tinggal register, terus masukin DNS, setup DNS dan lain-lain, udah.
1:03:44Dibandingkan coba kalau pakai service cloud.
1:03:48Panjang jalannya.
1:03:50Tapi ya itu kan, balik lagi, vendor lock-in.
1:03:55Kalau untuk sekedar hanya blok personal pribadi yang trafficnya biasa-biasa,
1:04:01nggak perlu pusing.
1:04:03Gak perlu pusing. - Tapi begitu sudah mulai bayar, sakit.
1:04:08Ya sama kan, Versal juga gitu kan.
1:04:11Versal juga gitu kan, kalau hobis atau bahkan aplikasi yang sekaligus.
1:04:15Ya, aman.
1:04:17Over the tear, cukup.
1:04:19Cukup.
1:04:21Cuman kan dia menjebakan.
1:04:23Kalau misalkan ternyata aplikasi ini berkembang, diakses banyak orang,
1:04:27nah baru kena asli.
1:04:29Itu kan fair kan, ya maksud saya, at least dalam dunia kapitalis,
1:04:34ya itu fair kan, kalau misalnya aplikasinya besar,
1:04:37kan makan banyak resursi dan kemungkinan, itu project yang udah ada duitnya kan,
1:04:42maksud saya yang udah komersil, atau emang udah populer banget, bisa diguitin.
1:04:47Masih ada yang penganur anti-kapitalis.
1:04:49Torrent world, misalnya. - Ya bikin sendiri.
1:04:51Anti-kapitalis berarti, dia itu ya, nulis,
1:04:57apa kalau nge-tick-tick keyboard itu nggak pakai urus besar ya?
1:04:59Lowercase ya?
1:05:01Saya nggak punya soundboard, Mas.
1:05:05Menjipin soundboard sendiri.
1:05:10Versal ada loongan DX engineer, iya kayaknya ada.
1:05:15Jadi sampai DX nya dioptimalkan ya?
1:05:19Betul.
1:05:21DX engineer tuh ngapain coba?
1:05:24Ya ini, dokumentasi termasuk kan.
1:05:28Developer experience, ya cara installnya,
1:05:34desain CLI, desain CLI-nya itu harus detail gitu,
1:05:40sesuai, bukan sesuai.
1:05:42Oh berarti dia kayak ngetes ya, kalau misalnya step-stepnya yang gampang dipahami gimana,
1:05:46terus yang enak, yang kemungkinan banyak developer senang tuh,
1:05:50stepnya gimana, kata-katanya apa.
1:05:53Bisa jadi kita juga topik selanjutnya untuk desain CLI.
1:05:57Desain CLI, iya menarik ya.
1:06:00CLI nggak pernah kan dibahas sama sekali kita ya.
1:06:04Karena interface-nya bukan web.
1:06:07Ya tapi buat web.
1:06:10Tamina bisa jalan di web, ngeles mode on.
1:06:17Enggak, kalau mau developer harus pake terminal kan.
1:06:23Kalau mau jalanin localhost 8 ribu, 3 ribu kan harus pake terminal.
1:06:28Kecuali pake stack bits.
1:06:32Kecuali pake CSS, itu ya.
1:06:36Gedein SAP-nya, sebelum susunnya diperah.
1:06:40Enggak, ada satu lagi konsepnya agak absurd ya.
1:06:43SAP itu kan ada sendiri kan?
1:06:46SAP? Apa lagi itu?
1:06:48S-A-P-I.
1:06:51Bentar, ada ini.
1:06:54Ada aplikasi.
1:06:57S-A-P-I apa ya?
1:07:01Ada korba, korba itu kan kayak korba jadi cobra gitu kan.
1:07:08Ini SAP-I.
1:07:10S-A-P-I itu adalah Server Application Programming Interface, SAP.
1:07:17Server Application Programming Interface.
1:07:23Iya makanya saya...
1:07:24SAP.
1:07:26Iya, PSP, S-A-P-I, S-A-P-I.
1:07:30S-A-P-I.
1:07:32Ada, makanya SAP.
1:07:35Loh, saya langsung pikirannya...
1:07:38S-A-P-I.
1:07:40Oh, S-A-P-I.
1:07:45Direct Module Interface to Web Server.
1:07:48Oh, modul PHP itu namanya SAPI.
1:07:53Iya, betul.
1:07:55Betul, tongket itu SAPI.
1:07:59Dari dulu pake tapi nggak tahu istilahnya.
1:08:03SAPI.
1:08:06Besok kalau bikin tiket tolong buatkan SAPI.
1:08:13Tolong buatkan SAPI.
1:08:19Kacau, kacau.
1:08:21Oke.
1:08:22Udah ada aja ngerti tuh PHP SAPI.
1:08:24Ngerti ya.
1:08:28Oke, yang berkaitan dengan Monorepo ada lagi yang mau dibahas?
1:08:35Udah, itu aja.
1:08:37Kayaknya menurut saya penuntutnya saat ini masih trendingnya itu dan akan kayaknya future-nya masih pake Monorepo sih.
1:08:47Saya nggak terlalu banyak pembahas sebuah future-nya application ini saya ganti lagi ke microservices beda Repo kan.
1:08:59Beda Repo.
1:09:00Oh, beda penuntut kan tadi maksudnya apa? Beda audience, beda target.
1:09:05Gimana kalau misalkan kita baru bikin project, kita ya kan kita estimasinya oh ini project-nya bakal kompleks nih, bakal berkembang nih.
1:09:14Apakah kita langsung Monorepo atau nggak usah dulu?
1:09:17Kita bisa sambil jalan.
1:09:18Lebih baik standard by default Monorepo dulu.
1:09:22Oh gitu.
1:09:23Karena udah gampang juga.
1:09:25Udah gampang juga ya, tinggal workspace-nya saja ya.
1:09:28Sekarang misalnya saat ini satu project saya yang salah satu saya maintain, beda Repo akhirnya ujung-ujungnya jadi submodule.
1:09:38Oh ya gitu submodule ya.
1:09:40Iya dan itu memaintainnya lebih susah.
1:09:44Lebih ribet lagi ya.
1:09:45Di sana sudah selesai di update, saya harus update lagi di main Repo, update submodulnya supaya pakai hash yang terakhir, di commit lagi.
1:09:55Aduh belum lagi, eh lambat lah.
1:09:59Jadi nggak mau, kalau kedepannya saya juga nggak mau lagi.
1:10:04Kalau memang mau project satu, bikin aja packages di dalamnya langsung Monorepo aja.
1:10:12Bisa kok, nggak ada.
1:10:15Gampang kok ya.
1:10:16Ya jadi composer packages juga bisa, nggak perlu pusing-pusing.
1:10:21Kalau untuk PHP base ya.
1:10:25Kalau JavaScript base ya itu tadi aja Turbo Repo, MPX Repo.
1:10:30PNPM aja kalau saya mah, langsung PNPM workspace.
1:10:33Iya PNPM.
1:10:35Karena PNPM package lock-nya flat kan, jadi lebih efisien.
1:10:42Lebih emas.
1:10:43Having hard disk space.
1:10:46Yes, okay kalau gitu pembahasan tentang Monorepo kita tutup, jadi sekarang kita diskusi untuk bahas topik minggu depan.
1:10:54Monorepo kita bisa close.
1:10:57Masukin ini ya, link YouTube-nya bisa dimasukin di sini.
1:11:05Link YouTube-nya bisa, bisa.
1:11:08Benar juga ya.
1:11:10Iya jadi kalau kita rajin dapetin atau nanti bisa project kita yang terhambat ngobrolin.webnya, ngobrol.in/webnya, nanti bisa diambil kayaknya link-linknya ini.
1:11:26Tuh, apa gambar apa, link atau iframe?
1:11:32Nantilah disini.
1:11:34Kamu saling dulu aja ya.
1:11:36Oke untuk bahasan berikut, apa episode berikutnya kira-kira apa?
1:11:43Gas.
1:11:44Gas.
1:11:45Apa?
1:11:46Gas.
1:11:47Oh iya bahas gas ya?
1:11:48Gak tau.
1:11:49Sama siapa?
1:11:50Belum dapet.
1:11:51Kita gak, eh ini lah tadi top all.
1:11:54Mana sih?
1:11:55Oh gas yang ini, yang baru.
1:11:57Google Ads Script.
1:11:58Google Ads Script.
1:11:59Google Ads Script.
1:12:00Google Ads Script.
1:12:01Google Ads Script.
1:12:02Apa sih?
1:12:03Gas.
1:12:04Iya.
1:12:05Google Ads Script.
1:12:06Google Ads Script.
1:12:07Google Ads Script.
1:12:08Oh.
1:12:09Gua pernah pake sih, cuma gak detail banget.
1:12:11Belum apa?
1:12:12Yang gak ditulis.
1:12:13Siapa ya?
1:12:14GDI Ads Script.
1:12:15GDI Spreadsheet.
1:12:16Iya, iya, iya.
1:12:17Nah yang kayak misalnya Spreadsheet atau apapun di produknya Google, ya buat satu sama lain.
1:12:23Jadi kayak kalau ada yang isi Google Form, otomatis ngeformat dan lain-lainnya ke Google Sheets.
1:12:31Iya, iya.
1:12:32Saya pernah, baru saja di Whatcom Asia, saya bikin Google Spreadsheet pake Apps Script ini
1:12:38untuk nge-fetch data di Spreadsheet.
1:12:41Terus ada salah satu ini, apa namanya?
1:12:49Kayak formnya istri saya gitu buat jauh-jauh para dokter.
1:12:55Terus kemudian dia bikin jadi kayak matrix jarang gitu, tau gak?
1:13:00Matrix jarang.
1:13:01Gak?
1:13:02Gak.
1:13:03Hah?
1:13:04Jadi kalau kayak nge-mapping misalnya, kalau dia jaga 1, kalau gak jaga 0, jadi 1, 0, 1, 0, 1, 0.
1:13:11Jadi kelihatan itu jumlah, jumlah berapa jaganya.
1:13:16Terus saya pake Apps Script ini untuk totalnya dan bisa pake color coded.
1:13:22Asik.
1:13:23Tapi nantilah.
1:13:25Kalau gue cuma pernah simple banget sih dari Google Forms.
1:13:29Ya pokoknya ada opsi jawaban yes sama no.
1:13:32Tapi ada detail-detailnya juga, ya cuma dibisah bikin Spreadsheet, tapi Tabsheet terpisah, yes sama no.
1:13:38Sama kayak tabel kolom-kolomnya jadi beda tergantung kalau yang jawab.
1:13:44Ini maksudnya CLI Design?
1:13:47Ya, CLI Design.
1:13:49Masukin di sini, saya pakainya dulu YARGS.
1:13:53YARGS, Y-A-R-G-S-D-G-S.
1:13:56Kenapa?
1:13:59Itu juga saya suka.
1:14:01YARGS.
1:14:06Untuk ini apa? Untuk tools desainnya?
1:14:11Ya buka aja ini tools desainnya, YARGS.org.
1:14:16Oh .ARG.
1:14:18Jadi kayak script untuk membantu untuk membuat CLI script.
1:14:23Jadi kalau gue dulu pakainya buat apa sih?
1:14:28Komponen generator. Apakah mau bikin apa ya?
1:14:31Kalau dia kan dulu ada misalnya functional component, smart component,
1:14:35atau DOM component, atau apa, RDS no.
1:14:38Bisa checklist kayak di centang gitu, single option, multiple option.
1:14:44Nanti terakhirnya ponenya dapat JavaScript Object berisi interaksi jawaban-jawaban dari interaksi CLI itu.
1:14:52Gini ya?
1:14:55Kalau kita lagi sesuai, kita satu aja ngomongin ini pusing ga?
1:15:00Oh AI.
1:15:03Ada yang mau bahas AI code assistant?
1:15:10Ya di IDE.
1:15:13Di code assistant di editor.
1:15:17Code assistant ya di IDE kan?
1:15:19Iya sih.
1:15:23Mungkin ada yang tertarik, silahkan kita lihat.
1:15:27Di code silahkan.
1:15:30Atau kalau ada yang punya IDE, bisa langsung di submit juga.
1:15:35Kalau misalkan belum ada, yang apa, eh sudah ada, ya tinggal di code aja.
1:15:42Eh Interop 2025 bikin itunya.
1:15:49Si Eka seneng banget tuh, transition masuk.
1:15:54Topik favorit.
1:15:56Si Eka seneng feed transition, si Mas Johan WebRTC.
1:16:00WebRTC, everybody happy.
1:16:11Udah?
1:16:13Tapi kita belum buat minggu depan apa.
1:16:17Mau yang mana, yang di vote apa?
1:16:21Kita vote di YouTube aja ya.
1:16:24Basic web security?
1:16:26Mau, tapi harus ada dana sumber.
1:16:31Ajar Mas Ipan aja kali ya.
1:16:33Mas Ipan aja, Mas Ipan atau Mas Riza aja coba hubungi nanti.
1:16:38Mas Riza.
1:16:40Oh, hubungi diri sendiri gitu.
1:16:43Hubungi diri sendiri.
1:16:48Oke, ya udah.
1:16:50Banyak, tinggal pilih ya.
1:16:52Banyak ya, ini udah 2 halaman nih.
1:16:55Sama yang ditutup juga ada kan?
1:17:01Enggak, ini yang sudah ini aja.
1:17:04Ini yang baru-baru aja, yang open.
1:17:07Oke, security ya?
1:17:11Gak tau, kita vote dulu ya.
1:17:14Temen-temen di sini pengen apa?
1:17:16Untuk minggu depan?
1:17:18Pengen topiknya apa?
1:17:20Boleh kita vote, mungkin ya.
1:17:23Topik minggu depan.
1:17:27Base security dari YouTube.
1:17:38Security, Interop, CLA, udah itu aja 3 itu.
1:17:42Interop, oke.
1:17:442025 sama CLA ya.
1:17:47C-L-E.
1:17:49Design and Development.
1:17:55Ayo, kita kasih waktu 2 menit.
1:18:011 menit.
1:18:032 menit.
1:18:05Mana tadi yang CLA?
1:18:07CLA-nya bukan cuma desain berarti kan?
1:18:09Sampai bikin kan?
1:18:11Iya, propanya.
1:18:13CLA, desain dan development.
1:18:17Mas, ada live coding.
1:18:19Best practice, terus kayak flag.
1:18:22Flag-flag-nya gimana?
1:18:25Kita kan sebentar lagi udah Ayo Extended nih.
1:18:27Kita harus mulai minggu depan, harus mulai mencari arah-arah.
1:18:32Practice itu gimana sih tulisannya?
1:18:34Best practice.
1:18:36Best practice.
1:18:38Practice gini ya?
1:18:40Masa sih?
1:18:41Ya betul.
1:18:43Terus apalagi tools.
1:18:48Itulah, nanti lanjutin lagi ya.
1:18:56Basic security 100%.
1:18:59Ayo, 1 menit lagi, 1 menit lagi.
1:19:03Sekalian nyari topik kita buat Ayo Extended.
1:19:08Ayo Extended.
1:19:10Memang udah keluar?
1:19:12Belum, tapi kan sudah mulai udah mendengar.
1:19:14Buat bukain test-nya keluar aja, biar bisa brainstorming-nya enak.
1:19:21Saya sih kemungkinan kalau topik web nggak ada yang menarik sih yang tadi.
1:19:28Bahas AI, tools, AI assistance.
1:19:32Kan si Gumi ini udah keluarin kan?
1:19:35Iya, kalau web nggak menarik.
1:19:38Kalau web nggak ada yang menarik.
1:19:41Tapi kalau web ada yang menarik, mau bahas web.
1:19:44Bahas, oh itu buat build with AI aja ya.
1:19:47Benar juga.
1:19:49Web kira-kira apa yang dibahas?
1:19:53Itu, transition, scroll-driven animation.
1:19:57Kalau UI sih kayaknya banyak.
1:20:00UI banyak, untung.
1:20:02Karena gue-gue UI.
1:20:04Senang.
1:20:09Sudah? Seberapa hasilnya?
1:20:11Hasilnya adalah basic security 100%.
1:20:14Oke, udah basic security.
1:20:17Mudah-mudahan Mas Irvan-nya mau dan bisa.
1:20:21Atau narasumber yang lain kita coba ya.
1:20:23Doakan saja, semoga bisa.
1:20:26Jadi, untuk malam ini, kita tutup dulu.
1:20:31Terima kasih banyak buat semuanya yang sudah hadir.
1:20:33Sudah meramaikan, komen-komen.
1:20:35Belajar bareng tentang Monorepo.
1:20:39Kita ketemu lagi minggu depan.
1:20:43Sampai jumpa.
1:20:47Jam 9 ya.
1:20:49Jangan lupa ya jam 9.
1:20:51Karena selama Ramadhan kita mundurin.
1:20:53Setelah terawih.
1:20:55Oke, sampai jumpa.
1:20:57Selamat malam, bye-bye.
1:21:05[Sampai jumpa di video selanjutnya]
Suka episode ini?
Langganan untuk update episode terbaru setiap Selasa malam!
Episode Terkait
16 Apr 2025
Ngobrolin CORS & Browser Policy - Ngobrolin WEB
Yuk mari kita diskusi dan ngobrol ngalor-ngidul tentang dunia web. Agar tetap up-to-date dengan teknologi web terkini. ...
11 Jun 2025
Bedah Situs - Ngobrolin WEB
🗣️🕸️ Selasa malam waktunya #NgobrolinWEB! Malam ini kita membedah situs yang disubmit oleh salah satu penonton kita. M...
25 Nov 2025
WebAI - Ngobrolin WEB
🗣️🕸️ Selasa malam waktunya #ngobrolinWEB! Malam ini membahas AI yang dapat dijalankan di web browser atau istilah kere...