ReactJS (NodeJs,Npm & Package.json)

Node.Js
Ada yang tau Apa itu Node.Js ?

Node.Js adalah lingkungan dari runtime JavaScript. Node banyak sekali yang digunakan dalam hal pengembangan aplikasi back-end maupun front-end. Node.Js ini juga dapat digunakan untuk linting, testing, assembling, dan lain-lainnya. Dalam proses pengembangan aplikasi JavaScript modern contoh ReactJs, Node.Js ini sangat penting digunakan karena dapat memudahkan dalam proses pembuatan aplikasi karena dapat melihat langsung hasil dari aplikasi yang sedang berjalan. Node.Js ini merupakan tool untuk JavaScript disisi server. Penjelasan secara detail dapat mengunjungi Node.Js. Kalian bisa install melalui package maupun cara yang lainnya.

NPM
NPM ini disebut package manager default dari Node.JS. Package manager selain NPM yang sangat populer dan banyak juga yang digunakan yaitu Yarn. Kalian juga dapat menggunakan salah satu, tapi tutorial disini kita akan menggunakan NPM secara default.

Package.json
Package.json merupakan untuk digunakan mendeskripsikan pengaturan dari project JavaScript. Package.json ini bisa memuat tentang nama project, versim kontributor, dan lain-lainnya.

Ayoo Kita memulai dengan membuat folder baru dengan ketik perintah pada terminal :

mkdir sinau-react
cd sinau-react

Selanjutnya di terminal kalian ketik perintah :

npm init

Silahkan diisi. contohnya seperti dibawah ini

name: (sinau-react)
version: (1.0.0)
description: belajar react dan lingkunganya
entry point: (index.js)
test command:
git repository:
keywords:
author: akhisyabab
license: (ISC)
About to write to /home/akhi/React/React Js/pesonainformatika/sinau-react/package.json:
 {
   "name": "sinau-react",
   "version": "1.0.0",
   "description": "belajar react dan lingkunganya",
   "main": "index.js",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1"
   },
   "author": "akhisyabab",
   "license": "ISC"
 }  
 Is this ok? (yes)   

Selanjutnya itu maka otomatis file baru bernama package.json. Berisi code script yang telah kalian isi tadi. Disini ada folder sinau-react kita sebut App, kemudian file package.json berada di root app. Jadi contoh kita buat file baru di root berarti file baru berada sama dengan package.json.

Sekarang kita coba buat file index.js di root. Isikan kode berikut:

console.log("Hai Cantik :*");

Selanjutnya jalankan dengan perintah :

node .

Start Scripts

Dalam package.json tambahkan perintah start pada scripts seperti berikut

{
"name": "sinau-react",
"version": "1.0.0",
"description": "belajar react dan lingkunganya",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "node ."
},
"author": "akhisyabab",
"license": "ISC"
}

Setelah disimpan, buka terminal kembali kemudian ketik perintah

npm start

Installing menggunakan Pakcage NPM
Dari hasil membangun aplikasi react selanjutnya kita akan menginstall berbagai macam tool dan library melalui NPM. Sebagai contoh dari permulaan cara install color dengan perintah :

npm install --save color

Selanjutnya akan ada folder baru yaitu node_modules. Folder ini tempat menyimpan tool atau library yang telah kita install. Dari file package.json ini pun akan otomatis berubah dengan tambahan script.

"dependencies": {
  "color": "^1.0.3"
}

Ada 2 jenis yaitu dependencies dan devDependencies. maka kita menggunakan devDependencies untuk library yang hanya digunakan saat proses develop seperti webpack dan laim-lainnya yang akan kita bahas di materi berikutnya.

Demikian postingan ini yang saya buat, semoga bermanfaat, sampai jumpa di posting materi selanjutnya.

Tinggalkan Balasan