Transcript
00:00:00Ini adalah Xero Native, pembangun aplikasi native berbasis Zig oleh Vercel yang bisa menggunakan tampilan web sistem
00:00:05atau menyertakan seluruh Chromium seperti Electron untuk aplikasi desktop atau seluler yang menyediakan biner super kecil
00:00:12dan pembangunan ulang instan untuk pengembangan.
00:00:14Tapi apakah fakta bahwa Anda harus tahu sedikit Zig untuk menggunakannya dengan benar akan membuat pengembang JavaScript enggan?
00:00:18Tekan tombol subscribe dan mari kita cari tahu.
00:00:20Meskipun tim BUN beralih dari Zig ke Rust, ini tetap merupakan bahasa yang sangat keren
00:00:28tanpa borough checker, tanpa lifetimes, dan dapat memanggil C secara langsung, artinya pustaka C apa pun hanya perlu satu impor saja
00:00:35tanpa memerlukan kode tambahan (glue code).
00:00:37Dan ini cukup mudah dibaca untuk dipelajari oleh pengembang JavaScript.
00:00:39Bahkan, jika Anda ingin melihat saya belajar memprogram di Zig dari awal, beri tahu saya di kolom komentar.
00:00:44Saya pikir itu akan menjadi hal yang cukup menyenangkan untuk dilakukan.
00:00:46Namun intinya, Xero Native adalah shell Zig tipis yang meng-host tampilan web yang merender front end
00:00:51yang menggunakan jembatan JSON sehingga JavaScript di tampilan web dapat berkomunikasi dengan lapisan Zig native dan sebaliknya,
00:00:58itulah cara aplikasi ini mampu mencapai API tingkat OS.
00:01:01Dan jika Anda berpikir ini terdengar seperti ElectroBUN, ya, memang mirip.
00:01:04Tetapi dengan satu perbedaan besar, yang akan kita bicarakan nanti di video ini.
00:01:07Namun untuk saat ini, mari kita lihat demo yang sangat sederhana.
00:01:10Jadi untuk memulai, Anda harus menginstal Zig terlebih dahulu, yang sudah saya lakukan dengan Miez.
00:01:13Tetapi Anda juga bisa menggunakan Brew, lalu instal Xero Native.
00:01:16Dan setelah Anda melakukan keduanya, Anda dapat menjalankan perintah Xero Native init untuk membuat proyek baru.
00:01:22Ini adalah nama proyek saya, tetapi bisa apa saja yang Anda inginkan.
00:01:25Saya akan menggunakan flag front end dengan React, yang akan menginstal proyek Vite React.
00:01:30Tetapi bisa juga Svelte, Vue, Nex atau bahkan hanya Vite.
00:01:34Jadi jika saya menekan enter, Xero Native akan menambahkan beberapa direktori.
00:01:37Jika kita masuk ke proyek demo, kita bisa melihat file notasi objek app Zig, yang akan saya jelaskan nanti.
00:01:43Kita punya aset untuk hal-hal seperti ikon dan aset statis lainnya, file build Zig,
00:01:48yang untuk grafik build Zig, jembatan JS dan mesin web serta direktori front end, yang berisi kode front end kita.
00:01:54Bahkan, jika kita masuk ke sana, kita bisa melihat isinya adalah file yang biasa dilihat oleh pengembang JavaScript.
00:01:58Sekarang, pada titik ini, jika kita menjalankan zig build run, ini akan menginstal semua dependensi dan membuka aplikasi kita di jendela baru.
00:02:04Catatan, jika Anda ingin menginstal Xero Native pada proyek JavaScript yang sudah ada,
00:02:08saya sarankan menggunakan Vite, yang merupakan versi minimal, lalu mengubah semua yang ada di direktori front end ini agar berisi kode untuk aplikasi Anda.
00:02:15Xero Native juga memiliki server pengembangan yang sangat keren yang menangani seluruh siklus hidup front end.
00:02:19Jadi jika kita menjalankan zig build dev, ini akan mengompilasi biner dan menjalankan server pengembangan Xero Native.
00:02:24Jadi jika saya mengubah beberapa kode, kita bisa melihat aplikasi native kita diperbarui secara real time.
00:02:28Saya bahkan bisa menjalankan zig build package, yang akan membangun aplikasi native sehingga saya bisa mendistribusikannya.
00:02:33Dan kita bisa melihatnya di sini di dalam direktori paket zig out hanya sebesar 2,9 megabyte, yang sangat kecil.
00:02:39Dan beberapa orang bahkan berhasil membuatnya menjadi di bawah 1 megabyte.
00:02:43Tapi bagaimana jika saya ingin mengubah ikon aplikasi, nama, atau mesin webnya?
00:02:46Nah, di sinilah file app zon berperan, di mana saya bisa melakukan hal-hal seperti mengubah nama ikon, nama proyek, dan bahkan mesin yang menjalankan aplikasi, serta ukuran jendela.
00:02:55Dan itu adalah gambaran yang sangat, sangat cepat tentang Xero Native.
00:02:58Ada begitu banyak hal yang tidak sempat saya bahas, seperti ikon sistem tray, penandatanganan kode, dan aplikasi tersemat untuk iOS dan Android.
00:03:05Bahkan, saya perlu meluangkan lebih banyak waktu untuk itu, yang mungkin akan menghasilkan video lain.
00:03:09Tapi seberapa hebat pun Xero Native, bagaimana perbandingannya dengan sesuatu seperti Electrobun, yang juga membuat aplikasi kecil dan cepat yang menggunakan tampilan web native sistem?
00:03:17Nah, dengan Electrobun, bun itu sendiri adalah lingkungan eksekusi karena Anda harus menulis typescript untuk proses utamanya.
00:03:24Jadi meskipun biner zig memulai aplikasinya, kodenya berjalan di dalam bun web worker, yang berkomunikasi dengan API native melalui FFI bun, yang harus melewati lapisan C++ dan Objective-C.
00:03:37Tetapi dengan Xero Native, yang Anda butuhkan hanyalah biner zig, tanpa JavaScript, tanpa bun, hanya zig, yang berkomunikasi dengan API tingkat OS dan pustaka C apa pun melalui impor C yang sederhana.
00:03:50Ini menghasilkan kerangka native yang setipis mungkin dibandingkan dengan Electrobun.
00:03:54Tetapi saat ini Anda mungkin harus menulis sedikit zig untuk mendapatkan semua yang Anda inginkan dari Xero Native atau setidaknya mengubah beberapa konfigurasi dalam file zig object notation.
00:04:03Selain itu, Xero Native tidak sekaya fitur Electrobun, yang memungkinkan saya mengubah gaya judul bar dan bahkan menambahkan beberapa item menu kustom.
00:04:11Dan hal-hal itu, sayangnya, belum didukung saat ini di file app zon.
00:04:15Saya juga harus mengajukan laporan masalah karena membangun paket di MacOS tidak berjalan dengan baik untuk saya pertama kalinya, tapi itu mungkin masalah keterampilan saya.
00:04:22Meskipun demikian, saya yakin tim sedang bekerja keras untuk menambahkan lebih banyak fitur dan memperbaiki beberapa masalah ini, serta menambahkan dukungan seluler yang keren.
00:04:29Dan jika Anda tidak bisa menunggu fitur-fitur tersebut, yah, ini adalah sumber terbuka (open source).
00:04:32Jadi berikan saja kodenya ke Claude, beri tahu apa yang Anda inginkan dan saya yakin itu bisa menambahkan fitur-fitur tersebut untuk Anda, kan?
Community Posts
No posts yet. Be the first to write about this video!
Write about this video