Beberapa tahun kebelakang, android merupakan sebuah teknologi yang sangat pesat berkembang. Seiring berkembanganya teknologi, para developer mulai banyak mengembangkan aplikasi - aplikasi berbasis android baik secara native maupun hybrid. Kali ini kita akan mencoba membuat sebuah aplikasi android dengan menggunakan teknologi ionic.

Ionic merupakan sebuah framework untuk membuat aplikasi mobile hybrid dengan teknologi web.

Salah satu kelebihan ionic adalah mobile hybrid artinya kita hanya perlu melakukan 1 kali coding, dan hasil coding tersebut dapat kita build menjadi aplikasi Android dan IOS.

Berikut merupakan tahapan yang akan kita lakukan untuk membuat project dengan menggunakan ionic.

• Instalasi Android
• Instalasi Ionic
• Membuat Sebuah Aplikasi Android
• Membuat File APK
• Instalasi File APK Ke Device Android

Instalasi Android

Bagi yang belum melakukan instalasi java, silahkan dilihan di instalasi perlengkapan coding java Silahkan anda download android studio. Kemudian extract dan install sdk android versi 5.1.1 atau API 22. Setelah selesai, kita akan mulai melakukan path android. Jalankan perintah berkut.

sudo gedit /etc/environment

kemudian masukkan variabel berikut pada bagian atas

ANDROID_HOME=/home/rizki/Android/Sdk

Sesuaikan dengan directory anda. Kemudian tambahkan pada bagian PATH seperti ini

PATH="/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin:/usr/games:/usr/local/games:/home/rizki/Android/Sdk/platform-tools:/home/rizki/Android/Sdk/tools"

Silahkan restart komputer anda agar variabel tersebut dapat terbaca di terminal anda.

Instalasi Ionic

Untuk melakukan instalasi ionic, diwajibkan untuk melakukan instalasi node js, bagi yang belum melakukan instalasi node js silahkan lihat di instalasi perlengkapan coding node JS. Kemudian jalankan perintah berikut.

npm install -g cordova ionic

tunggu hingga instalasi selesai.

Membuat Sebuah Aplikasi Android

Setelah selesai instalasi ionic, sekarang saatnya coding :D. sebelumnya berikut adalah syarat untuk coding ionic.

• Mengerti HTML khususnya html5
• Mengerti Angular JS, ini yang wajib anda kuasai untuk membuat aplikasi dengan ionic

Jalankan perintah berikut untuk membuat aplikasi android dengan ionic.

ionic start Belajar-Ionic blank

artinya kita ingin membuat sebuah aplikasi dengan nama Belajar-Ionic dengan menggunakan template ‘blank’. Setelah selesai, kemudian masuk ke root folder project dengan menggunakan terminal lalu jalankan perintah berikut.

ionic platform add android

perintah diatas berfungsi untuk mendeklarasikan bahwa kita ingin membuat sebuah aplikasi mobile untuk android. Tunggu hingga hasil download selesai. Setelah selesai, kita coba jalankan dengan perintah.

ionic run

Berikut adalah hasilnya.

sedangkan jika kita ingin melakukan uji coba terlebih dahulu, kita dapat melakukan akses aplikasi melalui browser dengan perintah.

ionic serve

lalu akses pada http://localhost:8100/. Berikut adalah tampilan pada web nya.

Membuat File APK

Tidak seperti android studio, untuk membuat file APK, kita akan menggunakan terminal :D dikarenakan ionic belum memiliki IDE seperti halnya kita melakukan coding android secara native. Masuk ke root folder project lalu jalankan perintah berikut.

cordova build --release android

Tunggu sejenak karena gradle akan melakukan build terhadap aplikasi kita, dan nantinya akan muncul file apk dengan nama android-release-unsigned.apk pada folder platforms/android/build/outputs/apk/. File apk ini masih belum bisa diinstall di hp dikarenakan belum adanya keystore. Langkah selanjutnya adalah masuk ke folder platforms/android/build/outputs/apk/ dengan terminal lalu jalankan perintah berikut.

keytool -genkey -v -keystore my-release-key.keystore -alias alias_name -keyalg RSA -keysize 2048 -validity 10000

Masukkan password dan data lainnya. Jika berhasil maka di dalam folder tersebut akan digenerate sebuah keystore dengan nama my-release-key.keystore. Kemudian kita harus melakukan sign terhadap file apk agar dapat diinstall pada device android. File apk ini di sign dengan menggunakan keystore yang telah kita buat tadi dengan perintah.

jarsigner -verbose -sigalg SHA1withRSA -digestalg SHA1 -keystore my-release-key.keystore android-release-unsigned.apk alias_name

Tahap selanjutnya adalah silahkan anda download zipaligner. Zipaligner berfungsi untuk membuat file apk yang telah release. Extract kemudian copy semua file zipaligner ke folder platforms/android/build/outputs/apk/ kemudian beri hak akses dengan sintak chmoa a+x zipalign kemudian untuk membuat apk jalankan perintah berikut.

./zipalign -v 4 android-release-unsigned.apk Belajar-Ionic.apk

Jika berhasil maka terdapat file Belajar-Ionic.apk di dalam folder platforms/android/build/outputs/apk/.

Instalasi File APK Ke Device Android

Install Ke Emulator Android

Agar dapat melakukan instalasi pada emulator, silahkan jalankan terlebih dahulu emulator anda kemudian masuk ke folder platforms/android/build/outputs/apk/ lalu install file apk tersebut dengan perintah.

adb install Belajar-Ionic.apk

Jika berhasil maka hasilnya seperti ini

Kemudian cari aplikasi Belajar-Ionic pada menu emulator android anda.

Install Ke Device Android

Silahkan sambungkan HP anda dengan menggunakan kabel data ke komputer anda. Kemudian aktifkan debungging USB pada menu opsi pengembangan. Kemudian lakukan pengecekan device dengan perintah.

adb devices

maka jika device ada akan muncul berdasarkan device anda, berikut contoh device saya.

Kemudian install ke device dengan perintah

adb install Belajar-Ionic.apk

Sekian tutorial tentang Belajar Ionic, semoga bermanfaat dan terima kasih :).

Kebanyakan mahasiswa masih menggunakan microsoft word untuk mengerjakan skripsi dan penulisan ilmiah. Microsoft word memang salah satu tool yang sangat populer untuk kegiatan menulis dan lain sebagainya. Tapi tahu kah anda bahwa menulis sebuah skripsi dan penulisan ilmiah merupakan pekerjaan yang sangat merepotkan jika menggunakan microsoft word ? bagaimana bisa ? baiklah, penulis akan menjelaskan mengapa microsoft word dapat merepotkan anda untuk menulis ?

• yang pertama adalah masalah penomoran halaman, microsoft word diharuskan untuk melakukan setting terlebih dahulu, anda tahu bahwa halaman paling depan menggunakan angka romawi dan dimulai bab 1 kita menggunakan angka biasa, ini membutuhkan settingan page break.
• Yang kedua, tata letak penulisan, penulisan anda awalnya rapi, tapi ketika ada salah satu yang harus diganti maka otomatis dari secara tidak langsung penulisan setelahnya akan hancur terlebih jika terdapat gambar dan tabel.
• Penulisan huruf yang tidak konsisten, ini dapat dilihat dari nama bab, nama section dan lain sebagainya.
• Jarak antar spasi tidak konsisten, ada yg 1,5 ada yg 2 bahakan ada 2,5 ini membuat penulisan menjadi acak - acakan.
• Daftar isi, daftar gambar dan daftar tabel diharuskan membuat sendiri, pembuatan nama tabel juga harus dibuat oleh pengguna misalnya gambar 3.2 : helloword
• Untuk perpustakaan, kita diharuskan untuk membuat sendiri tanpa bantuan lain, sehingga banyak tulisan daftar pustaka yang tidak sesuai aturan penulisan.

Trus bagaimana mengatasinya ? untuk soal penulisan ada beberapa tool yang disarankan, diantaranya adalah dengan menggunakan LaTeX dan Markdown. Diantara 2 tool tersebut, LaTeX merupakan salah satu tool yang paling banyak digunakan dalam bidang akademik sedangkan markdown lebih ke arah pembuatan ebook dan dokumentasi. Untuk penulisan skripsi dan penulisan ilmiah kita gunakan LaTex saja, tapi tunggu bukankah LaTeX itu diharuskan kita untuk coding secara manual ? yups tapi jangan khawatir karena ada sebuah tool lagi yang mirip fungsinya seperti microsoft word yaitu LyX.

Instalasi LyX

Untuk pengguna windows silahkan anda download di LyX sedangkan pengguna linux, kita akan menggunakan terminal.

tambahkan repsitory terlebih dahulu.

sudo add-apt-repository ppa:lyx-devel/release

kemudian lakukan update.

sudo apt-get update

kemudian install lyx dengan perintah.

sudo apt-get install lyx

Di linux, belum tersedia bahasa indonesia yang dikenali oleh LyX sehingga kita melakukan instalasi dependencynya dengan perintah.

sudo apt-get install texlive-lang-other

Menggunakan LyX dan Template LyX

Silahkan download template LyX pada repository github saya di TemplatePenulisanLyX kemudian buka file yang berektensi .lyx misalnya disini saya membuka template skripsi. maka hasilnya seperti ini.

Mengganti Nama Penulis, Dosen Pembimbing Dst

• Klik menu document lalu pilih settings
• lalu pilih menu LaTex Preamble
• Anda dapat mengganti nama, nama dosen pembimbing, kajur, dan lain sebaginya. Berikut contoh gambarnya

Membuat Table

• Klik menu insert lalu pilih float lalu pilih table
• maka dibuatkan sebuah frame beserta tabel yang keberapa, silahkan anda isi nama tabel tersebut
• Untuk memasukkan tabel, klik insert lalu pilih table, anda dapat memilih berapa kolom dan berapa baris.
• Untuk membuat agar tabel di tengah, klik kanan di dalam frame tabel lalu pilih paragraft setting lalu pilih center. Berikut merupakan hasilnya.

Memasukkan Gambar

• Klik menu insert lalu pilih float lalu pilih figure
• maka dibuatkan sebuah frame beserta gambar yang keberapa, silahkan anda isi nama gambar tersebut
• Untuk memasukkan tabel, klik insert lalu pilih Graphics, lalu pilih browse, cari gambar anda dan tekan oke.
• Untuk membuat agar gambar di tengah, klik kanan di dalam frame gambar lalu pilih paragraft setting lalu pilih center. Berikut merupakan hasilnya.

Membuat Kutipan

• Cari kalimat yang merupakan kutipan
• Kemudian pindahkan kursor pada akhir kalimat dikarenakan kutipan ada di akhir
• Pilih menu insert dan pilih citation
• pada menu citation, pada kolom available citation terdapat nama pengarang, pilih salah satu lalu add sehingga akan muncul pada kolom selected citation
• Kemudian klik oke, maka akan muncul kutipan tersebut. Berikut adalah gambarnya.

Membuat Daftar Pustaka

• Download terlebih dahulu Jabef yang digunakan untuk memasukkan daftar isi
• Jabref bersifat portable sehingga dapat langsung dibuka
• Buka jabref, pilih menu file lalu pilih open database, pilih file biblio.bib maka tampilannya akan seperti ini.
• Kemudian kita akan mencari daftar pustaka dengan bantuan google scholar, buka google scholar lalu cari sebuah pengarang dengan judul bukunya misalnya ifnu bima java desktop maka akan muncul seperti ini.
• Pilih kutipan maka akan muncul sebuah popup, lalu pilih BibTeX maka akan muncul codingan BibTex
• copy codingan BibTex, kemudian ke jabref pilih menu bibtex lalu pilih new entry lalu pilih buku
• Akan muncul menu bibtex untuk mengisi data dari daftar perpustakaan, buka tab bibtex source, lalu pastekan codingan tadi save dan haslinya seperti ini.
• Tahap terakhir adalah melakukan setting daftar pustaka pada LyX, Buka pada halaman akhir, terdapat tulisan BibTex generated bibliography klik tulisan tersebut maka akan muncul sebuah pop up. Pada bagian style pilih apalike. Ini Merupakan format Model Harvard/APA, kemudian pilih oke dan berikut hasil akhirnya.

konversi ke PDF

Untuk mendapatkan penulisan yang rapi, LyX dapat mengubah penulisan LaTeX menjadi pdf sehingga dapat dibuka di komputer mana pun. Untuk melakukan konversi dengan menggunakan tombol ctrl + R

Demikian tutorial singkat mengenai penulisan skripsi dan penulisan ilmiah, Semoga menjadi bahan pertimbangan ketika anda menulis dan terima kasih :).

Pada tutorial sebelumnya penulis telah membahas bagaimana cara instalasi untuk coding node js. Kali ini kita akan belajar bagaimana membagun sebuah aplikasi berbasis node js.

Berikut merupakan tahapan untuk membuat sebuah aplikasi dengan node js :

• Initialisasi Project Node JS
• Initialisasi dependency Library dengan bower
• Membuat model
• Membuat Router
• Membuat view
• Uji Coba

Initialisasi Project Node JS

Kita mulai dengan membuat sebuah folder aplikasi, disini penulis memberi nama folder dengan Belajar-ExpressJS kemudian masuk ke folder dengan menggunakan terminal. Jalankan perintah npm init kemudian masukkan inputan sesuai dengan anda inginkan. Jika berhasil maka akan dibuatkan sebuah file yaitu package.json sebagai konfigurasi project node js. Langkah selanjutnya adalah kita memerlukan banyak dependency library diantaranya seperti express, mongoose, jade dan lain - lain. Untuk melakukan instalasi dependency tersebut jalankan perintah berikut :

npm install body-parser cookie-parser csurf errorhandler express express-session jade method-override mongoose morgan node-uuid serve-favicon winston --save

Berikut merupakan list dari library diatas :

• body-parser : digunakan untuk parsing sebuah url dan json
• cookie-parser : digunakan untuk konfigurasi cookie
• csurf : digunakan untuk konfigurasi CSRF(Cross Site Request Forgery), untuk pembahasan CSRF akan dibahas pada tutorial selanjutnya :)
• errorhandler : digunakan untuk handle error pada node js
• express : merupakan framework node js untuk membangun sebuah aplikasi web
• express-session : digunakan sebagai session pada express
• jade : digunakan sebagai template engine pada node js, sebenarnya masih ada banyak template engine lain seperti EJS akan tetapi kita akan menggunakan template jade dikarenakan jade termasuk template yang bagus terutama support terhadap extends template
• method-override : biasnya digunakan untuk membangun protokol HTTP method
• mongoose : sebagai framework ODM (Object Document Mapping) yang akan melakukan akses ke mongoDB. MongoDB adalah database yang berbasis NoSQL, silahkan install MongoDB berikut dokumentasi cara instalasi MongoDB
• morgan : digunakan sebagai log aplikasi
• node-uuid : digunakan untuk generate otomatis UUID, UUID merupakan key yang unik, biasanya digunakan untuk generate ID pada sebuah database yang bersifat primary key
• serve-favicon : digunakan untuk favicon atau icon sebuah web
• winston : digunakan sebagai library log aplikasi

Initialisasi dependency Library dengan bower

Setelah konfigurasi project node js, selanjutnya kita ingin download dependency library untuk front end. Jalanakn perintah bower init lalu masukkan inputan lagi dan akan digenerate sebuah file bower.json yang merupakan file konfigurasi bower. Jalankan perintah berikut untuk instalasi dependency library bootstrap dan jquery :

bower install jquery bootstrap --save

Membuat model

Framework express mendukung pattern MVC (model view controller) sama halnya seperti framework lain seperti Ruby On Rails dan Spring Framework. Buat sebuah folder models lalu buat sebuah file Pegawai.js. Berikut merupakan codingan dari file Pegawai.js.

(function() {
  'use strict';

  var pegawai,
    mongoose = require('mongoose'),
    Schema = mongoose.Schema;

  pegawai = new Schema({
    idPegawai: {
      type: 'String',
      required: true
    },
    namaPegawai: {
      type: 'String',
      required: true
    },
    alamat: {
      type: 'String'
    },
    tanggalLahir: {
      type: 'Date',
      required: true
    }
  }, {
    collection: 'tb_pegawai'
  });

  module.exports = mongoose.model('Pegawai', pegawai);

}).call(this);

Berikut penjelasan singkat tentang codingan diatas :

• var pegawai, mongoose; merupakan deklarasi dari masing - masing variabel. variabel pegawai merupakan variabel kosong, variabel monggose merupakan variabel dengan type data mongoose dan variabel Schema merupakan variabel dari Schema mongoose. Tidak seperti bahasa pemrograman lain, javascript dapat langsung mendeklarasikan variabelnya tanpa type data. require(‘monggose’) artinya kita melakukan import dari library monggose, ini sama halnya ketika kita melakukan import pada bahasa pemrograman java.
• codingan selanjutnya merupakan pendeklarasian dari pada column - column yang ada pada sebuah database. Konsep ODM dan ORM memiliki kemiripan akan tetapi terdapat perbedaan yaitu pada ODM terdapat document dan tidak ada relasi sedangkan pada ORM terdapat table dan terdapat relasi.
• collection : merupakan definisi dari pada collection pada mongodb, jika pada database RDBMS (SQL) kita mengenalnya dengan table. Silahkan pelajari lebih lanjut mengenai database MongoDB :).
• module.exports : merupakan kodingan untuk melakukan export variabel pegawai, sehingga variabel pegawai dapat diakses oleh file javascript yang lainnya.

Membuat Router

Router merupakan sebuah controller, hanya saja dari penamaannya saja. Developer express lebih suka menyebutkan router sehingga disini penulis menggunakan dengan nama router. Sebelum kita membuat router, penulis membuat sebuah konfigurasi untuk log sebuah aplikasi. Buat 3 folder dengan nama routes, utils dan logs dan buat sebuah file dengan nama logger.js di dalam folder utils. Berikut adalah kodingan dari logger.js.

var winston = require('winston');
winston.emitErrs = true;

var logger = new winston.Logger({
  transports: [
    new winston.transports.File({
      level: 'debug',
      filename: './logs/logs-aplikasi.log',
      handleExceptions: true,
      json: true,
      maxsize: 5242880,
      maxFiles: 5,
      colorize: false
    }),
    new winston.transports.Console({
      level: 'debug',
      handleExceptions: true,
      json: false,
      colorize: true
    })
  ],
  exitOnError: false
});

module.exports = logger;
module.exports.stream = {
  write: function(message, encoding) {
    logger.info(message);
  }
};

Untuk codingan diatas akan dibahas pada tutorial selanjutnya mengenai log sebuah aplikasi :). Oke selanjutnya buat sebuah file PegawaiRoute.js di dalam folder routes. Berikut codingannya.

(function() {
  'use strict';

  var express = require('express'),
    Pegawai = require('../models/Pegawai'),
    logger = require('../utils/logger'),
    csrf = require('csurf'),
    router = express.Router(),
    csrfProtection = csrf({
      cookie: true
    }),
    uuid = require('node-uuid');

  router.get('/', function(req, res) {
    return Pegawai.find(function(err, pegawais) {

      if (err) {
        logger.error('error bung ', err);
        return res.render('500');
      }

      logger.debug('Berhasil ngambil data bung ', pegawais);
      return res.render('index', {
        pegawais: pegawais
      });

    });
  });

  router.get('/tambah/pegawai', csrfProtection, function(req, res) {
    logger.info('render page tambah');
    return res.render('tambah', {
      csrfToken: req.csrfToken()
    });
  });

  router.post('/save/pegawai', csrfProtection, function(req, res) {
    var pegawai = new Pegawai({
      idPegawai: uuid.v4(),
      namaPegawai: req.body.namaPegawai,
      alamat: req.body.alamat,
      tanggalLahir: req.body.tanggalLahir
    });

    return pegawai.save(function(err, pegawai) {
      if (err) {
        logger.error('error bung ', err);
        return res.render('500');
      }

      logger.debug('data tersimpan bung ', pegawai);
      logger.info('render page awal');
      return res.redirect('/');
    });

  });

  router.get('/edit/pegawai/:idPegawai', csrfProtection, function(req, res) {
    logger.info('edit pegawai');

    var idPegawai = req.params.idPegawai;

    Pegawai.findOne({
      idPegawai: idPegawai
    }, function(err, pegawai) {

      if (err) {
        logger.error('error bung ', err);
        return res.render('500');
      }

      logger.debug('data tersedia ', pegawai);
      logger.info('render page edit');
      return res.render('edit', {
        pegawai: pegawai,
        csrfToken: req.csrfToken()
      });
    });
  });

  router.post('/update/pegawai/:idPegawai', csrfProtection, function(req, res) {

    var idPegawai = req.params.idPegawai;

    Pegawai.findOne({
      idPegawai: idPegawai
    }, function(err, pegawai) {

      if (err) {
        logger.error('error bung ', err);
        return res.render('500');
      }

      pegawai.namaPegawai = req.body.namaPegawai;
      pegawai.alamat = req.body.alamat;
      pegawai.tanggalLahir = req.body.tanggalLahir;
      pegawai.save();

      logger.debug('data tersimpan bung ', pegawai);
      logger.info('render page awal');

      res.redirect('/');
    });
  });

  router.get('/delete/pegawai/:idPegawai', function(req, res) {
    Pegawai.remove({
      idPegawai: req.params.idPegawai
    }, function(err) {
      if (err) {
        logger.error('error bung ', err);
        return res.render('500');
      }

      logger.debug('data dihapus');
      logger.info('render page awal');
      res.redirect('/');
    });
  });

  module.exports = router;

}).call(this);

Berikut merupakan penjelasan singkat :

• var express = require('express') merupakan codingan untuk melakukan import file javascript.
• dimulai dari router.get('/', function(req, res) merupakan sebuah method untuk mengambil data lalu data tersebut di lempar ke view sekaligus melakukan render terhadap sebuah page jade. Disana terdapat kodingan Pegawai.find yang berfungsi untuk mengambil semua data pegawai, Lalu bagaimana melempar ke view ? pada bagian res.render('index', {pegawais: pegawais}) merupakan aksi untuk melakukan render dengan nama page index lalu mengirim data dengan parameter pegawais.
• router.get('/tambah/pegawai') merupakan kodingan untuk menampilkan halaman tambah data pegawai, disini penulis menggunakan token CSRF :).
• router.post('/save/pegawai') merupakan method untuk menyimpan data pegawai. Untuk menyimpan, kita menggunakan Model yaitu Pegawai akan tetapi kita diharuskan membuat object baru, dapat dilihat di var pegawai = new Pegawai. Untuk idPegawai kita membuatnya dengan menggunakan bantuan node-uuid sedangkan data lain berdasarkan dari pada form, untuk mengambil data pada form kita menggunakan req.body.namaTextField. Jika data tersimpan maka kita akan melakukan redirect ke page awal.
• method selanjutnya adalah router.get('/edit/pegawai/:idPegawai' yang berfungsi untuk melalukan render halaman edit, sebelum melakukan render, kita mengambil data terlebih dahulu berdasarkan idPegawai dapat diliha pada codingan router.get('/edit/pegawai/:idPegawai' lalu melakukan render ke page edit.
• router.post('/update/pegawai/:idPegawai' sama seperti method save sebelumya bedanya adalah, disini kita melakukan query terlebih dahulu terhadap Pegawai kemudian kita melakukan update data, dapat dilihat pada codingan router.post('/update/pegawai/:idPegawai').
• router.get('/delete/pegawai/:idPegawai)' merupakan method yang terakhir untuk menghapus sebuah data. Untuk menghapus data dapat dilihat pada Pegawai.remove({}).

Membuat view

Tahap selanjutnya adalah membuat view, silahkan buat folder views kemudian buat 5 file di dalam folder tersebut yaitu layout.jade, index.jade, tambah.jade, edit.jade dan 500.jade. Berikut adalah kodingan untuk layout.jade.

doctype html
html(lang='en')
    head
      meta(charset='utf-8')
      meta(name='viewport', content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no')
      meta(name='description', content='description')
      meta(name='keywords', content='keywords')
      meta(name='author', content='author')
      meta(name="robots", content="index, follow")

      //- ----- link website ----- //
      link(rel='icon' href='../favicon.ico' type='image/x-icon')

      //- ----- CSS Files ----- //
      link(rel='stylesheet', href='/bootstrap/dist/css/bootstrap.min.css')

      block title
        title Default title

    body

      script(type='text/javascript', src='/jquery/dist/jquery.min.js')
      script(type='text/javascript', src='/bootstrap/dist/js/bootstrap.min.js')

      block content

codingan diatas berfungsi untuk mendeklarasikan layout untuk semua page, page lain akan melakukan extend terhadap layout ini sehingga kita hanya perlu melakukan import library jquery dan bootstrap di layout ini. Sama seperti html biasa hanya saja pada page engine jade kita tidak menggunakan penutup tag, akan tetapi secara otomatis akan dibuatkan oleh jade, untuk lebih lengkap silahkan baca dokumentasi dari jade. Selanjutnya kita ke page index.jade dan berikut codingannya.

extends ./layout.jade

block title
  title Data Pegawai
block content
  div.container
    div.row
      div.col-xs-6.col-md-1
      div.col-xs-6.col-md-10
        p
          a.class(href='/tambah/pegawai')
            button(type="button").btn.btn-primary Tambah
        p
        table.table.table-bordered.table-striped.table-hover
          thead
            tr
              th.text-center Id Pegawai
              th.text-center Nama Pegawai
              th.text-center Alamat
              th.text-center Tanggal Lahir
              th.text-center Aksi
          tbody
            each pegawai in pegawais
              tr
                td #{pegawai.idPegawai}
                td #{pegawai.namaPegawai}
                td #{pegawai.alamat}
                td #{pegawai.tanggalLahir}
                td.text-center
                  a.class(href='/edit/pegawai/#{pegawai.idPegawai}')
                    button(type="button").btn.btn-success Edit
                  a.class(href='/delete/pegawai/#{pegawai.idPegawai}', onclick='return confirm("Apakah anda ingin menghapus data ?")')
                    button(type="button").btn.btn-danger Delete
      div.col-xs-6.col-md-4

Bisa dilihat pada kodingan each pegawai in pegawais kita melakukan render data berdasarkan data pegawais yang tadinya kita kirim melalui router. Data yang dikirim berupa array sehingga kita dapat melakukan render data tersebut ke dalam sebuah table. Jade juga mendukung penggunaan javascript client, contohnya ada pada button delete. Selanjutnya kita beralih ke page tambah.jade dengan kodingan.

extends ./layout.jade

block title
  title Tambah Data Pegawai
block content
  div.container
    div.row
      div.col-xs-6.col-md-4
      div.col-xs-6.col-md-4
        form(id="form", method="post", action="/save/pegawai")
          .form-group
            label Nama Pegawai
            input(type="text", placeholder="Nama Pegawai", name="namaPegawai").form-control
          .form-group
            label Alamat
            textarea(placeholder="Alamat", name="alamat").form-control
          .form-group
            label Tanggal Lahir
            input(type="date", placeholder="Tanggal Lahir", name="tanggalLahir").form-control
          input(type="hidden", name="_csrf" value="#{csrfToken}")
          button(type="submit").btn.btn-primary Save
      div.col-xs-6.col-md-4

Sama seperti kodingan form biasa, disana kita deklarasikan nama masing - masing input agar dapat dibaca oleh server lalu datanya akan disimpan, disini penulis juga menggunakan CSRF dapat dilihat pada bagian

input(type="hidden", name="_csrf" value="#{csrfToken}")

Selanjutnya adalah page edit.jade.

extends ./layout.jade

block title
  title Edit Data Pegawai
block content
  div.container
    div.row
      div.col-xs-6.col-md-4
      div.col-xs-6.col-md-4
        form(id="form", method="post", action="/update/pegawai/#{pegawai.idPegawai}")
          .form-group
            label Id Pegawai
            input(type="text", placeholder="Id Pegawai", name="idPegawai", value="#{pegawai.idPegawai}", disabled).form-control
          .form-group
            label Nama Pegawai
            input(type="text", placeholder="Nama Pegawai", name="namaPegawai", value="#{pegawai.namaPegawai}").form-control
          .form-group
            label Alamat
            textarea(type="text",placeholder="Alamat", name="alamat").form-control
              | #{pegawai.alamat}
          .form-group
            label Tanggal Lahir
            input(type="text", placeholder="Tanggal Lahir", name="tanggalLahir", value="#{pegawai.tanggalLahir}").form-control
          input(type="hidden", name="_csrf" value="#{csrfToken}")
          button(type="submit").btn.btn-primary Save
      div.col-xs-6.col-md-4

Sama seperti page tambah.jade hanya saja disini kita langsung memberikan value, dikarenakan user dapat melihat value sebelumnya, dan disini penulis mendisable untuk inputan idPegawai dikarenakan idPegawai bersifat unik. Dan page terakhir adalah 500.jade, berikut kodingannya .

extends ./layout.jade

block title
  title Edit Data Pegawai
block content
  h1 Error 500 bung ... silahkan coba sesaat lagi :)

Page 500.jade hanya sebagai page yang digunakan jika terjadi error pada aplikasi web node js ini. Tahap terakhir adalah kita membuat konfigurasi server agar dapat dijalankan. Buatlah sebuah file app.js pada root folder. Kemudian masukkan codingan berikut.

(function() {
  'use strict';

  var http = require('http'),
    express = require('express'), //express
    path = require('path'), //untuk path folder
    favicon = require('serve-favicon'), //untuk favicon
    morgan = require('morgan'), //untuk log aplikasi
    methodOverride = require('method-override'),
    session = require('express-session'), //session
    bodyParser = require('body-parser'), //handle rest
    errorhandler = require('errorhandler'), //error
    logger = require('./utils/logger'), //loging
    mongoose = require('mongoose'), //mongoose
    cookieParser = require('cookie-parser'),
    PegawaiRoute = require('./routes/PegawaiRoute'),
    app = express();

  app.set('port', process.env.PORT || 3000);
  app.set('views', path.join(__dirname, 'views'));
  app.set('view engine', 'jade');

  app.use(cookieParser());
  app.use(favicon(__dirname + '/public/favicon.ico'));
  app.use(morgan('combined', {
    stream: logger.stream
  }));
  app.use(methodOverride());
  app.use(session({
    resave: true,
    saveUninitialized: true,
    secret: 'uwotm8'
  }));
  app.use(bodyParser.urlencoded({
    extended: true
  }));
  app.use(express.static(path.join(__dirname, 'public')));
  app.use(express.static(path.join(__dirname, 'bower_components')));

  app.use('/', PegawaiRoute);

  mongoose.connect('mongodb://localhost/BelajarExpressJS', function(err, res) {
    if (err) {
      return logger.error('koneksi mongodb gagal bung', err);
    } else {
      return logger.info('koneksi mongodb berhasil bung');
    }
  });

  if ('development' === app.get('env')) {
    app.use(errorhandler());
  }

  app.use(function(err, req, res, next) {
    if (err.code !== 'EBADCSRFTOKEN') return next(err)

    // handle CSRF token errors here
    res.status(403)
    res.send('csrf token tidak tersedia bung');
  });

  var server = http.createServer(app);
  server.listen(app.get('port'), function() {
    return console.log('Server jalan pada port ' + app.get('port'));
  });

}).call(this);

Lumayan panjang :D baiklah, penulis menjelaskan beberapa hal saja.

• app.set('port'); berfungsi untuk mendeklarasikan aplikasi akan jalan pada port 3000.
• app.set('views'); berfungsi untuk mendeklarasikan folder view yang akan kita gunakan
• ` app.set(‘view engine’, ‘jade’);` berfungsi untuk mendeklarasikan bahwa kita menggunakan jade sebagai template enginenya.
• ` mongoose.connect()` untuk melakukan koneksi ke database mongodb
• var server = http.createServer(app); berfungsi untuk membuat sebuah server lalu menjalankannya. berbeda dengan php, node js dapat dijalankan dengan menggunakan server yang bersifat embedded artinya ketika menjalankan sebuah server node js, kita tidak perlu mencopy project ke folder htdoc untuk dijalankan akan tetapi cukup menjalankannya di folder project maka aplikasi siap digunakan, konsep ini sama seperti pemrograman web pada java, kita dapat menjalankan web server baik jetty, tomcat maupun wildfly pada folder project dengan bantuan maven plugin.

Uji Coba

Akhirnya selesai juga, kita lakukan uji coba, jalankan aplikasi dengan menggunakan nodemon dengan perintah nodemon app.js maka hasilnya seperti ini.

Kemudian hit ke browser dengan url http://localhost:3000/ kemudian tambah data dengan menekan tombol tambah kemudian masukkan data anda, maka hasilnya seperti ini.

Data yang telah disimpan dapat di lihat pada index page, berikut hasilnya.

Untuk melakukan edit data, kita dapat menekan tombol edit, dah hasilnya seperti ini.

Untuk menghapus, kita dapat menekan tombol hapus dan terdapat alert javascript untuk memilik ya atau tidak dan hasilnya seperti ini.

Sekian tutorial belajar express dan Terima kasih :). Untuk source code lengkap, penulis publish di Belajar Express.

Setelah mempelajari sedikit tentang framework hibernate, kali ini kita akan belajar tentang framework spring. Apa itu spring ?

Spring adalah salah satu framework untuk java enterprise. Hingga saat ini sangat banyak developer yang menggunakan framework ini dikarenakan kinerja tinggi, mudah diuji dan kode dapat digunakan kembali. Spring dibuat oleh Rod Johnson dan di di umumkan pada juni 2003 diatas lisensi apache. Spring digunakan untuk mengembangkan aplikasi java terutama dalam membangun sebuah aplikasi web diatas platfom JEE. Dan spring menerapakan kembali pemograman yang berbasis POJO (plain old java object).

Spring adalah salah satu framework yang menerapkan konsep DI (Depedency Injection) dimana depedency injection ini adalah salah satu penerapan dari konsep IoC (inversion of control). Banyak yang menjelaskan bahwa konsep DI dan IoC adalah dua hal yang sama. hal tersebut tidak benar, mengapa demikian ? karena IoC merupakan sebuah konsep yang paling umum dan salah satu penerapan konsep IoC dapat dengan menggunakan DI (depedency injection).

Oke kita akan mulai dengan membuat project spring. Seperti biasa, kita akan menggunakan maven sebagai build toolnya. Jalankan perintah berikut untuk membuat project.

mvn archetype:generate \
-DarchetypeArtifactId=maven-archetype-quickstart \
-DgroupId=com.rizki.mufrizal.belajarSpring \
-DartifactId=Belajar-Spring

Import project tersebut dengan menggunakan IDE kesukaan anda, disini penulis menggunakan Intellij IDEA. Kemudian tambahkan depedency library pada file pom.xml seperti berikut.

<dependencies>

  <!--testing -->
  <dependency>
    <groupId>junit</groupId>
    <artifactId>junit</artifactId>
    <version>4.12</version>
    <scope>test</scope>
  </dependency>
  <dependency>
    <groupId>org.springframework</groupId>
    <artifactId>spring-test</artifactId>
    <version>4.2.0.RELEASE</version>
    <scope>test</scope>
  </dependency>

  <!-- spring core -->
  <dependency>
    <groupId>org.springframework</groupId>
    <artifactId>spring-core</artifactId>
    <version>4.2.0.RELEASE</version>
  </dependency>
  <dependency>
    <groupId>org.springframework</groupId>
    <artifactId>spring-context</artifactId>
    <version>4.2.0.RELEASE</version>
  </dependency>

  <!-- slf4j -->
  <dependency>
    <groupId>org.slf4j</groupId>
    <artifactId>slf4j-api</artifactId>
    <version>1.7.12</version>
  </dependency>
  <dependency>
    <groupId>org.slf4j</groupId>
    <artifactId>slf4j-log4j12</artifactId>
    <version>1.7.12</version>
  </dependency>
  <dependency>
    <groupId>org.slf4j</groupId>
    <artifactId>slf4j-simple</artifactId>
    <version>1.7.12</version>
  </dependency>

</dependencies>

<build>
  <plugins>
    <plugin>
      <groupId>org.apache.maven.plugins</groupId>
      <artifactId>maven-compiler-plugin</artifactId>
      <version>3.2</version>
      <configuration>
        <source>1.8</source>
        <target>1.8</target>
      </configuration>
    </plugin>
  </plugins>
</build>

Oke setelah selesai, kita lanjut untuk melakukan coding. Berikut adalah tampilan struktur projectnya.

Kita akan mulai dari class Sistem Operasi. Class sistem operasi merupakan sebuah class domain atau class model. Di dalam class ini akan kita deklarasikan berbagai properti yang dimiliki oleh si sistem operasi. Class sistem operasi ini akan dibuatkan bean yang nantinya akan diinject oleh spring. Masukkan codingan berikut pada class sistem operasi seperti berikut.

public class SistemOperasi {

    private String namaSistemOperasi;
    private String versiSistemOperasi;

    //getter setter

    @Override
    public String toString() {
        return "Sistem Operasi anda adalah " + getNamaSistemOperasi() + " Dengan Versi " + getVersiSistemOperasi();
    }
}

Pada codingan diatas, kita mendeklarasikan dua property yaitu namaSistemOperasi dan versiSistemOperasi, property ini nantinya akan diinject melalui bean pada konfigurasi spring. Method toString berfungsi agar nanti kita dapat mengetahui apa isi dari property namaSistemOperasi dan versiSistemOperasi. Langkah selanjutnya buat sebuah file xml dengan nama spring-config-context.xml untuk konfigurasi spring dan berikut codingannya.

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
       xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
       xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans.xsd">

    <bean id="sistemOperasiUbuntu" class="com.rizki.mufrizal.belajarSpring.domain.SistemOperasi">
        <property name="namaSistemOperasi" value="Ubuntu"/>
        <property name="versiSistemOperasi" value="14.04"/>
    </bean>

    <bean id="sistemOperasiFedora" class="com.rizki.mufrizal.belajarSpring.domain.SistemOperasi">
        <property name="namaSistemOperasi" value="Fedora"/>
        <property name="versiSistemOperasi" value="fedora 22"/>
    </bean>

    <bean id="sistemOperasiElementary" class="com.rizki.mufrizal.belajarSpring.domain.SistemOperasi">
        <property name="namaSistemOperasi" value="Elementary os"/>
        <property name="versiSistemOperasi" value="Freya"/>
    </bean>

</beans>

konfigurasi diatas memiliki 3 bean, dan masing - masing bean mempunyai rujukan ke class Sistem Operasi, property namaSistemOperasi dan versiSistemOperasi akan diinject dengan value seperti diatas, dengan menggunakan id maka setiap bean mempunyai value yang berbeda - beda. Untuk dapat melakukan inject ini, spring menggunakan method setter yang telah kita deklarasikan pada class SistemOperasi sehingga apabila kita melakukan debug terhadap method getter maka akan muncul value dari masing - masing property. Kemudian gunakan class App.java yang dibuat oleh maven sebagai class main. Berikut codingan untuk main class.

public class App {

    private static final Logger LOGGER = LoggerFactory.getLogger(App.class);

    public static void main(String[]args) {

        ApplicationContext applicationContext = new ClassPathXmlApplicationContext("spring-config-context.xml");

        SistemOperasi sistemOperasiUbuntu = (SistemOperasi) applicationContext.getBean("sistemOperasiUbuntu");
        SistemOperasi sistemOperasiFedora = (SistemOperasi) applicationContext.getBean("sistemOperasiFedora");
        SistemOperasi sistemOperasiElementary = (SistemOperasi) applicationContext.getBean("sistemOperasiElementary");

        LOGGER.debug("Cek Spring Pertama : {}", sistemOperasiUbuntu.toString());
        LOGGER.debug("Cek Spring Kedua   : {}", sistemOperasiFedora.toString());
        LOGGER.debug("Cek Spring Ketiga  : {}", sistemOperasiElementary.toString());

    }

}

Berikut penjelasan singkat mengenai kodingan diatas.

• ApplicationContext dan ClassPathXmlApplicationContext merupakan class yang bertanggung jawab untuk meload konfigurasi spring.
• SistemOperasi merupakan class domain yang telah kita buat, disini penulis membuat 3 object dari class SistemOperasi untuk melakukan inject terhadap 3 bean yang terdapat pada konfigurasi spring.
• dengan menggunakan bantuan library SLF4J maka kita lakukan debug terhadap masing - masing object.

Seperti biasa, untuk mempermudah debug aplikasi, silahkan buat sebuah file log4j.properties dan masukkan codingan berikut.

log4j.rootLogger=DEBUG, file, stdout

# Direct log messages to a log file
log4j.appender.file=org.apache.log4j.RollingFileAppender
log4j.appender.file.File=logs/LogFile.log
log4j.appender.file.MaxFileSize=5MB
log4j.appender.file.MaxBackupIndex=10
log4j.appender.file.layout=org.apache.log4j.PatternLayout
log4j.appender.file.layout.ConversionPattern=%d [%t] %p (%F:%L) - %m%n

# Direct log messages to stdout
log4j.appender.stdout=org.apache.log4j.ConsoleAppender
log4j.appender.stdout.layout=org.apache.log4j.PatternLayout
log4j.appender.stdout.layout.ConversionPattern=%d [%t] %-5p %c - %m%n

# %d untuk tanggal pada saat log dibuat
# %t untuk nama tread
# %p untuk level log
# %c untuk nama class
# %F untuk nama file source code
# %L untuk no baris
# %m%n untuk isi log nya

Tahap terakhir untuk memperoleh sebuah program yang baik maka kita buat sebuah class untuk testing aplikasi. Untuk belajar testing aplikasi, penulis akan membuatnya pada tutorial selanjutnya. Dengan menggunakan class AppTest yang dibuat oleh maven, masukkan codingan berikut agar kita dapat melakukan testing.

@RunWith(SpringJUnit4ClassRunner.class)
@ContextConfiguration(locations = "classpath:spring-config-context.xml")
@TestExecutionListeners({
        DependencyInjectionTestExecutionListener.class
    }
)
public class AppTest {

    @Qualifier("sistemOperasiUbuntu")
    @Autowired
    private SistemOperasi sistemOperasiUbuntu;

    @Qualifier("sistemOperasiFedora")
    @Autowired
    private SistemOperasi sistemOperasiFedora;

    @Qualifier("sistemOperasiElementary")
    @Autowired
    private SistemOperasi sistemOperasiElementary;

    private static final Logger LOGGER = LoggerFactory.getLogger(AppTest.class);

    @Test
    public void testSistemOperasiPertama() throws Exception {
        assertEquals(sistemOperasiUbuntu.getNamaSistemOperasi(), "Ubuntu");
        assertEquals(sistemOperasiUbuntu.getVersiSistemOperasi(), "14.04");
        LOGGER.debug("Test Sistem Operasi Pertama");
    }

    @Test
    public void testSistemOperasiKedua() throws Exception {
        assertEquals(sistemOperasiFedora.getNamaSistemOperasi(), "Fedora");
        assertEquals(sistemOperasiFedora.getVersiSistemOperasi(), "fedora 22");
        LOGGER.debug("Test Sistem Operasi Kedua");
    }

    @Test
    public void testSistemOperasiKetiga() throws Exception {
        assertEquals(sistemOperasiElementary.getNamaSistemOperasi(), "Elementary os");
        assertEquals(sistemOperasiElementary.getVersiSistemOperasi(), "Freya");
        LOGGER.debug("Test Sistem Operasi Ketiga");
    }

}

Jika telah selesai, mari kita jalankan :D. Berikut jalankan perintah berikut untuk melakukan compile dan testing.

mvn compile test

Jika tidak ada error maka akan muncul pesan seperti ini.

Results :

Tests run: 3, Failures: 0, Errors: 0, Skipped: 0

[INFO] ------------------------------------------------------------------------
[INFO] BUILD SUCCESS
[INFO] ------------------------------------------------------------------------
[INFO] Total time: 3.903 s
[INFO] Finished at: 2015-07-28T19:24:13+07:00
[INFO] Final Memory: 16M/161M
[INFO] ------------------------------------------------------------------------

Kemudian jalankan aplikasi dengan perintah.

mvn exec:java -Dexec.mainClass="com.rizki.mufrizal.belajarSpring.App"

Sesuaikan dengan nama folder anda. Jika berhasil maka akan muncul output seperti ini.

2015-07-28 19:25:44,863 [com.rizki.mufrizal.belajarSpring.App.main()] DEBUG com.rizki.mufrizal.belajarSpring.App - Cek Spring Pertama : Sistem Operasi anda adalah Ubuntu Dengan Versi 14.04
2015-07-28 19:25:44,863 [com.rizki.mufrizal.belajarSpring.App.main()] DEBUG com.rizki.mufrizal.belajarSpring.App - Cek Spring Kedua   : Sistem Operasi anda adalah Fedora Dengan Versi fedora 22
2015-07-28 19:25:44,864 [com.rizki.mufrizal.belajarSpring.App.main()] DEBUG com.rizki.mufrizal.belajarSpring.App - Cek Spring Ketiga  : Sistem Operasi anda adalah Elementary os Dengan Versi Freya
[INFO] ------------------------------------------------------------------------
[INFO] BUILD SUCCESS
[INFO] ------------------------------------------------------------------------
[INFO] Total time: 1.982 s
[INFO] Finished at: 2015-07-28T19:25:44+07:00
[INFO] Final Memory: 12M/150M
[INFO] ------------------------------------------------------------------------

Sekian tutorial belajar spring dan Terima kasih :). Untuk source code lengkap, penulis publish di Belajar Spring.

Perkembangan teknologi sangat pesat hingga menghasilkan berbagai teknologi. Diantaranya adalah berkembangannya bahasa pemrograman javascript. Javascript biasanya hanya berkerja pada bagian front end sebuah project akan tetapi pada hari ini, javascript telah dapat bekerja di bagian back end (server side) sebuah project. Javascript yang dapat jalan pada bagian server side adalah node js.

Node JS adalah sebuah platform software yang dipakai untuk membangun aplikasi – aplikasi serverside yang fleksibel di sebuah network / jaringan. Node.js menggunakan JavaScript sebagai bahasa pemrogaman dan dapat dengan mudah menghasilkan throughput / pemrosesan tingkat tinggi melalui non-blocking I/O. Node.js memiliki fitur built-in HTTP server library yang menjadikannya mampu menjadi sebuah web server tanpa bantuan software lainnya seperti Apache atau Nginx.

Node js pertama kali dibuat oleh Ryan Dahl pada tahun 2009 yang kemudian berkembang pesat di bawah licensi Open Source MIT oleh sebuah perusahaan bernama Joyent Inc. Pada hakikatnya Node js dikembangkan berdasarkan teknologi Google V8 JavaScript engine serta berisi kompilasi skrip inti dan banyak modul siap pakai yang bermanfaat sehingga pengguna (dalam hal ini web developer) tidak perlu melakukan coding dan mendesain segalanya dari awal.

Berbagai framework juga muncul pada perkembangan node js diantaranya adalah

• express
• sails
• meteor
• Hapi
• Kraken
• Strong Loop
• dan lain - lain

Baiklah kita akan memulai bagaimana instalasi node js pada linux. Sebelum melakukan install node js, anda diwajibkan untuk melakukan instalasi version control git. Bagi yang belum melakukan instalasi git, silahkan lihat di tutorial belajar git. Yang perlu diperhatikan pada langkah instalasi node js adalah

• Clone NVM
• Instalasi dan konfigurasi Node JS
• Latihan Sekilas Tentang Node JS

Clone NVM

Langkah selanjutnya adalah melakukan instalasi NVM. Jika pada instalasi ruby kita mengenal dengan RVM(ruby version manager) maka pada node js juga terdapat NVM(node version manager). Bedanya adalah pada NVM kita harus melakukan clone repository NVM dengan menggunakan version control git. Untuk melakukan clone, jalankan perintah berikut.

git clone https://github.com/creationix/nvm.git ~/.nvm && cd ~/.nvm && git checkout `git describe --abbrev=0 --tags`

NVM telah di clone pada folder .nvm, untuk melihat folder tersebut pada linux, kita harus tampilkan terlebih dahulu dengan perintah ctrl + H dikarenakan folder tersebut bersifat hidden.

Instalasi dan konfigurasi Node JS

Kemudian kita akan melakukan PATH terhadap nvm. Jalankan perintah berikut.

sudo gedit /etc/environment

kemudian masukkan variabel berikut pada bagian atas.

NVM_HOME=/home/rizki/.nvm

Sesuaikan dengan directory anda. Kemudian tambahkan pada bagian PATH seperti ini.

PATH="/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin:/usr/games:/usr/local/games:/usr/lib/jvm/java-8-oracle/bin:/home/rizki/programming/build-tool/apache-maven/bin::/home/rizki/.rvm/bin:/home/rizki/.nvm"

Kemudian masuk ke folder .nvm dengan perintah

cd ~/.nvm/

kemudian jalankan perintah berikut untuk inisialisasi script nvm pada .bashrc

chmod a+x install.sh
./install.sh

Kemudian restart komputer anda dan lakukan pengecekan nvm dengan perintah.

nvm --version

Jika berhasil, kita akan melakukan instalasi node js dengan perintah.

nvm install stable

tunggu hingga proses download node js selesai. Node js yang di download adalah versi yang paling stable. Untuk mengecek versi node js dapat menggunakan perintah.

nvm list-remote

sedangkan jika ingin melihat list node js yang telah diinstall di pc dengan perintah.

nvm list

Untuk menghapus node js yang lama dapat dengan menggunakan perintah.

nvm uninstall versi yang mw di uninstall

contohnya seperti

nvm uninstall v0.12.6

Untuk mengaktifkan node js yang paling stable maka gunakan perintah berikut.

nvm alias default stable

lakukan pengecekan node js pada terminal dengan perintah.

node --version
npm --version

Latihan Sekilas Tentang Node JS

Setelah perjalanan panjang instalasi node js, kita mulai belajar sedikit bagaimana menggunakan node js :D. Buatlah sebuah folder untuk project kita, jika lewat terminal dengan perintah mkdir BelajarNodeJS. Kemudian buat sebuah file javascript dengan nama app.js, kemudian masukkan codingan berikut.

var http = require('http');

http.createServer(function (req, res) {
  res.writeHead(200, {'Content-Type': 'text/plain'});
  res.end('Hello World\n');
}).listen(3000, '127.0.0.1');

console.log('Server running at http://127.0.0.1:3000/');

Sintak diatas berfungsi untuk membuat sebuah server, kemudian kita menampilkan tulisan hello word pada saat user melakukan akses pada http://127.0.0.1:3000/ atau http://localhost:3000/. Untuk menjalankan servernya dengan perintah.

node app.js

Instalasi Nodemon

Untuk mempermudah pengembangan aplikasi, kita membutuhkan server yang bisa autoreload ketika developer mengubah source code. Salah satu tool yang mendukung tersebut adalah dengan menggunakan Nodemon. Untuk melakukan instalasi cukup dengan menggunakan perintah.

npm install -g nodemon

perintah -g berarti bersifat global. Kemudian untuk menjalankan source code tadi hanya dengan menggunakan perintah.

nodemon app.js

Salah satu kelebihan nodemon adalah dapat menjalankan source code dalam bentuk coffee script dan terdapat fitur autoreload server. Coba anda ganti source code tanpa mematikan server, kemudian di save maka nodemon akan melakukan reload server.

Instalasi Bower

Bower merupakan sebuah tool yang digunakan untuk melakukan manajemen kelengkapan library web seperti js, css dan img. Bower mirip dengan npm, bedanya adalah npm lebih di khususkan untuk manajemen kelengkapan library javascript. Baiklah untuk melakukan instalasi bower dapat dilakukan dengan perintah.

npm install -g bower

Sekian tutorial tentang instalasi perlengkapan coding node js, semoga bermanfaat dan terima kasih :).