Menyediakan informasi seputar perkembangan mesin Blogger dan internet secara umum.

Cara Merilis Paket Node.js Secara Otomatis Bersamaan dengan Rilis pada GitHub

GitHub + NPM
Gambar oleh GitHub.

Dengan membaca artikel ini, Saya menganggap kamu sudah paham mengenai apa dan bagaimana itu NPM dan GitHub.

Pada tanggal 16 Maret 2020 yang lalu, GitHub —yang sebelumnya juga telah berhasil diakuisisi oleh Microsoft— mengumumkan sebuah kabar gembira bahwa NPM memutuskan untuk bergabung dengan GitHub. Dengan mengesampingkan ketidaksukaan Saya terhadap pola-pola modul JavaScript, sejak saat itu Saya mulai menelusuri tentang bagaimana cara melakukan integrasi NPM dengan GitHub. Untuk apa? Untuk membuat aktivitas NPM menjadi serba otomatis menyesuaikan dengan berbagai aktivitas yang Saya lakukan di GitHub.

Karena Saya yang tidak suka dengan NPM namun tidak bisa menghindari kenyataan bahwa beberapa pengguna aplikasi Saya ternyata menginginkan Saya untuk memberikan opsi pemasangan aplikasi melalui NPM, dan karena aktivitas utama koding jarak jauh Saya sekarang hampir seluruhnya berada di GitHub, dan karena dalam lubuk hati Saya yang paling dalam (cie…) sebenarnya Saya tetap saja tidak menyukai konsep pemuatan modul di NPM, pada akhirnya Saya memutuskan untuk keluar dari zona nyaman Saya.

Sebelumnya Saya sudah beberapa kali melakukan rilis paket Node.js secara manual, secara biasa, sesuai dengan prosedur pada situs web dokumentasi NPM, yaitu dengan cara menuliskan perintah npm publish --access public setiap kali Saya sudah siap merilis versi paket yang lebih baru, yang hal tersebut tentu saja memaksa Saya untuk memasang lingkungan Node.js terlebih dahulu di komputer yang sedang Saya pakai, yang kadang hal tersebut menurut Saya agak ribet, karena saat ini Saya masih berada di luar kebutuhan untuk menggunakan Node.js sebagai peladen lokal.

Kemudian Saya mengetahui bahwa NPM sekarang bergabung dengan GitHub. Saya pikir, pasti ada cara tertentu untuk membuat semuanya menjadi serba otomatis. Cara seperti itu pasti ada, dan ternyata memang benar.

Mengenal GitHub Actions

Actions atau Aksi pada GitHub merupakan fitur yang memungkinkan kita untuk mengeksekusi perintah-perintah tertentu secara otomatis setiap kali kita melakukan aktivitas pada GitHub. Cara kerjanya sama dengan kait atau hook pada sistem manajemen konten Mecha dan pendengar acara atau event listener pada JavaScript. Setiap kali kita melakukan aktivitas dorong dan tarik, menulis isu dan komentar misalnya, pada saat itu sebenarnya terdapat kait dengan nama tertentu yang akan dieksekusi oleh GitHub. Dengan memanfaatkan nama kait tersebut, maka kita bisa mengeksekusi perintah yang kita inginkan pada saat kait tersebut dipanggil.

Pada kasus yang sedang kita bahas sekarang, nama kait yang Saya maksud di sini adalah release, dan bentuk aksi yang akan kita lakukan adalah mengeksekusi perintah npm publish pada repositori jarak jauh yang baru saja kita rilis. Namun karena kita tidak memiliki akses kepada peladen Node.js di GitHub, dan karena membuat kait web memerlukan peladen Node.js pribadi untuk menentukan tautan sebagai penerima muatan dari GitHub, maka memanfaatkan fitur Webhooks menjadi tidak mungkin.

Fitur aksi pada GitHub memberikan akses kepada kita untuk memanfaatkan lingkungan peladen yang ada di GitHub dengan cara menuliskan berkas konfigurasi tertentu untuk dijalankan oleh GitHub.

Menu Actions seharusnya sudah ada pada halaman awal repositori masing-masing selama fitur tersebut tidak dinonaktifkan melalui menu Settings. Untuk membuat aksi, klik menu Actions pada repositori yang diinginkan kemudian pilih jenis alur kerja yang akan dipakai, dalam hal ini adalah Node.js:

Memilih alur kerja.
Memilih alur kerja.

Kamu mungkin juga akan melihat opsi Publish Node.js Package di situ yang secara logika seharusnya lebih tepat untuk dipilih. Tapi di sini Saya lebih cenderung ke opsi Node.js karena kedua opsi tersebut pada dasarnya sama. Hanya saja opsi Node.js sifatnya lebih menyeluruh, sedangkan opsi Publish Node.js Package tersedia hanya untuk menangani aktivitas publikasi paket saja. Harapan Saya adalah ketika suatu saat nanti Saya ingin membuat artikel yang sejenis atau terkait dengan implementasi GitHub Actions pada artikel ini, maka Saya hanya tinggal meminta kalian untuk melakukan sedikit perubahan pada pengaturan yang sudah kalian buat di sini.

Setelah mengambil pilihan, kamu akan diminta untuk mengisi formulir yang bertujuan untuk membuat berkas bernama .\.github\workflows\nodejs.yml seperti ini:

Membuat `nodejs.yml`
Membuat berkas konfigurasi.

Hapus semua isinya kemudian ganti dengan ini:

name: Publish

on:
  release:
    types: [published]

jobs:
  build:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v1
      - uses: actions/setup-node@v1
        with:
          node-version: 12
          registry-url: https://registry.npmjs.org/
      - run: yarn install
      - run: npm publish --access public
        env:
          NODE_AUTH_TOKEN: ${{secrets.NPM_TOKEN}}

Klik tombol Start commit untuk memulai pembuatan berkas.

Kalau kamu sudah mahir menggunakan aplikasi Git, kamu sebenarnya bisa kok membuat berkas tersebut secara manual pada repositori lokal melalui terminal. Setelah itu, kamu tinggal menjalankan perintah git push untuk menambahkan berkas tersebut ke repositori jarak jauh. Namun karena pada contoh di atas, yang kamu lakukan adalah membuat berkas baru secara langsung melalui repositori jarak jauh, maka kamu perlu melakukan sinkronisasi kembali dengan repositori lokal, dengan cara menjalankan perintah git pull pada terminal untuk memastikan agar kedua repositori tetap berada dalam kondisi dan status yang sama persis.

Pada data konfigurasi di atas, kita bisa sedikit memahami, dimulai dari data yang ini, yang berfungsi untuk menjalankan jobs pada saat kait release dengan tipe published berhasil dipanggil:

on:
  release:
    types: [published]

Perintah publikasi paket berada pada baris ini:

jobs:
  build:
    steps:
      - …
      - …
      - run: npm publish --access public

Variabel ${{secrets.NPM_TOKEN}} berisi token rahasia yang perlu kita buat secara manual melalui dasbor NPM.

Membuat Token Akses untuk Autentikasi

Agar bisa berkomunikasi dengan NPM, kita perlu membuat token rahasia yang berfungsi untuk memberikan akses kepada paket-paket kita di NPM.

Buka tautan https://www.npmjs.com/settings/nama-pengguna/tokens atau klik pada ikon avatar di pojok kanan atas kemudian pilih menu Auth Tokens. Klik pada tombol Create New Token.

Membuat token akses di NPM.
Membuat token akses baru.

Pilih tingkatan akses ke Read and Publish kemudian klik tombol Create Token.

Segera salin token yang sudah berhasil dibuat!

Sampai di sini, sebenarnya kamu bisa mengganti variabel ${{secrets.NPM_TOKEN}} dengan kode token yang baru saja kamu salin. Tapi karena token ini bersifat rahasia dan berfungsi sebagaimana kata kunci yang kita gunakan untuk log masuk, maka ada baiknya jika kita simpan token tersebut ke dalam variabel secrets.NPM_TOKEN di GitHub, sehingga nilainya dapat diakses melalui properti NPM_TOKEN di variabel secrets, namun tidak akan bisa dilihat secara langsung karena sudah tersimpan di tempat yang lain.

Menyimpan Token NPM di GitHub

Untuk menyimpan token rahasia di GitHub, gunakan fitur GitHub Secrets. Pada setiap repositori, fitur ini dapat diakses melalui menu Settings. Buat variabel baru dengan nama NPM_TOKEN kemudian tempelkan kode token yang sudah kamu salin tadi:

Membuat token akses di NPM.
Menyimpan token akses rahasia ke GitHub.

Klik tombol Add secret. Kode token rahasia sudah berhasil disimpan dan tidak akan pernah bisa dibuka lagi. Kamu tidak perlu melakukan perubahan apa-apa pada berkas nodejs.yml yang telah kamu buat sebelumnya.

Sistem rilis paket Node.js otomatis sudah selesai dibuat!


Cara Merilis Paket Node.js Melalui GitHub

Untuk merilis paket dari GitHub ke NPM secara otomatis, kamu hanya perlu membuat item rilis baru di GitHub untuk memicu kait release pada repositori tersebut. Tapi sebelum itu, pastikan properti version di dalam berkas package.json sudah diperbarui:

{
  "name": "@taufik-nurrohman/query-string-parser",
  "description": "Convert URL’s query string into JavaScript object.",
  "version": "1.0.1",
  "main": "q2o.js",
  "repository": {
    "type": "git",
    "url": "git+https://github.com/taufik-nurrohman/query-string-parser.git"
  },
  "author": "Taufik Nurrohman",
  "license": "MIT",
  …
}

Pada halaman formulir rilis baru, tentukan nama label sesuai dengan nilai properti version pada berkas package.json:

Merilis versi baru.
Merilis versi baru.

Nama label ini, setahu Saya tidak ada kaitannya dengan NPM karena NPM hanya akan membaca berkas package.json pada repositori terkait untuk mengecek apakah nilai properti version sudah berubah atau belum. Tapi ada baiknya untuk tetap menyesuaikan nilainya dengan versi paket untuk menjaga konsistensi antara GitHub dengan NPM. Silakan isi judul dan konten rilis sesuka hati untuk memperjelas maksud dan tujuan rilis pada versi tersebut.

Setelah berhasil melakukan rilis pada GitHub, harusnya salinan repositori GitHub tersebut akan secara otomatis dibuat (atau diperbarui jika sudah ada) sebagai paket Node.js di situs web NPM, seperti ini:

Beberapa detik yang lalu.
Lihat keterangan bahwa paket @taufik-nurrohman/query-string-parser baru saja diperbarui beberapa detik yang lalu.

  

Berlangganan

Berlangganan: Dapatkan berbagai materi dan informasi seputar dunia pemrograman yang tidak akan pernah bisa kalian dapatkan di buku dan di bangku kuliah.

 0 Komentar

Memuat…

Tautan (link) hidup dalam komentar akan terhapus secara otomatis.
Untuk menyisipkan tautan dengan aman, gunakan kode [url=http://example.com]Teks Tautan[/url]
Untuk menyisipkan kode, gunakan tag <i rel="code">KODE ANDA</i>
Untuk menyisipkan gambar, gunakan kode [img]URL GAMBAR[/img]
Untuk menyisipkan judul, gunakan tag <b rel="h4">JUDUL ANDA DI SINI…</b>
Untuk menciptakan efek tebal gunakan tag <strong>TEKS ANDA DI SINI…</strong>
Untuk menciptakan efek huruf miring gunakan tag <em>TEKS ANDA DI SINI…</em>

Khusus untuk membalas komentar disarankan menggunakan tombol balas di samping komentar terkait dibandingkan menggunakan formulir komentar di bawah agar komunikasi lebih terstruktur. Karena mungkin, apa yang Anda tanyakan/katakan saat ini akan sangat bermanfaat bagi pembaca lain.

:) :( ^_^ :D ;) :bd :'( :\ ;p B) :Q :Ozzz 7:( \o/ **p :* 0:) :a 7:O *fuck* x& x@ ~x( *yaya* =p*

Nama Saya Taufik Nurrohman. Sebenarnya Saya tidak bisa disebut sebagai seorang yang profesional dalam bidang ini, karena Saya tidak menguasai bidang ini melalui pendidikan formal. Saya hanyalah seorang antusias. Dibandingkan sebagai seorang desainer atau pengembang, Saya lebih suka jika disebut sebagai seorang hobiis saja yang tertarik dengan dunia web.

Daftar Tautan

Saya tidak bisa hidup tanpa JavaScript! Aktifkan JavaScript?
Ke atas!