Miral Achmed
Author of achmiral.id, FPV Drone Racing Pilot, Rubyist, Currently Student at AMIKOM Yogyakarta

Aplikasi CRUD Sederhana Menggunakan Sinatra dan Postgresql [Part 4] END

Aplikasi CRUD Sederhana Menggunakan Sinatra dan Postgresql [Part 4] END

Halo teman-teman sebelum weekend, yuk belajar bareng membuat Aplikasi CRUD Sederhana Menggunakan Sinatra dan Postgresql

Di part 3 kita sudah belajar bagaimana cara menambahkan fungsi CRUD dan view pada aplikasi kita. Di part 4 atau part terakhir ini, kita akan belajar bagaimana mempublish aplikasi sinatra kita ke heroku agar bisa di akses secara online.

Sedekar informasi buat teman-teman yang baru berkunjung di blog ini. Tulisan ini terdiri dari 4 part, berikut ini daftar setiap part nya:

Sebelum kita mulai belajar, pastikan struktur direktori projek aplikasi sinatra teman-teman sama seperti gambar di bawah ini ya. Kalau belum sama silahkan membaca kembali part-part sebelumnya, kemungkinan ada langkah yang terlewatkan.

Struktur Direktori

Untuk teman-teman yang belum memiliki akun heroku, teman-teman bisa mengklik link registrasi disini.

Kalau teman-teman sudah selesai registrasi akun heroku, kita bisa mulai belajarnya.

Pertama-tama teman-teman harus menginstall program heroku-cli di komputer teman-teman, agar kita bisa menjalankan perintah-perintah heroku melalui terminal.

Kalau sudah terinstall teman-teman bisa mengeceknya dengan menggunakan perintah.

  $ heroku -v

Jika berhasil terinstall maka akan tampil seperti berikut.

Struktur Direktori

Ada beberapa persiapan yang perlu kita lakukan agar bisa mempublish aplikasi sinatra kita ke heroku.

Di heroku aplikasi ruby berbasis web dikenali sebagai aplikasi berbasis rack atau rack based application.

Untuk menjalankan aplikasi sinatra atau aplikasi berbasis rack di heroku, kita perlu membuat sebuah file bernama config.ru.

Pada root direktori project aplikasi sinatra kita, buatlah sebuah file baru bernama config.ru, kemudian tambahkan kode berikut ini

# config.ru

require './app'

run Sinatra::Application

Kita dapat mencoba menjalankan aplikasi berbasis rack kita secara local dengan perintah berikut.

  $ rackup -p 3000

Maka akan tampil seperti berikut ini.

Struktur Direktori

Bisa dilihat bahwa output dari perintah tersebut terlihat mirip dengan output perintah berikut ini.

  $ ruby app.rb -p 3000

Struktur Direktori

Aplikasi sinatra kita bisa dijalankan dengan menggunakan perintah ruby app.rb -p 3000 maupun rackup -p 3000, tetapi pada heroku kita akan menggunakan rackup.

Selanjutnya kita buat file baru bernama Procfile, file ini berisi perintah yang akan di eksekusi oleh heroku untuk menlajankan aplikasi kita.

# Procfile

web: bundle exec rackup config.ru -p $PORT

Setelah itu pada terminal teman-teman jalankan perintah heroku login, untuk melakukan login ke service heroku melalui terminal.

Ketika berhasil login kemudian jalankan perintah berikut ini untuk membuat sebuah app baru pada akun heroku teman-teman.

  $ heroku create simple-crud-sinatra-postgresql

simple-crud-sinatra-postgresql merupakan nama dari aplikasi sinatra kita di heroku. Jika berhasil maka akan tampil seperti gambar berikut.

Struktur Direktori

Kemudian kita commit project kita ke git, dengan menggunakan perintah berikut.

  $ git add -A
  $ git commit -  m "Perisapan publish heroku"

Seperti yang ditunjukkan oleh gambar berikut.

Struktur Direktori

Selanjutnya kita upload projek kita ke heroku dengan menggunakan perintah berikut.

  $ git push heroku master

Kita tunggu sampai aplikasi sinatra kita berhasil di upload ke heroku, seperti berikut.

Ketika sudah berhasil di upload, teman-teman bisa mengakses alamat yang diberikan oleh heroku yakni https://simple-crud-sinatra-postgresql.herokuapp.com/. Kita juga bisa mengakses alamat tersebut dengan menggunakan perintah berikut.

  $ heroku open

Maka akan secara otomatis membuka browser dan mengakses alamat aplikasi sinatra kita yang berada di heroku, seperti gambar berikut.

Live app

Ketika kita mengakses path /posts, akan tampil internal server error. Ini terjadi karena database untuk aplikasi sinatra kita belum dibuat. Untuk membuat database kita menggunakan perintah berikut.

  $ heroku run rake db:migrate

Jika berhasil maka akan tampil seperti pada gambar dibawah ini.

Live app

Kemudian kita coba refresh halaman /posts sebelumnya, maka akan tampil tabel kosong, karena kita belum menambahkan post. Seperti gambar berikut ini.

Live app

Kita dapat menambahkan post dengan mengakses /posts/new. Pada input title kita ketikkan “Greeting” dan pada input content kita ketikkan “Hello World!”, seperti pada gambar berikut ini.

Live app

Kemudian klik tombol create post, jika berhasil dibuat maka akan diredirect ke halaman /posts, seperti pada gambar berikut.

Live app

Selanjutnya kita coba menambahkan satu post lagi dengan title “Salam” dan content “Halo Dunia!”. Maka ketika mengakses halaman /posts akan tampil seperti berikut ini.

Live app

Kita akan coba menghapus post pertama dengan mengklik tombol delete. Jika berhasil terhapus maka akan tampil seperti berikut ini.

Live app

Selanjutkan kita coba untuk mengedit post yang tersisa. Caranya, kita klik pada bagian title agar kita berpindah ke halaman detail post, kemudian kita klik tombol edit. Maka akan tampil sebagai berikut.

Live app

Kemudian klik tombol edit post, jika berhasil maka akan diredirect ke halaman /posts/:id dan akan tampil sebagai berikut.

Live app

Jika kita kembali ke halaman /posts akan tampil sebagai berikut.

Live app

Yeaayy, selamat teman-teman kita telah berhasil mempublish aplikasi sinatra kita ke heroku.

Terima kasih teman-teman yang sudah meluangkan waktunya untuk belajar bersama saya di seri tutorial membuat Aplikasi CRUD Sederhana Menggunakan Sinatra dan Postgresql ini, semoga bisa bermanfaat buat teman-teman.

Jangan lupa dilike facebook fanpage blog ini disini, agar tidak ketinggalan tulisan-tulisan berikutnya.

Salam Rubyist!!

comments powered by Disqus