Cara Menggunakan Dependabot untuk Menjaga Lingkungan Anda Tetap Mutakhir

Menambahkan dependensi ke proyek sering kali membantu Anda tidak menemukan kembali roda. Tetapi pada saat yang sama dapat menyebabkan masalah di berbagai aspek proyek:

  • Pembuatan versi: terkadang dependensi memerlukan versi tertentu dari dependensi lain dan ini dapat menyebabkan aplikasi Anda tersendat
  • Bundling: Anda harus berhati-hati agar tidak berakhir dengan terlalu banyak kode tambahan yang akan membuat bundel Anda membengkak
  • Memperbarui: JavaScript bergerak cepat, dan jika Anda tidak memperbarui paket secara teratur, Anda akan bermain Jenga di masa mendatang.

Ada alat berbeda untuk mencakup tugas memperbarui dependensi, seperti Dependencies.io, Snyk, dan Dependabot. Karena saya sudah lama menggunakan Dependabot, saya memutuskan untuk menulis tentang pengalaman saya.

Dependabot adalah alat yang diperoleh GitHub setahun yang lalu yang memeriksa file dependensi dari berbagai bahasa (Ruby, JavaScript, Python, PHP, Elixir, dan lain-lain) dan menemukan versi baru pustaka yang Anda gunakan dalam proyek Anda. Berikut pengaturannya:

Tangkapan layar Dependabot

Pembaruan harian bisa sangat banyak, dan menurut saya pembaruan mingguan memiliki biaya / manfaat yang lebih baik. Juga, saya menetapkan Permintaan Tarik untuk diri saya sendiri sehingga saya bisa mendapatkan pemberitahuan segera setelah dibuka.

Cara menggunakan Dependabot secara efektif

Dependabot menyertakan, di setiap PR, catatan rilis, log perubahan, tautan komit, dan detail kerentanan kapan pun tersedia. Ini berguna karena Anda dapat melihat informasi dan memutuskan untuk melanjutkan atau tidak.

Namun, sebagai programmer pragmatis, kami ingin memastikan semuanya tidak akan rusak. Detail PR penting tetapi lebih dari itu, kami menginginkan simulasi dari semua (atau hampir semua) kiriman yang dimiliki proyek.

Integrasi CI

Tangkapan layar ini menunjukkan apa yang terjadi setiap kali PR dibuka di basis kode pustaka komponen pekerjaan saya.

  • Tes (Jest / Bundle) : tugas Jest akan menguji komponen React sedangkan tugas Bundle akan mensimulasikan perintah bundling yang kita jalankan ketika kita ingin memperbarui paket di registri NPM
  • Linters (Stylesheets / JavaScript) : file stylesheet mengikuti penyiapan sass-lint kustom dan kode JS mengikuti serangkaian aturan ESLint. Jika PR memperkenalkan versi baru linter dengan aturan baru, kami akan dapat menangkapnya.
  • Cypress (Pengujian Screenshot / Pengujian Aksesibilitas) : jika paket baru memperkenalkan perubahan yang mungkin tercermin dalam tampilan dan nuansa komponen, Cypress akan menangkap perbedaannya, mengambil screenshotnya, dan menyimpannya di S3. Karena Cypress membutuhkan versi live dari situs dokumentasi, kami juga mendapatkan proses pembuatan Gatsby.

Dengan semua langkah ini, sangat tidak mungkin paket eksternal akan merusak cabang master kita. Kudos kepada rekan kerja saya Grant Lee yang juga mengerjakan proyek ini.

Juga diposting di blog saya. Jika Anda menyukai konten ini, ikuti saya di Twitter dan GitHub. Foto sampul oleh Zhang Kenny di Unsplash