Cara menggunakan npm html decoder

NPM adalah salah satu registri software terbesar saat ini yang digunakan oleh para developer untuk saling berbagi kode package JavaScript. Secara default, NPM sudah disertakan dengan node.js.

NPM adalah singkatan dari Node Package Manager, yaitu pengelola package yang memungkinkan developer JavaScript menemukan dan menginstal package kode ke aplikasi jaringan atau server-side.

Package node.js merupakan sebuah direktori yang berisi satu atau lebih modul atau library JavaScript yang berfungsi untuk menambahkan berbagai fitur ke suatu aplikasi atau skrip. Tanpa package ini, software developer atau engineer harus menulis kode baru untuk setiap fungsi yang diperlukan.

Download HTML Cheat Sheet

Untuk lebih jelasnya, di artikel ini kami akan menjelaskan selengkapnya tentang apa itu npm, cara kerja npm, serta memandu Anda menggunakannya dan menginstal package tambahan. Mari langsung mulai saja!

Website ekstra cepat anti lemot. Dapatkan domain gratis dengan langganan web hosting 1 tahun. Pilih Web Hosting

 

Cara Kerja npm

Setelah membahas apa itu NPM, sekarang kami akan membantu Anda memahami cara kerja Node Package Manager.

Cara kerja npm digolongkan menjadi 3 fungsi, yaitu sebagai:

  • Repositori – npm adalah repositori yang banyak digunakan untuk memublikasikan proyek Node open-source, tempat para developer bisa berbagi source code dengan user npm lainnya. Angular, React, dan jQuery merupakan beberapa package yang bisa Anda download dari repositori npm.
  • Command-line interface (CLI) – developer bisa menjalankan CLI npm dari terminal atau tool command-line untuk menginstal atau menghapus package serta mengelola versi atau dependensi.
  • Registri – setiap package atau modul yang Anda instal menggunakan CLI npm didownload dari registri publik npm, database software JavaScript.

Apa Itu package.json?

Setiap proyek npm berisi package.json, yaitu file yang terletak di direktori root dan berisi metadata proyek atau package NPM, seperti versi dan kontributor package.

File package.json memudahkan proses identifikasi, pengelolaan, dan penginstalan package. Oleh karena itu, penting untuk menyertakan package.json sebelum memublikasikan proyek di registri npm.

Berikut adalah contoh isi file package.json:

{
  "name": "hostinger-npm",
  "version": "1.0.0",
  "description": "npm guide for beginner",
  "main": "beginner-npm.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "dependencies": {
    "express": "^4.17.1"
  },
  "repository": {
    "type": "git",
    "url": "https://github.com/hostinger/example.git"
  },
  "keywords": [
    "npm",
    "example",
    "basic"
  ],
  "author": "Hostinger International",
  "license": "MIT",
}

Untuk membantu Anda memahami package.json, kami akan membahas baris terpenting dari contoh tersebut:

"name": "hostinger-npm",

Baris di atas mendefinisikan nama package. Nama ini harus kurang dari 214 karakter dan hanya huruf kecil. Kalau Anda ingin memublikasikan tool di registri npm, namanya harus berbeda dari paket lain yang sudah ada.

"version": "1.0.0",

Version menentukan versi proyek Anda saat ini, dan harus mengikuti aturan penentuan versi semantik.

"description": "npm guide for beginner",

Sertakan informasi package di baris description untuk membantu pengguna menemukan proyek Anda di registri npm.

"main": "beginner-npm.js",

Kolom main menentukan entry point atau file utama proyek Anda. Kalau properti ini dibiarkan kosong, npm akan secara otomatis menetapkan nilainya ke index.js.

"scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
},

Properti scripts berisi command yang menjalankan tugas untuk proyek Anda. User npm bisa memanfaatkan kolom ini untuk meneruskan argumen ke CLI tanpa harus mengetik ulang.

"dependencies": {
  "express": "^4.16.4"
},

Kolom ini mencantumkan semua dependency (dependensi) atau package yang digunakan dalam proyek. Saat Anda menginstal tool menggunakan command

"main": "beginner-npm.js",
2, proyek tersebut akan otomatis dimasukkan di sini.

"repository": {
  "type": "git",
  "url": "https://github.com/hostinger/example.git"
},

Properti repository berisi URL kode sumber. Dalam contoh ini, GitHub adalah lokasi package, dan Git adalah sistem kontrol versinya.

"keywords": [
  "npm",
  "example",
  "basic"
],

Kolom ini berisi serangkaian keyword yang terkait dengan deskripsi tugas package, membantu user NPM menemukan package melalui pencarian. Hilangkan properti ini kalau Anda tidak akan memublikasikan proyek di registri npm.

"author": "Hostinger International",

Gunakan properti author (penulis) untuk menyatakan pembuat proyek.

"name": "hostinger-npm",
0

Baris ini mendefinisikan lisensi proyek npm, memberitahukan apakah proyek bisa digunakan tanpa batasan apa pun.

Untuk mencari tahu informasi lebih lanjut tentang kolom lain dalam package.json, silakan baca dokumentasi resmi package.json.

Apa Itu Dependency dan devDependency?

Dependency dan devDependency adalah kolom di dalam package.json yang mencantumkan semua package yang digunakan oleh suatu proyek.

Kolom dependency menyertakan semua package pihak ketiga yang diperlukan agar proyek Anda bisa berjalan.

Di sisi lain, properti devDependency berisi package yang hanya diperlukan selama proses development.

Dependency dan devDependency diinstal melalui command

"main": "beginner-npm.js",
2 dengan flag
"main": "beginner-npm.js",
4 dan
"main": "beginner-npm.js",
5.

Cara Menginstal Modul npm dan Memulai Proyek

Sebelum menggunakan npm, pastikan node.js sudah terinstal. Untuk melakukannya, buka terminal dan jalankan command berikut:

"name": "hostinger-npm",
1

Jendela terminal akan menampilkan versi node.js yang terinstal di sistem Anda:

"name": "hostinger-npm",
2

Lakukan lagi untuk npm dengan menggunakan command berikut:

"name": "hostinger-npm",
3

Setelah itu Anda akan melihat nomor versi seperti berikut:

"name": "hostinger-npm",
4

Apabila node.js belum terinstal, download dulu dari website resminya.

Cara menggunakan npm html decoder

Selanjutnya kami akan membahas beberapa command NPM dasar.

Menginisialisasi Proyek dengan npm

Untuk memulai proyek baru, jalankan command berikut dari CLI npm:

"name": "hostinger-npm",
5

Command ini akan membuat file package.json untuk proyek Anda di direktori saat ini.

Setelah menjalankan command

"main": "beginner-npm.js",
6, terminal akan menampilkan informasi berikut:

"name": "hostinger-npm",
6

Anda akan diminta untuk memasukkan informasi proyek dengan urutan sebagai berikut:

  • Nama package
  • Versi awal
  • Deskripsi
  • Entry point
  • Command pengujian
  • Repositori Git
  • Keyword
  • Author
  • Lisensi

Berikan respons pada setiap command

"main": "beginner-npm.js",
6 tersebut dengan mengetikkan nilai Anda lalu menekan Enter. Atau, tekan Enter tanpa memasukkan apa pun untuk menggunakan nilai default atau nilai dalam tanda kurung.

Kami mengisi informasi package seperti berikut:

"name": "hostinger-npm",
7

Setelah memasukkan semua detail proyek,

"main": "beginner-npm.js",
6 akan menampilkan preview file package.json seperti ini:

"name": "hostinger-npm",
8

Ketik yes lalu tekan Enter untuk menyimpan file package.json. Anda bisa memodifikasinya nanti dengan mengedit file atau menjalankan command

"main": "beginner-npm.js",
6 lagi.

Kalau ingin membuat file package.json dengan nilai default tanpa memberikan respons pada prompt

"main": "beginner-npm.js",
6, gunakan perintah berikut:

"name": "hostinger-npm",
9

Kemudian npm akan membuat file package.json dengan nilai default, seperti ini:

"version": "1.0.0",
0

Setelah membuat file package.json, Anda bisa menambahkan package node apa pun ke proyek Anda.

Menginstall Modul npm pada Proyek

Penting untuk mengetahui cara menginstal package ketika akan menggunakan npm.

Untuk menambahkan package ke proyek Anda, jalankan salah satu command berikut:

"version": "1.0.0",
1

Tips Berguna

Pada perintah di atas, ganti package-name dengan nama modul yang ingin Anda instal.

Misalnya apabila Anda ingin menginstal express (framework web populer yang memudahkan proses web development standar), gunakan command berikut:

"version": "1.0.0",
2

Command ini akan menginstal modul express dalam folder node_modules di direktori root proyek. Perlu diketahui bahwa node_modules hanya akan muncul setelah package pertama diinstal.

Kalau package berhasil diinstal, terminal akan menampilkan pesan berikut:

Cara menggunakan npm html decoder

Kemudian, package.json juga akan menyertakan modul di dalam kolom

"scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
},
1:

"version": "1.0.0",
3

Menginstal Package Sebagai Development Dependency

Untuk menginstal tool apa pun yang hanya akan digunakan di development environment (lingkungan pengembangan), gunakan perintah berikut:

"version": "1.0.0",
4

Contohnya Anda ingin menggunakan nodemon untuk reload proyek ketika ada perubahan pada file. Untuk menginstal tool ini, ketikkan command berikut ke terminal:

"version": "1.0.0",
5

Setelah nodemon diinstal, terminal akan menampilkan pesan ini:

Cara menggunakan npm html decoder

NPM juga akan menambahkan bagian

"scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
},
2 dengan data yang baru ke file package.json seperti ini:

"version": "1.0.0",
6

Menginstal Modul Secara Global di Sistem

Apabila Anda ingin menginstal package npm untuk digunakan dari command line, masukkan salah satu command berikut:

"version": "1.0.0",
7

Pastikan untuk mengganti

"scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
},
3 dengan nama modul Anda.

Mengupdate npm

Agar kode dan tool Anda tetap aman dan stabil, lakukan update rutin pada package lokal dan global yang didownload dari registri npm.

Sebelum mengupdate package npm apa pun, cek apakah ada yang sudah outdated. Anda bisa mengecek ketersediaan update untuk package NPM dalam proyek atau sistem Anda menggunakan command ini dari direktori root:

"version": "1.0.0",
8

Untuk mengecek package global yang outdated, jalankan command berikut:

"version": "1.0.0",
9

Setelah mendapatkan daftar modul yang outdated, Anda bisa mengupdate semua package atau salah satunya saja.

Untuk mengupdate semua package dalam proyek Anda, jalankan perintah berikut dari command line:

"description": "npm guide for beginner",
0

Untuk mengupdate satu modul, masukkan kode ini:

"description": "npm guide for beginner",
1

Jangan lupa untuk mengganti

"scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
},
3 dengan nama package yang ingin Anda update.

Untuk mengupdate semua package global di sistem, jalankan command di bawah ini:

"description": "npm guide for beginner",
2

Apabila ingin mengupdate satu package global, masukkan perintah berikut dan ganti

"scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
},
5> dengan nama modul Anda:

"description": "npm guide for beginner",
3

Kalau akan mengupdate Node package manager sendiri, jalankan command berikut ini:

"description": "npm guide for beginner",
4

Setelah versi terbaru npm diinstal, jendela terminal akan menampilkan pesan seperti ini:

Cara menggunakan npm html decoder

Untuk mengetahui command CLI npm lainnya, lihat dokumentasi command npm.

Kesimpulan

Selesai! Melalui artikel ini, Anda sudah mempelajari apa itu npm dan beberapa contoh kodenya.

Singkatnya, npm adalah package manager populer yang memungkinkan developer JavaScript saling berbagi dan menerapkan package dengan cepat dan mudah.

Setiap proyek NPM menyertakan sebuah file bernama package.json di direktori root miliknya. File ini berisi metadata proyek yang memungkinkan siapa pun menemukan modul di repositori NPM.

Selain berisi informasi proyek penting, package.json juga menyimpan daftar dependensi yang diperlukan agar proyek bisa dijalankan.

Package yang sudah diinstal developer untuk membantu mereka selama proses development juga akan disertakan dalam package.json di bawah devDependencies.

Sebagai ringkasan, berikut beberapa command NPM untuk membantu Anda memulai dan melakukan tugas-tugas dasar dengan package manager ini:

  • Mengecek versi npm:
"name": "hostinger-npm",
3
  • Memulai proyek:
"name": "hostinger-npm",
5
  • Menginstal modul:
"description": "npm guide for beginner",
7
  • Menginstal package sebagai development dependency:
"version": "1.0.0",
4
  • Menginstal modul secara global pada sistem:
"description": "npm guide for beginner",
9
  • Mengupdate semua package dalam proyek:
"description": "npm guide for beginner",
0
  • Mengupdate npm ke versi terbaru:
"description": "npm guide for beginner",
4

Semoga artikel ini bisa membantu Anda memahami apa itu npm secara lebih jelas dan menggunakannya dengan benar. Kalau masih punya pertanyaan, jangan ragu untuk menyampaikannya lewat komentar ya.

Cara menggunakan npm html decoder

Penulis

Faradilla A.

Faradilla, yang lebih akrab disapa Ninda, adalah Content Manager di Hostinger. Ia suka mengikuti tren seputar teknologi, digital marketing, dan belajar bahasa. Melalui tutorial Hostinger ini, Ninda ingin berbagi informasi dan membantu pembaca menyelesaikan masalah yang dialami.