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 :).

Tutorial kali ini akan membahas tentang salah satu framework ruby yaitu ruby on rails atau sering disebut dengan ROR. Banyak yang mengambil struktur project dari ruby on rails beberapa diantaranya seperti play framework (scala/java), Spring Roo (java) dan sails (node js). Salah satu kelebihan ruby on rails adalah framework ini sudah support dengan teknologi ORM, untuk penjelasan ORM ada di tutorial belajar hibernate. Tidak hanya fitur ORM, akan tetapi framework ini dilengkapi dengan dokumentasi yang lengkap serta komunitas framework yang paling banyak di dalam bahasa pemrograman ruby. Baiklah lets coding ruby with ruby on rails :D.

Instalasi Ruby On Rails

Untuk melakukan instalasi ruby on rails, kita menggunakan gem. Bagi yang belum melakukan instalasi ruby, dapat dilihat pada tutorial instalasi ruby. Gem ini ibarat NPM di dalam node js. Bingung dengan NPM ? pada tutorial selanjutnya akan ada postingan tentang node js. Untuk melakukan instalasi ruby on rails pada linux jalankan perintah berikut.

gem install rails

tunggu hingga instalasi selesai, biasanya memakan waktu sedikit dikarenakan butuh banyak dependency dan jangan lupa hidupakan internet anda.

Generate Project Ruby On Rails

Untuk membuat project Ruby On rails sangatlah gampang, jalankan perintah berikut.

rails new Belajar-RubyOnRails

Perintah diatas akan membuat sebuah project dengan nama projectnya Belajar-RubyOnRails. Setelah membuat project, selanjutnya kita mendownload dependency yang dibutuhkan oleh project kita. Masuk ke folder project atau root project lalu jalankan perintah berikut.

bundle install

untuk mengupdate library juga dapat dilakukan dengan perintah.

bundle update

Untuk menjalankan aplikasinya, jalankan perintah rails server maka server rails akan jalan pada port 3000. Buka browser lalu hit pada localhost:3000. Berikut gambar ketika server dijalankan.

Screenshot from 2015-07-25 22:14:15.png

Oke sekilas kita telah dapat menggunakan ruby on rails, kita akan memulai dengan basic CRUD pada ror.

ror merupakan salah satu framework yang bersifat mvc, maka kita membutuhkan view, controller dan model. kita akan mulai dari controller. ror menyediakan fitur scaffolding sehingga kita dapat generate controller melalui terminal. jalankan perintah berikut.

rails generate controller bukus index

Pada tutorial ini, kita akan menggunakan contoh data buku. Oke selanjutnya adalah memasukkan library twitter bootstrap ke project, kita akan menggunakan gem, buka file Gemfile pada root project dan sisipkan sintak.

gem 'bootstrap-sass', '~> 3.3.5.1'
gem 'autoprefixer-rails'

Setiap tambah atau ganti gem maka jangan lupa lakukan update dengan perintah bundle install atau bundle update. Buka file application.css yang ada dalam folder app/assets/stylesheets, ganti nama file tersebut dengan application.css.sass. Kemudian import library bootstrap ke dalam file application.css.sass dengan sintak.

@import "bootstrap-sprockets"
@import "bootstrap"

Bootstrap juga punya library dalam bentuk javascript maka kita butuh import juga ke javascript. Buka file application.js pada folder app/assets/javascripts dan sisipkan.

//= require bootstrap-sprockets

Untuk mengecek bootstrap maka buka file index.html.erb pada folder app/views/bukus Kemudian sisipkan sintak berikut.

<button class="btn btn-default">cek</button>

Silahkan jalankan server kembali, untuk melihat urlnya ada di file routes.rb di dalam folder config. Secara default, urlnya berada pada http://localhost:3000/bukus/index. Jika anda ingin melihat routes semua url maka gunakan perintah rake routes.

Oke kita akan memulai generate model, untuk generate model jalankan perintah berikut.

rails generate model buku idBuku:string judulBuku:string namaPengarang:string penerbit:string tahunTerbit:integer

Perintah diatas akan membuat sebuah file ruby dengan nama buku. untuk idBuku, judulBuku, namaPengarang, penerbit dan tahunTerbit merupakan kolom pada basis data yang akan digenerate nantinya. Jika ingin melihat strukturnya ada pada folder db/migrate. Untuk membuat tabel pada basis data silahkan jalankan perintah rake db:migrate.

Setelah berhasil dengan model, kita lanjut untuk membuat konfigurasi controllernya. Buka file bukus_controller.rb yang ada di dalam folder app/controllers, Kemudian masukkan sintak berikut.

class BukusController < ApplicationController

  def index
    @bukus = Buku.all
  end

  def show
    @buku = Buku.find(params[:id])
  end

  def new
    @buku = Buku.new
  end

  def create
    @buku = Buku.new(buku_params)

    if @buku.save
      redirect_to bukus_path
    else
      render 'new'
    end

  end

  def edit
    @buku = Buku.find(params[:id])
  end

  def update
    @buku = Buku.find(params[:id])

    if @buku.update(buku_params)
      redirect_to bukus_path
    else
      render 'edit'
    end

  end

  def destroy
    @buku = Buku.find(params[:id])
    @buku.destroy
    redirect_to bukus_path
  end

  private
    def buku_params
      params.require(:buku).permit(:idBuku, :judulBuku, :namaPengarang, :penerbit, :tahunTerbit)
    end

end

Penulis akan menjelaskan beberapa fungsi sintak diatas.

  • fungsi dari def adalah untuk mendeklarasikan sebuah function atau fungsi pada ruby.
  • @bukus merupakan variabel yang diisi dengan nilai data seluruh buku. Data tersebut diperoleh dari Buku.all.
  • Pada bagian method show kita akan menampilkan 1 object saja. Untuk mengambil object berdasarkan id maka kita gunakan sintak Buku.find(params[:id]).
  • Method new berfungsi untuk redirect page baru sekalian membuat sebuah object baru.
  • Method create berfungsi untuk melakukan penyimpanan data pada basis data. Jika data telah tersimpan maka akan dilakukan redirect ke index page.
  • Method edit sama seperti method new hanya saja, method edit mengambil berdasarkan id tanpa membuat object baru.
  • Method Update sama seperti method create, berbeda pada saat melakukan pengambilan object berdasarkan id.
  • Method destroy berfungsi untuk menghapus data. Dilakukan pengambilan object terlebih dahulu baru dilakukan penghapusan data.

Lumayan panjang juga, oke lanjut ke bagian view. View pada ror dapat melakukan import antar page, kita akan membuat default page terlebih dahulu, dimulai dari _navigation.erb.

<nav class="navbar navbar-default">
  <div class="container-fluid">
    <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#js-navbar-collapse">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="/">
        Belajar Ruby On Rails
      </a>
    </div>

    <!-- Collect the nav links, forms, and other content for toggling -->
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
      <ul class="nav navbar-nav">
        <li class="active"><a href="/">Home</a></li>
      </ul>
    </div>
  </div>
</nav>

diatas adalah codingan untuk navigator sebuah web aja. selanjutnya kita membuat sebuah form, buat sebuah file _form.erb lalu masukkan sintak berikut.

<div class="container">
  <div class="row">
    <%= form_for(@buku) do |buku| %>

        <div class="form-group">
          <%= buku.label :ID_Buku %>
          <%= buku.text_field :idBuku, class:'form-control', type: 'text', placeholder: 'ID Buku' %>
        </div>

        <div class="form-group">
          <%= buku.label :Judul_Buku %>
          <%= buku.text_field :judulBuku, class:'form-control', type: 'text', placeholder: 'Judul Buku' %>
        </div>

        <div class="form-group">
          <%= buku.label :Nama_Pengarang %>
          <%= buku.text_field :namaPengarang, class:'form-control', type: 'text', placeholder: 'Nama Pengarang' %>
        </div>

        <div class="form-group">
          <%= buku.label :Penerbit %>
          <%= buku.text_field :penerbit, class:'form-control', type: 'text', placeholder: 'Penerbit' %>
        </div>

        <div class="form-group">
          <%= buku.label :Tahun_Terbit %>
          <%= buku.text_field :tahunTerbit, class:'form-control', type: 'number', placeholder: 'Tahun Terbit' %>
        </div>

        <%= buku.submit :Save, class:'btn btn-success' %>

    <% end %>
  </div>
</div>

Berikut adalah penjelasan tentang codingan diatas.

  • <%= form_for(@buku) do |buku| %> merupakan sintak ruby, sintak ini berfungsi untuk melakukan render sebuah object @buku yang telah di deklarasikan pada controller.
  • <%= buku.label :ID_Buku %> berfungsi sebagai label
  • <%= buku.text_field :idBuku %> berfungsi sebagai text field yang nantinya dapat diinput oleh user.
  • <%= buku.submit :Save %> berfungsi sebagai button agar dapat disubmit.

Buatlah file new.html.erb dan edit.html.erb di dalam folder app/views/bukus kemudian masukkan sintak.

<%= render 'navigation' %>

<%= render 'form' %>

Codingan diatas berfungsi untuk melakukan render terhadap page navigation dan form yang telah kita buat tadi atau bahasa kerennya kita include pagenya. Oke selanjutnya kita akan membuat sebuah page detail. Sama seperti tadi buat sebuah file show.html.erb dan masukkan kodingan berikut.

<%= render 'navigation' %>

<div class="container">
  <div class="row">
    <%= form_for(@buku) do |buku| %>

        <div class="form-group">
          <%= buku.label :ID_Buku %>
          <%= buku.text_field :idBuku, class:'form-control', type: 'text', placeholder: 'ID Buku', disabled: true %>
        </div>

        <div class="form-group">
          <%= buku.label :Judul_Buku %>
          <%= buku.text_field :judulBuku, class:'form-control', type: 'text', placeholder: 'Judul Buku', disabled: true %>
        </div>

        <div class="form-group">
          <%= buku.label :Nama_Pengarang %>
          <%= buku.text_field :namaPengarang, class:'form-control', type: 'text', placeholder: 'Nama Pengarang', disabled: true %>
        </div>

        <div class="form-group">
          <%= buku.label :Penerbit %>
          <%= buku.text_field :penerbit, class:'form-control', type: 'text', placeholder: 'Penerbit', disabled: true %>
        </div>

        <div class="form-group">
          <%= buku.label :Tahun_Terbit %>
          <%= buku.text_field :tahunTerbit, class:'form-control', type: 'number', placeholder: 'Tahun Terbit', disabled: true %>
        </div>

    <% end %>
  </div>
</div>

Codingan tersebut sama seperti dengan form pada page new dan edit hanya berbeda pada setiap text field akan disable berikut perintah disable ada di disabled: true. Dan yang terakhir adalah file index.html.erb merupakan page awal yang akan berisi tentang data. Masukkan codingan berikut.

<%= render 'navigation' %>

<div class="container">
  <div class="row">
    <%= link_to 'Tambah Data', new_buku_path, class: 'btn btn-default' %>
    <p></p>
    <table class="table table-bordered table-hover table-responsive">
      <thead>
      <tr>
        <th class="text-center">Id Buku</th>
        <th class="text-center">Judul Buku</th>
        <th class="text-center">Nama Pengarang</th>
        <th class="text-center">Penerbit</th>
        <th class="text-center">Tahun Terbit</th>
        <th class="text-center">Aksi</th>
      </tr>
      </thead>
      <tbody>
      <% @bukus.each do |buku| %>
          <tr>
            <td><%= buku.idBuku %></td>
            <td><%= buku.judulBuku %></td>
            <td><%= buku.namaPengarang %></td>
            <td><%= buku.penerbit %></td>
            <td><%= buku.tahunTerbit %></td>
            <td class="text-center">
              <%= link_to 'Detail', buku_path(buku), class: 'btn btn-default' %>
              <%= link_to 'Edit', edit_buku_path(buku), class: 'btn btn-success' %>
              <%= link_to 'Delete',buku_path(buku), method: :delete, data: {confirm: 'Data Dihapus ? '}, class: 'btn btn-danger' %>
            </td>
          </tr>
      <% end %>
      </tbody>
    </table>
  </div>
</div>

Sedikit penjelasan dari codingan diatas.

  • <%= link_to 'Tambah Data' %> berfungsi sebagai button tambah data yang akan melakukan redirect page ke new page.
  • @bukus.each do |buku| berfungsi untuk melakukan render data pada tabel html. @bukus merupakan variabel yang terdapat di controller yang berisi data - data buku.
  • <%= buku.idBuku %> berfungsi untuk menampilkan data yang berbentuk array ke dalam tabel - tabel html.
  • <%= link_to 'Detail' %> merupakan sebuah button detail untuk menampilkan detail data.
  • <%= link_to 'Edit' %> merupakan sebuah button edit untuk redirect ke page edit.
  • <%= link_to 'Delete' %> meruapkan sebuah button delete untuk menghapus data. sebelum menghapus akan ada muncuk tampilan info validasi penghapusan data.

Akhirnya selesai juga, sekarang kita lakukan testing Berikut tampilan halaman awalnya.

Screenshot from 2015-07-27 11:14:10

Tampilan form untuk insert data baru

Screenshot from 2015-07-27 11:14:00.png

Tampilan detail data buku

Screenshot from 2015-07-27 11:14:14.png

Tampilan delete data buku

Screenshot from 2015-07-27 11:14:34.png

Sekian tutorial belajar Ruby On Rails dan Terima kasih :). Untuk source code lengkap, penulis publish di Belajar Ruby On Rails.

Zaman sekarang banyak banget blog yang ditawarkan dalam bantuk cms seperti blogspot, wordpress dan sebagainya. Akan tetapi ada salah satu tool yang dapat kita gunakan untuk membuat blog tanpa menggunakan cms yaitu Jekyll.

Jekyll merupakan sebuah tool yang disediakan untuk membuat sebuah blog.

Halaman blog pada jekyll dibuat dengan format markdown. Markdown adalah sebuah bentuk file yang biasanya digunakan untuk format penulisan. Markdown ditemukan oleh John Gruber. Jekyll ini menyediakan format penulisan markdown yang nantinya akan di convert ke html. Kita akan memulai membuat blog, berikut adalah tahap - tahapanya.

  • Instalasi ruby, tutorial instalasi ruby jika anda belum melakukan instalasi ruby.
  • Instalasi jekyll
  • Generate sebuah blog dengan jekyll
  • Hosting blog ke github page

Instalasi Jekyll

Instalasi jekyll sangat lah mudah, buka terminal atau tekan ctrl + T lalu jalankan perintah gem install jekyll. Jangan lupa hubungkan ke jaringan internet dan tunggu hingga instalasi selesai.

Generate Blog Dengan Jekyll

Jekyll memiliki fitur scaffolding untuk mengenerate sebuah blog. Jalankan perintah jekyll new NamaBlogAnda, kali ini penulis membuat blog dengan nama BelajarJekyll, sesuaikan dengan nama blog anda. Jika penulisan jalankan maka perintahnya menjadi jekyll new BelajarJekyll. Masuk ke root folder lalu jalankan servernya dengan perintah jekyll serve lalu hit ke browser pada http://127.0.0.1:4000/. Berikut adalah gambar ketika server dijalankan.

Screenshot from 2015-07-27 14:36:26.png

Sekilas telah berjalan dengan baik, oke mari kita custom sedikit dengan cara menambah tulisan atau mengedit tulisan tersebut. Untuk editornya bebas tapi penulis memberi saran agar menggunakan editor atom karena terdapat fitur preview markdown. Jika sudah, maka buka project blognya dengan menggunakan editor atom.

Berikut point penting untuk melakukan konfigurasi pada jekyll.

  • file _config.yml berfungsi sebagai tempat konfigurasi nama blog, user dan sebagainya. Buka dan di dalamnya terdapat tulisan title dengan isian Your awesome title, ganti tulisan tersebut dengan BelajarJekyll lalu restart servernya, lihatlah perubahannya.
  • folder _posts merupakan folder yang berisikan file markdown yang nanti akan di convert ke html. Ada beberapa template yang menggunakan bantuan octopress sehingga mempermudah pembuatan halaman markdown. Untuk template tersebut silahkan anda cari di google.
  • folder _layouts berisi file html yang menjadi format penulisan markdown.
  • folder _includes berisi file html yang merupakan file yang bisa di include ke page lainnya seperti header, footer dan sebagainya.
  • folder _site meruapakan folder yang berisi hasil generate atau build blog.

Buka folder _posts lalu buat sebuah file dengan nama 2015-07-27-belajar-jekyll.markdown. Biasanya filenya akan dibuat sesuai dengan tanggal kapan kita akan melakukan posting sebuah artikel. Kemudian masukkan beberapa kata seperti berikut.

---
layout: post
title:  "Belajar Jekyll"
date:   2015-07-27 14:58:10
categories: jekyll update
---

Hello..., Saya sedang belajar membuat blog dengan jekyll.

Oke jalankan server lagi, lalu lihat perubahannya, akan ada 1 posting dengan judul belajar jekyll. Markdown juga menyediakan sintak highlight jika nantinya kita ingin melakukan posting dengan menggunakan sintak pemrograman. Penulis akan memberi contoh, masukkan sintak berikut ke dalam file yang tadi dibuat tepatnya dibawah tulisan

Hello..., Saya sedang belajar membuat blog dengan jekyll

Kira - kira hasilnya seperti ini.

---
layout: post
title:  "Belajar Jekyll"
date:   2015-07-27 14:58:10
categories: jekyll update
---

Hello..., Saya sedang belajar membuat blog dengan jekyll.

{% highlight java %}

public class BelajarJekyll {
  public static void main(String[]args) {
    System.out.println("Hello..., Belajar Jekyll");
  }
}

{% endhighlight %}

Simpan dan langsung cek di browser maka akan tampil sintak highlight. Berikut adalah list sintak untuk highlight berbagai bahasa pemrograman.

  • Cucumber (‘*.feature’)
  • abap (‘*.abap’)
  • ada (‘.adb’, ‘.ads’, ‘*.ada’)
  • ahk (‘.ahk’, ‘.ahkl’)
  • apacheconf (‘.htaccess’, ‘apache.conf’, ‘apache2.conf’)
  • applescript (‘*.applescript’)
  • as (‘*.as’)
  • as3 (‘*.as’)
  • asy (‘*.asy’)
  • bash (‘.sh’, ‘.ksh’, ‘.bash’, ‘.ebuild’, ‘*.eclass’)
  • bat (‘.bat’, ‘.cmd’)
  • befunge (‘*.befunge’)
  • blitzmax (‘*.bmx’)
  • boo (‘*.boo’)
  • brainfuck (‘.bf’, ‘.b’)
  • c (‘.c’, ‘.h’)
  • cfm (‘.cfm’, ‘.cfml’, ‘*.cfc’)
  • cheetah (‘.tmpl’, ‘.spt’)
  • cl (‘.cl’, ‘.lisp’, ‘*.el’)
  • clojure (‘.clj’, ‘.cljs’)
  • cmake (‘*.cmake’, ‘CMakeLists.txt’)
  • coffeescript (‘*.coffee’)
  • console (‘*.sh-session’)
  • control (‘control’)
  • cpp (‘.cpp’, ‘.hpp’, ‘.c++’, ‘.h++’, ‘.cc’, ‘.hh’, ‘.cxx’, ‘.hxx’, ‘*.pde’)
  • csharp (‘*.cs’)
  • css (‘*.css’)
  • cython (‘.pyx’, ‘.pxd’, ‘*.pxi’)
  • d (‘.d’, ‘.di’)
  • delphi (‘*.pas’)
  • diff (‘.diff’, ‘.patch’)
  • dpatch (‘.dpatch’, ‘.darcspatch’)
  • duel (‘.duel’, ‘.jbst’)
  • dylan (‘.dylan’, ‘.dyl’)
  • erb (‘*.erb’)
  • erl (‘*.erl-sh’)
  • erlang (‘.erl’, ‘.hrl’)
  • evoque (‘*.evoque’)
  • factor (‘*.factor’)
  • felix (‘.flx’, ‘.flxh’)
  • fortran (‘.f’, ‘.f90’)
  • gas (‘.s’, ‘.S’)
  • genshi (‘*.kid’)
  • glsl (‘.vert’, ‘.frag’, ‘*.geo’)
  • gnuplot (‘.plot’, ‘.plt’)
  • go (‘*.go’)
  • groff (‘.(1234567)’, ‘.man’)
  • haml (‘*.haml’)
  • haskell (‘*.hs’)
  • html (‘.html’, ‘.htm’, ‘.xhtml’, ‘.xslt’)
  • hx (‘*.hx’)
  • hybris (‘.hy’, ‘.hyb’)
  • ini (‘.ini’, ‘.cfg’)
  • io (‘*.io’)
  • ioke (‘*.ik’)
  • irc (‘*.weechatlog’)
  • jade (‘*.jade’)
  • java (‘*.java’)
  • js (‘*.js’)
  • jsp (‘*.jsp’)
  • lhs (‘*.lhs’)
  • llvm (‘*.ll’)
  • logtalk (‘*.lgt’)
  • lua (‘.lua’, ‘.wlua’)
  • make (‘.mak’, ‘Makefile’, ‘makefile’, ‘Makefile.’, ‘GNUmakefile’)
  • mako (‘*.mao’)
  • maql (‘*.maql’)
  • mason (‘.mhtml’, ‘.mc’, ‘*.mi’, ‘autohandler’, ‘dhandler’)
  • modelica (‘*.mo’)
  • modula2 (‘.def’, ‘.mod’)
  • moocode (‘*.moo’)
  • mupad (‘*.mu’)
  • mxml (‘*.mxml’)
  • myghty (‘*.myt’, ‘autodelegate’)
  • nasm (‘.asm’, ‘.ASM’)
  • newspeak (‘*.ns2’)
  • objdump (‘*.objdump’)
  • objectivec (‘*.m’)
  • objectivej (‘*.j’)
  • ocaml (‘.ml’, ‘.mli’, ‘.mll’, ‘.mly’)
  • ooc (‘*.ooc’)
  • perl (‘.pl’, ‘.pm’)
  • php (‘.php’, ‘.php(345)’)
  • postscript (‘.ps’, ‘.eps’)
  • pot (‘.pot’, ‘.po’)
  • pov (‘.pov’, ‘.inc’)
  • prolog (‘.prolog’, ‘.pro’, ‘*.pl’)
  • properties (‘*.properties’)
  • protobuf (‘*.proto’)
  • py3tb (‘*.py3tb’)
  • pytb (‘*.pytb’)
  • python (‘.py’, ‘.pyw’, ‘.sc’, ‘SConstruct’, ‘SConscript’, ‘.tac’)
  • rb (‘.rb’, ‘.rbw’, ‘Rakefile’, ‘.rake’, ‘.gemspec’, ‘.rbx’, ‘.duby’)
  • rconsole (‘*.Rout’)
  • rebol (‘.r’, ‘.r3’)
  • redcode (‘*.cw’)
  • rhtml (‘*.rhtml’)
  • rst (‘.rst’, ‘.rest’)
  • sass (‘*.sass’)
  • scala (‘*.scala’)
  • scaml (‘*.scaml’)
  • scheme (‘*.scm’)
  • scss (‘*.scss’)
  • smalltalk (‘*.st’)
  • smarty (‘*.tpl’)
  • sourceslist (‘sources.list’)
  • splus (‘.S’, ‘.R’)
  • sql (‘*.sql’)
  • sqlite3 (‘*.sqlite3-console’)
  • squidconf (‘squid.conf’)
  • ssp (‘*.ssp’)
  • tcl (‘*.tcl’)
  • tcsh (‘.tcsh’, ‘.csh’)
  • tex (‘.tex’, ‘.aux’, ‘*.toc’)
  • text (‘*.txt’)
  • v (‘.v’, ‘.sv’)
  • vala (‘.vala’, ‘.vapi’)
  • vbnet (‘.vb’, ‘.bas’)
  • velocity (‘.vm’, ‘.fhtml’)
  • vim (‘*.vim’, ‘.vimrc’)
  • xml (‘.xml’, ‘.xsl’, ‘.rss’, ‘.xslt’, ‘.xsd’, ‘.wsdl’)
  • xquery (‘.xqy’, ‘.xquery’)
  • xslt (‘.xsl’, ‘.xslt’)
  • yaml (‘.yaml’, ‘.yml’)

cara penggunaanya adalah ganti pada bagian kata java.

{% highlight java %}

{% endhighlight %}

, misalnya kita ingin menggunakan coffeescript maka ganti menjadi

{% highlight coffeescript %}

{% endhighlight %}

lihat aturan diatas dan sesuaikan dengan ektensi masing - masing file.

Hosting blog ke github page

Github page merupakan salah satu hosting gratis. Salah satu kelebihannya adalah kita dapat menggunakan jekyll pada github page tersebut. Bagi yang terbiasa dengan menggunakan version control git maka tidak lah susah untuk melakukan deploy ke github page, tidak seperti melakukan deploy ke open shift yang memerlukan banyak konfigurasi. Untuk melakukan deploy web, anda hanya perlu melakukan.

  • Instalasi dan konfigurasi git. Bagi yang belum melakukannya dapat dilihat pada tutorial Belajar Git.
  • Buat repository baru dengan username akun anda seperti ini username.github.io, contohnya adalah RizkiMufrizal.github.io.
  • clone repository tersebut dan copy semua file jekyll ke project
  • kemudian lakukan add dengan perintah git add --all
  • kemudian lakukan commit dengan perintah git commit -m "Initial Website"
  • dan yang terakhir lakukan push dengan perintah git push origin master

Setelah selesai, anda dapat mengakses web anda pada http://username.github.io/. Demikian tutorial singkat untuk membuat blog dengan menggunakan jekyll dan terima kasih :).

Untuk kerja team sebuah project, kita butuh tool untuk melakukan manajemen project. Dahulu biasanya penulis menggunakan svn untuk version control system (VCS), kali ini kita akan menggunakan teknologi baru dari version control system (VCS) yaitu git.

Version Control System (VCS) adalah sebuah sistem yang dapat mencatat setiap perubahan dari sebuah file sedangkan git merupakan salah satu contoh version control system yang diciptakan oleh linus torvalds yang dulunya digunakan untuk memanajemen project kernel linux.

Oke kita langsung mulai melakukan konfigurasi git pada linux. Berikut tahapan yang harus diperhatikan.

  • Instalasi git dan Buat akun github.
  • Konfigurasi git
  • Buat repository baru dan belajar commit
  • Penjelasan Gitignore

Instalasi Git dan Buat Akun Github

Tambahkan repository PPA pada linux lewat terminal.

sudo add-apt-repository ppa:git-core/ppa

lalu lakukan update

sudo apt-get update

dan terakhir install git

sudo apt-get install git

Instalasi selesai, lalu silahkan bagi yang belum membuat akun, anda dapat melakukan registrasi di Github. Github ini merupakan sebuah sebuah media social bagi developer, disana kita dapat melakukan upload project, berbagi project dan sebagainya.

Konfigurasi Git

Setelah tahap instalasi, selanjutnya kita akan melakukan konfigurasi git. Konfigurasi pertama yaitu melakukan setting global konfigurasi pada git. Jalankan perintah berikut.

git config --global user.name "RizkiMufrizal"
git config --global user.email "mufrizalrizki@gmail.com"
git config --global color.ui true

Jangan lupa sesuaikan dengan identitas anda. Langkah selanjutnya adalah kita akan mengenerate ssh key yang nantinya kita butuhkan untuk di upload ke github. ssh key ini menggunakan algoritma rsa sehingga dia mempunyai public dan private key. Untuk mengenerate ssh tersebut jalankan perintah berikut.

ssh-keygen -t rsa -C "mufrizalrizki@gmail.com"

Oke selanjutnya kita akan melakukan copy dari isi ssh tersebut untuk github. Install terlebih dahulu xclip dengan perintah.

sudo apt-get install xclip

kemudian copy file ssh dengan perintah

xclip -sel clip < ~/.ssh/id_rsa.pub

Login ke akun gihub, lalu pilih menu setting pilih ssh key kemudian tambahkan ssh yang tadi kita copykan.

Kemudian untuk mengecek apakah ssh nya telah berhasil maka lakukan perintah berikut.

ssh -T git@github.com

Jika berhasil maka akan tampil seperti dibawah ini.

Hi Rizki Mufrizal! You've successfully authenticated, but Github does not provide shell access

Buat repository baru dan belajar commit

Untuk membuat repository di gitub, silahkan anda login dan buat sebuah repository. Penulis membuat repository dengan nama Belajar-Git Jika sudah, anda dapat melakukan clone repository atau melakukan remote repository tersebut pada komputer anda.

Melakukan Clone dan commit project

Untuk melakukan clone repsitory sangat gampang. Pada bagian repository yang ada di github terdapat bagian url yang dapat kita copy yaitu ada pada bagian ini.

Screenshot from 2015-07-27 21:06:12.png

Lalu copy dan clone dengan perintah

git clone https://github.com/RizkiMufrizal/Belajar-Git.git

Sesuaikan dengan repository anda. Kemudian buat sebuah file, disini penulis membuat sebuah file dengan nama index.md kemudian masukkan tulisan hello word. Kemudian kita dapat melakukan pengecekan status git dengan perintah git status dan akan muncul.

On branch master

Initial commit

Untracked files:
  (use "git add <file>..." to include in what will be committed)

	index.md

nothing added to commit but untracked files present (use "git add" to track)

Menandakan bahwa file tersebut belum di add dan di commit. Lakukan add file tersebut dengan perintah git add index.md kemudian cek status lagi maka akan muncul.

On branch master

Initial commit

Changes to be committed:
  (use "git rm --cached <file>..." to unstage)

	new file:   index.md

Tahap selanjutnya lakukan commit dengan perintah git commit -m "Tambah file index.md". Message atau pesan tersebut dapat diganti sesuia dengan keinginan anda. Kemudian upload semua file tersebut ke github dengan cara menggunakan perintah git push origin master, git akan meminta username dan password anda. Jika telah selesai, lihat repository github anda, dan disana telah terdapat file index.md.

Melakukan Remote dan commit project

Untuk melakuakn remote sebuah project tidak jauh berbeda dengan clone sebuah project. Setelah membuat project pada github kemudian anda buat sebuah folder sesuai dengan nama project anda di github. Kemudian masuk ke root project dan lakukan inisialisasi git dengan perintah git init. Tahap selanjutnya anda lakukan remote dengan perintah

git remote add origin https://github.com/RizkiMufrizal/Belajar-Git.git

Setelah selesai, anda download dulu source code yang sudah ada di github dengan perintah git pull origin master maka akan muncul file index.md. Untuk melakukan commit dan push sama seperti perintah sebelumnya.

Penjelasan Gitignore

Gitignore merupakan sebuah file yang berfungsi untuk mendeklarasikan file - file apa saja yang tidak akan di commit. File gitignore biasanya ditulis dengan nama .gitignore, file ini bersifat hidden sehingga untuk menampilkannya, kita harus melakukan perintah ctrl + H. Misalnya jika kita membuat project java dengan menggunakan maven, maka akan muncul folder target yang berisi kompalasi program maka folder tersebut kita daftarkan pada gitignore sehingga tidak akan di commit. Untuk mengetahui file apa saja yang yang di daftarkan pada gitignore untuk setiap bahasa pemrograman, anda dapat melihatnya di repository gitignore.

Sekian tutorial Belajar Git, Semoga bermanfaat dan terima kasih :).

Sebelumnya kita pernah membahas tentang bagaimana instalasi java pada linux. Kali ini penulis akan menjelaskan bagaimana instalasi ruby pada linux.

Ruby adalah bahasa pemrograman dinamis berbasis skrip yang berorientasi obyek. Tujuan dari ruby adalah menggabungkan kelebihan dari semua bahasa-bahasa pemrograman skrip yang ada di dunia. Ruby ditulis dengan bahasa pemrograman C dengan kemampuan dasar seperti Perl dan Python.

Ruby juga memiliki berbagai framework diantaranya adalah

  • Ruby On Rails (ROR)
  • Sinatra
  • Lotus
  • Padrino
  • Nyny
  • Grape
  • Nancy
  • dan lain - lain

Baiklah untuk melakukan instalasi ruby pada linux, kita menggunakan RVM (ruby version manager). Berikut adalah tahapan untuk melakukan instalasi ruby pada linux.

Buka terminal lalu install public key terlebih dahulu dengan perintah

gpg --keyserver hkp://keys.gnupg.net --recv-keys 409B6B1796C275462A1703113804BB82D39DC0E3

Lalu kita melakukan instalasi ruby yang paling stable dengan perintah

\curl -sSL https://get.rvm.io | bash -s stable --ruby

Kemudian lakukan path pada linux, buka file environment dengan sintak sudo gedit /etc/environment. kemudian masukkan sintak RVM_HOME=/home/rizki/.rvm dan pada bagian PATH masukkan /home/rizki/.rvm/bin, jangan lupa sesuaikan dengan folder anda.

Restart komputer dan cek versi rvm, ruby dan gem dengan perintah

rvm --version
ruby --version
gem --version

Jika anda ingin mengubah versi ruby menjadi versi yang lain, silahkan lakukan perintah berikut untuk mengahapus default ruby yang digunakan.

rvm reset

Kemudian silahkan jalankan perintah berikut untuk memilih ruby yang akan anda gunakan.

rvm alias create default {versi ruby}

berikut adalah contohnya

rvm alias create default 2.3.0

Jika sudah, maka tahap selanjutnya adalah install bundler. Bundler ini sendiri berfungsi untuk mendownload dependency library yang dibutuhkan oleh project kita nantinya. Bedanya bundler dengan gem yaitu gem hanya sebagai penentu dari versi library yang akan kita gunakan sedangkan bundler akan mendownload semua kepentingan dari project dan akan memeriksa apakah sebuah library mempunyai missing dengan library yang lainnya. install bundler dengan perintah.

gem install bundler

kemudian cek versi bundler dengan perintah

bundler --version

Untuk melihat versi ruby yang telah diinstall di pc maka perintahnya

rvm list

jika ingin mengetahui versi release ruby dengan perintah

rvm list known

Untuk menggunakan interpreter ruby dapat dengan menggunakan perintah irb pada terminal. Selanjutnya untuk IDE ruby, penulis menggunakan ruby mine dari produknya jetbrains. Anda dapat menggunakan IDE selain dar ruby mine tapi penulis menyarankan menggunakan ruby mine dikarenakan karena kelangkapan dari fitur ruby mine seperti auto complete, support framework ruby on rails. Download terlebih dahulu di ruby mine. ekstrak pada folder tertentu, beri akses eksekusi pada file rubymine.sh pada folder bin, kemudian jalankan dengan perintah ./rubymine.sh. Secara otomatis IDE tersebut akan membuat shortcut pada linux anda.

Sekian tutorial kali ini dan selamat coding ruby. Terima kasih :).