Kenali pembicara sebelum bertemu mereka di konferensi

Tiket untuk tahun 2019 kini tersedia: https://www.eventbrite.co.uk/e/vuejs-amsterdam-2019-tickets-45193495963

Konferensi VueJS Amsterdam hampir tiba. Tiket sudah terjual habis! Pada wawancara kali ini kita akan berbicara dengan Ives van Hoorne. Dia adalah pencipta CodeSandbox yang pemberani. Editor online yang menawarkan dukungan kelas satu untuk Vue dan mencoba membuat hidup lebih mudah bagi pemula!

Catatan: pertanyaan dan jawaban belum ditranskrip tetapi diadaptasi dari catatan.

Hai Ives! Apa yang bisa Anda ceritakan tentang diri Anda kepada kami?

Halo semuanya! Saya adalah mahasiswa Ilmu Komputer di University of Twente dan pengembang paruh waktu di CataWiki, sebuah situs lelang. Saya adalah pencipta CodeSandbox, editor kode online untuk Aplikasi Web menggunakan React atau Vue.

Saat ini, aku jarang belajar karena perhatianku mudah teralihkan. Saya sering bermain bola voli. Saya suka membuat musik dan memainkan beberapa alat musik termasuk: seruling, keyboard elektronik, dan gitar.

Saya bekerja sebagai Pengembang Perangkat Lunak tetapi saya masih tinggal di asrama siswa. Saya sepenuhnya menerima kehidupan siswa jadi, sebagai contoh, setelah wawancara ini saya akan pergi minum koktail bersama semua siswa lainnya!

Kadang-kadang, saya berada di sebuah konferensi untuk memberikan ceramah di negara lain dan menyadari bahwa saya sedang berpesta pora malam sebelumnya dengan teman-teman saya. Ini adalah perubahan perspektif yang besar.

Kehidupan siswa sangat menyenangkan! Saya ingin berbicara lebih banyak tentang CodeSandbox. Bisakah Anda memberi tahu kami bagaimana hal itu dimulai?

Saya mulai mengerjakan CodeSandbox pada bulan November lalu dan dirilis pada bulan April. Saya membuatnya karena saya sangat frustrasi. Sebagai seorang siswa, saya harus mempelajari semua konsep dasar yang berbeda ini. Saya merasa perlu mengambil proyek yang lebih menantang. Saya telah membahas dasar-dasar pemrograman yang berfungsi untuk CataWiki. Saya mulai mengerjakan CodeSandbox sehingga saya dapat mempelajari konsep lebih lanjut sambil membangun sesuatu yang bermanfaat. Suatu saat saya kehilangan minat dan berhenti selama beberapa minggu tetapi setelah beberapa pertimbangan saya bertekad untuk mengerjakannya sampai selesai.

Di CodeSandbox kami mengikuti 3 prinsip:

  • Turunkan kurva pembelajaran
  • Perasaan editor lokal
  • Mudah untuk berbagi dan menemukan contoh dari orang lain

Dari rilis pertama, kami mendapat sekitar 8 pengunjung pada hari itu. Cukup menarik. Saya mencoba menyebarkannya di Reddit dan Twitter tetapi saya hampir tidak memiliki pengikut. Saya beruntung keesokan harinya, Kent C. Doddsmerilis glamor dan dia setuju untuk menggunakan CodeSandbox untuk mendemonstrasikan contoh-contoh glamor. Sejak saat itu kunjungan meroket. Itu sangat keren!

Sejak saat itu motivasi saya berlipat ganda dan saya menyadari bahwa saya dapat membuat perbedaan bagi orang-orang yang menggunakannya. Saya tidak berpikir itu akan menjadi begitu populer.

Cerita yang luar biasa! Mari kita bicara tentang konferensi tersebut. Apa yang sedang kamu persiapkan?

Untuk ceramah saya, saya akan menjelaskan perubahan apa yang harus kami lakukan pada CodeSandbox untuk mendukung Vue.

Kami mulai menerapkan dukungan Vue sekitar musim panas lalu. Pada awalnya, ini tidak semudah yang saya kira. Selama pembicaraan saya, saya akan membahas bagaimana kami memulai, apa yang harus kami ubah di CodeSandbox agar dapat berfungsi dan fitur spesifik Vue apa yang kami miliki saat ini.

Awalnya, CodeSandbox hanya bekerja dengan React tetapi kemudian kami menyertakan dukungan Vue. Kami ingin memiliki paket lengkap. Pilih proyek Vue dari GitHub, impor dan lanjutkan mengerjakannya dari browser. Setelah itu kami menerapkan dukungan Komponen File Tunggal.

Bundel awal kami sangat sederhana dan hanya mendukung transpilasi file JavaScript. Kami tidak memiliki sistem lain di belakangnya. Karena keterbatasan ini, saya harus menulis ulang seluruh bundler menggunakan pemuat Webpack untuk mendapatkan dukungan pemuat. Setelah itu saya menambahkan semua loader ini: SASS, LESS, Stylus dan TypeScript. Itu sebabnya penerapannya agak sulit.

Sejak bulan Agustus, kami mengintegrasikan Monaco. Ini adalah VS Code versi browser web yang dibuat oleh Tim Microsoft. Sungguh mengesankan apa yang telah mereka lakukan. Ini adalah yang tercanggih. Anda mendapatkan kecerdasan TypeScript, pengecekan tipe, dll. Bahkan mengimpor informasi semua modul! Jadi sejak itu, kami memiliki dukungan asli TypeScript.

Baru-baru ini, kami juga menambahkan dukungan penuh untuk sistem pemuatan ulang modul panas Webpack. Vue loader menggunakan ini secara ekstensif. Jika Anda mengubah Komponen Vue, Vue loader akan menggunakan API modul panas untuk memuat ulang file tersebut saja. Katakanlah Anda mengubah template atau gaya, itu berarti Anda akan melihat perubahannya dengan tetap mempertahankan keadaan yang sama. Ini membutuhkan waktu lebih lama dari yang diharapkan tetapi sekarang dapat digunakan juga dalam proyek React.

Itu hebat! Topik apa yang Anda minati saat ini?

Ada topik khusus yang sering saya lihat akhir-akhir ini yaitu Alat Pengembang Web Berbasis UI.

Misalnya, sebagian besar alat pengembang yang kami gunakan berbasis terminal. Nah, jika kita fokus pada Pengembangan Web, mengapa kita tidak memiliki Alat Pengembang Web yang lebih berbasis UI? Contoh yang bagus adalah Webpack Dashboard yang dibuat oleh pemberontak Ken Wheeler di Formidable Labs.

Jika kita memikirkan Interaksi Manusia dan Komputer, kita sangat terdorong oleh visual. Jika Anda memberi tahu seseorang untuk membedakan antara dua sampel data, yang satu berupa diagram batang dan yang lainnya adalah informasi tekstual. Melihat diagram batang, mereka akan memberi tahu secara sekilas lebih cepat daripada membaca teks.

Dasbor Webpack menggunakan pendekatan visual ini dengan cukup baik, menunjukkan semua modul yang dibuat menunjukkan ukuran relatifnya dan kontribusinya terhadap ukuran total. Dengan menggunakan informasi visual ini, Anda dapat dengan cepat mengidentifikasi masalah bundling apa pun.

Sebagai pertanyaan terakhir: pembicaraan atau topik apa yang Anda nantikan di konferensi ini?

Saya tertarik dengan pembicaraan dari Sebastien Chopindan Alexandre Chopin. Mereka adalah pencipta Nuxt. Dengan menggunakan Nuxt, Anda tidak perlu melakukan pengaturan awal atau memikirkan konfigurasi apa pun untuk mengaktifkan Rendering Sisi Server atau membangun Aplikasi Vue Anda. Saya menyukai apa yang mereka lakukan dan saya sangat tertarik dengan pembicaraan mereka.

Terima kasih atas waktunya, Ives!

Terima kasih Gerard! Saya berpikir saya mungkin bisa merilis beberapa fitur baru untuk CodeSandbox sebelum pembicaraan saya dan di antara kelompok pelajar. Pantau terus!