Programming

All about programming stuff

by anvie

Karena ada banyak pertanyaan mengenai Reframe dan penggunaannya, dan kebetulan ya saya memang belum membuatkan dokumentasi teknis lengkapnya, maka di sini saya coba menulis sedikit artikel untuk menunjukkan bagaimana kita bisa memanfaatkan Reframe untuk menyelesaikan pekerjaan yang repetitive dan memakan waktu agar menjadi lebih cepat, efisien dan efektif.

Bagi yang belum tahu apa itu Reframe, silahkan baca ini.

“Source” adalah istilah dalam Reframe yang merujuk pada sebuah kode template yang menjadi sumber untuk membangun sebuah proyek baru, source ada dua macam, remote source dan local source, remote source adalah sumber yang asalnya dari internet, bisa dari git repository, sebagai contoh Github, ya saat ini Reframe baru mendukung github.com sebagai basis remote source-nya, kedepannya mungkin Reframe akan mendukung sumber dari jenis repository lainnya seperti Gitlab dan Bitbucket.

Sebagai contoh, apabila kita menjalankan perintah seperti ini:

$ reframe anvie/hello-world

Maka Reframe akan mencoba men-download/pull kode sumber (source) dari repository github.com/anvie/hello-world.rf, postfix rf di belakangnya sebagai penanda bahwa repository itu adalah Reframe source.

Sementara local source adalah template dari sumber lokal di komputer kita, sehingga tanpa internet sekalipun kita bisa buat project baru berbasis pada source yang ada di disk komputer lokal kita. Ini berguna juga bagi orang yang ingin buat source, karena kita perlu melakukan testing dulu di lokal sebelum kita unggah (push) ke Github.

Cara kerja Reframe

Sebenarnya ketika kita mengetikkan perintah reframe anvie/hello-world maka Reframe akan terlebih dahulu memeriksa apakah anvie/hello-world ini ada di komputer lokal, apabila tidak ada maka Reframe akan mencoba pull dari server Github di https://github.com/anvie/hello-world.

Sebagai contoh reframe source yang ada di akun github saya: https://github.com/anvie/hello-world-py.rf , saya bisa menggunakannya dengan cara:

$ reframe anvie/hello-world-py

Itu adalah contoh reframe source untuk membuat web server sederhana menggunakan Python dengan micro framework Flask, contoh tersebut akan saya jadikan sebagai bahan tutorial di artikel ini.

Kembali lagi ke cara kerjanya, ketika Reframe memproses sebuah direktori source maka yang pertama kali akan diproses adalah file Reframe.toml yang ada di pucuk direktori, hal ini karena Reframe.toml berisi konfigurasi yang diperlukan dalam membentuk sebuah proyek baru, file ini berisi beberapa parameter yang dibutuhkan, setiap parameter bisa diinput oleh pengguna.

Contoh sederhana isi dari file Reframe:

[project]
name = "Hello World"
version = "0.1.0"

[ [param] ]
author_name = { ask = "Author name?", default=”Robin” }

[ [param] ]
# without default value means required
author_email = { ask = "Author email?" }

Pada contoh file konfigurasi tersebut ada 2 parameter, satu untuk kebutuhan nama author author_name dan untuk email author author_email, apabila Reframe dijalankan maka akan muncul pada terminal 2 pertanyaan tersebut secara berurutan. Parameter yang tidak memiliki nilai bawaan (default) akan dianggap sebagai parameter wajib, sehingga pengguna harus memasukkan nilainya.

Selanjutnya, reframe akan melakukan pemrosesan setiap file textual dan mengganti beberapa string template dengan parameter yang telah dimasukkan oleh pengguna.

Sebagai contoh di dalam source ada file index.html yang berisi kode berikut:

<head>
    <title>$name$</title>
</head>

Maka setelah diproses oleh Reframe, kode akan menjadi:

<head>
    <title>Aplikasi Keren</title>
</head>

Dengan asumsi bahwa pengguna telah memasukkan "Aplikasi Keren" sebagai nama proyek-nya.

Reframe juga menyediakan beberapa varasi untuk case-nya, adapun variasinya adalah:

  • name_lower_case akan di-render menjadi: aplikasi keren
  • name_snake_case akan di-render menjadi: aplikasi_keren
  • name_kebab_case akan di-render menjadi: aplikasi-keren
  • name_shout_snake_case akan di-render menjadi APLIKASI_KEREN
  • name_upper_case akan di-render menjadi APLIKASI KEREN
  • name_camel_case akan di-render menjadi AplikasiKeren

Reframe juga melakukan perubahan nama direktori/file apabila menggunakan format template, sebagai contoh sebuah direktori reframe source dengan struktur seperti ini:

.
├── $name_snake_case$.py
├── README.md
├── README.template.md
├── Reframe.toml
├── run.sh
└── templates
    ├── index.html
    └── login.html

Akan diproses menjadi:

.
├── README.md
├── aplikasi_keren.py
├── run.sh
└── templates
    ├── index.html
    └── login.html

Bisa dilihat, file $name_snake_case$.py berubah menjadi aplikasi_keren.py, oh ya dan mungkin kalian notice juga kalau file README.template.md menghilang? Itu bukan glitch, tapi memang dibuat demikian, Reframe akan merubah/rename setiap file dengan prefix extension .template.* menjadi tanpa prefix extension, sebagai contoh README.template.md setelah diproses akan menjadi README.md, dan Reframe akan menimpa (overwrite) file apabila telah ada dengan nama yang sama. Kenapa dibuat demikian? Karena agar kita bisa membuat file yang terpisah yang tidak merupakan bagian dari sumber yang perlu diproses, contohnya untuk kebutuhan seperti ini: kita ingin membuat Reframe source yang mana akan kita taruh di github.com, tetapi kita ingin README.md yang tampil menjelaskan tentang untuk apa source reframe itu bukan sebagai bagian dari kode yang bakal menjad file README.md dari project outputnya, hmmm... agak njlimet ya jelasinnya, tapi paham kan? :D

If Conditional

Reframe juga mendukung logika sederhana untuk mengkondisikan isi dari kode, sebagai contoh --aku ambil dari https://github.com/anvie/hello-world-py.rf--:

@app.route("/")
def hello():
    return render_template("index.html", name=CURRENT_USER)

# <% if param.with_auth %>
@app.route('/login', methods=['GET', 'POST'])
def login():
    if request.method == 'POST':
        return do_the_login()
    else:
        return show_the_login_form()
# <% endif %>

Pada contoh kode tersebut terlihat ada semacam komentar berisi sintak kondisi, yakni <% if param.with_auth %>, sintak kondisi (if conditional syntax) tersebut artinya: kode di dalam, antara if hingga <% endif %> hanya dituliskan apabila parameter with_auth bernilai true, selain itu kode tersebut tidak akan dituliskan. Dan ini adalah contoh inputannya:

[ [param] ]
with_auth = { ask = "With authorization mechanism?", default = "true" }

Ketika with_auth berisi true dalam contoh kode di atas true adalah nilai bawaannya (default), maka kode logika login akan dituliskan.

Present

Mirip seperti fitur if conditional, Reframe bisa juga membuat direktori/file bardasarkan kondisi parameter-nya, sebagai contoh konfigurasi Reframe.toml berikut:

[ [present] ]
path = "templates/login.html"
if = "with_auth"

Konfigurasi tersebut membuat Reframe hanya akan membuat file templates/login.html apabila parameter with_auth berisi true (positive). Karena apabila with_auth berisi false itu artinya pengguna tidak membutuhkan halaman login.

Contoh

Saat artikel ini ditulis baru ada 2 reframe source yang sudah bisa digunakan:

Walaupun baru ada 2 reframe source yang ada internet, itupun hanya sebagai contoh, diharapkan 2 contoh itu bisa bermanfaat bagi yang sedang belajar menggunakan Reframe, kedepannya saya janji akan memperbanyak reframe source untuk pekerjaan nyata :). Oia, kontribusi teman-teman juga untuk menambah reframe source sangat diharapkan, sehingga akan membantu banyak programmer lainnya :)

Apabila teman-teman ada yang telah membuat reframe source dan dipublish di github, tolong kabari saya di r@ansvia.com

Thanks!!