Mengenal npm dan Instalasi serta Penggunaannya

Bagikan di

Bagi kamu yang ingin belajar membuat website, kamu perlu mengetahui apa itu npm. Sata ini, npm merupakan salah satu komponen utama di dalam pengembangan website modern. Sebelum kita masuk ke cara instalasi dan penggunaan, sangat disarankan kamu mengetahui apa itu npm.

Paket dari npm

Jadi, apa itu npm?

 

Berkenalan dengan npm

Secara sejarah, npm adalah produk yang berasal dari pengembangan platform bernama Node.js. Node.js ini sendiri adalah platform yang digunakan untuk dapat menjalankan bahasa pemrograman Javascript di bagian back-end. Pada awalnya, Javascript hanya bisa berjalan di front-end.

Logo Node.js

Aplikasi npm merupakan aplikasi bawaan dari Node.js, adalah singkatan dari Node Package Manager. Kegunaan npm ini adalah sebagai package registry dan online repository untuk software berbasis Javascript. Secara awam, npm adalah perpustakaan besar yang berisikan software-software yang dibuat oleh banyak orang. Orang dapat membagikan software mereka dan juga mengunduh software lain di tempat ini.

 

Kapan dan kenapa npm digunakan?

Kenapa sih kita butuh perpustakaan software seperti ini? Coba bayangkan kamu ingin membangun rumah, tentunya kamu akan membeli bata dan semen dari toko bangunan. Kamu tidak mungkin membuat bata dan semen kamu sendiri, kan? Sama dengan halnya dengan pembuatan software, beberapa hal tidaklah mungkin kita buat sendiri sehingga kita harus ‘membelinya’ dari tempat lain. Disini, kita ‘membeli’ (lebih tepatnya mengunduh) dari si perpustakaan software.

Di dalam pengembangan sebuah aplikasi website, menggunakan software buatan orang lain untuk membantu kita adalah hal yang lumrah. Software buatan orang lain ini biasa kita sebut dengan library. Dengan mengetahui cara penggunaan npm kamu jadi bisa membuat website yang kompleks dalam waktu yang lebih singkat karena kamu bisa menggunakan software yang sudah dibuat oleh orang lain untuk membantu kamu.

 

Menginstal npm ke Komputer

Perlu diketahui bahwa npm terdiri dari 3 bagian:

  1. Website. Tempat kamu bisa mencari package yang dapat kamu akses di npmjs.com
  2. CLI (Command Line Interface). Software yang kamu download ke komputer untuk dapat menggunakan npm.
  3. Registry. Perpustakaan online tempat disimpannya package.

 

Di panduan ini, kamu hanya akan mengunduh npm CLI yang akan kamu gunakan untuk mengakses npm registry. Untuk menginstal npm CLI, kamu harus menginstal juga Node.js, karena keduanya berada dalam satu paket instalasi yang sama. Berikut langkah-langkahnya:

  1. Unduh installasi di website resmi Node.js.

  2. Di halaman tersebut, silakan pilih sistem operasi yang kamu gunakan. Contohnya, kebanyakan orang saat ini menggunakan Windows 64-bit, silakan pilih Windows Installer (.msi) dan klik 64-bit.

  3. Setelah kamu download, buka aplikasi dan jalankan instalasi.

  4. Setelah instalasi selesai, buka Command Prompt (di Windows), atau terminal (di Linux dan Mac).

    Membuka Command Prompt di Windows

  5. Pada layar Command Prompt atau terminal, ketik node -v lalu tekan enter. Jika instalasi berhasil, maka akan keluar tulisan seperti gambar di bawah ini (angka bisa berubah-ubah).

    C:\Users\ngoding> node -v
    v12.18.4.
    
  6. Kemudian, coba ketik npm -v lalu tekan enter. Jika insatalsi berhasil, maka keluar tulisan seperti gambar di bawah ini (angka bisa berubah-ubah).

    C:\Users\ngoding> npm -v
    6.14.6
    

Jika kamu sudah sampai tahap ini, selamat! Kamu telah berhasil melakukan instalasi node dan npm. Saatnya menggunakan alat ini untuk membuat website.

 

Menggunakan npm untuk Menjalankan Aplikasi

Selanjutnya, kita coba gunakan npm untuk menjalankan aplikasi yang tersedia di software registry. Aplikasi coba-coba yang bernama cowsay. Aplikasi ini akan mengeluarkan gambar sapi dengan kata-kata yang kita tulis.

Untuk melakukan instalasi ketik perintah berikut ini ke Command Prompt atau terminal.

npm install cowsay

Kemudian coba jalankan aplikasi cowsay dengan perintah berikut ini

npx cowsay Apa Kabar?

Berikut ini kira-kira yang akan keluar di layar kamu,

C:\Users\ngoding> npx cowsay Apa Kabar?
 ____________
< Apa Kabar? >
 ------------
        \   ^__^
         \  (oo)\_______
            (__)\       )\/\
                ||----w |
                ||     ||

Untuk menghapus aplikasi tersebut gunakan perintah ini

npm uninstall cowsay

 

Menggunakan npm untuk Membuat Website Sederhana

Sekarang, mari kita buat sebuah website sederhana dengan menggunakan npm dan juga Node.js.

Pertama, buat sebuah file baru bernama app.js. Kemudian isi file tersebut dengan kode berikut ini,

const http = require('http');

http.createServer((req,res) => {
  res.statusCode = 200;
  res.end("Hello World");
}).listen(8000);

console.log("Server menyala dan jalan di port 8000, ketik localhost:8000 di browser");

Setelah itu, jalankan perintah berikut ini

node app.js

Buka browser dan ketik: localhost:8000 tekan enter. Jika kamu berhasil menjalankan semua langkah di atas, maka akan keluar tulisan seperti ini di browser kamu.

Hasil website pertama kamu muncul di browser

Selamat! Kamu berhasil membuat website pertama kamu!

Sekarang, mari kita coba menggunakan npm. Untuk menggunakan npm pertama-tama kamu harus menjalankan perintah berikut ini,

npm init

Perintah ini akan membuatkan file bernama package.json secara otomatis. File ini nantinya akan kamu isi dengan keterangan mengenai aplikasi yang kamu buat serta library apa saja yang kamu gunakan untuk membuat website tersebut. Berikut ini contoh isi file yang dihasilkan,

{
  "name": "website",
  "version": "1.0.0",
  "description": "",
  "main": "app.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {}
}

Selanjutnya kita akan menggunakan npm untuk membantu membuat website yang kita miliki.

Bayangkan kamu ingin website kamu menampilkan suatu gambar yang berbeda-beda setiap kali orang membuka web kamu. Beruntungnya, terdapat npm package atau library yang bisa melakukannya. Coba jalankan perintah berikut ini,

npm install cool-images

Perintah tersebut akan melakukan instalasi library baru bernama cool-images yang bisa mengambil gambar secara acak dari internet.

Lalu, ubah isi file app.js kamu menjadi seperti ini,

const http = require('http');
const coolImages = require("cool-images");

http.createServer((req,res) => {
  let image = coolImages.one();

  res.statusCode = 200;
  res.setHeader('Content-Type', 'text/html');
  res.end('<img src="' + image + '"/>');
}).listen(8000);

console.log("Server menyala dan jalan di port 8000, ketik localhost:8000 di browser");

Jalankan kembali node agar kamu bisa mengakses website kamu melalui browser dengan melakukan perintah node app.js.

Lalu, buka browser dan ketik: localhost:8000 tekan enter. Jika kamu berhasil menjalankan semua langkah di atas, maka akan gambar di browser kamu. Selain itu, gambar akan berubah-ubah setiap kali kamu melakukan refresh.

Website baru kamu muncul di browser

Dengan ini, kamu sudah berhasil menggunakan sebuah npm package yang dibuat oleh orang lain.

 

Penutup

Nah, sekarang sudah jelaskan apa itu npm dan bagaimana cara menggunakannya. Selanjutnya, kamu bisa mencoba-coba untuk menginstal library lain yang tersedia di npm untuk kamu gunakan dalam membuat website.

Aplikasi npm walaupun dibuat bersamaan dengan Node.js, namun dapat berdiri sendiri seperti yang kamu lihat pada aplikasi cowsay. Namun jika kamu ingin membuat website, Node.js (node) dan npm mempunyai integrasi yang bagus sehingga akan lebih mudah untuk digunakan.

Salah satu library yang penting untuk dipelajari dalam pembuatan website adalah express. Kamu bisa melakukan instalasi dengan menggunakan perintah npm install express. Library ini digunakan agar kamu dapat lebih mudah membuat website yang kompleks. Tunggu artikel berikutnya mengenai express ini, ya!

Jangan lupa untuk coba-coba sendiri apa yang sudah didapatkan dari artikel ini. Semoga bermanfaat.


Bagikan di


Kolom Diskusi

Sedang memuat...