≡ Menu

How-to paling Cepat Memulai ClojureScript

Tutorial ini diasumsikan memakai mesin mac atau linux, windows menyusul (jika ada request).

1. Install clojure!

Mac

brew install clojure

Linux

curl -O https://download.clojure.org/install/linux-install-1.9.0.381.sh
chmod +x linux-install-1.9.0.381.sh
sudo ./linux-install-1.9.0.381.sh

2. Bikin direktori seperti:

.
├── deps.edn
└── src
    └── app
        └── main.cljs

deps.edn:

{:deps {org.clojure/clojure       {:mvn/version "1.9.0"}
        org.clojure/clojurescript {:mvn/version "1.10.238"}
        reagent                   {:mvn/version "0.8.1"}

*By the way, reagent sebenarnya gak perlu!, di sini saya cuma ingin sekaligus demo gampangnya pake React di ClojureScript

main.cljs:

(ns app.main
  (:require [cljsjs.material-ui]
            [cljsjs.material-ui-svg-icons]
            [reagent.core :as r]))
 
(enable-console-print!)
 
(println "Hello from cljs-main")

2. Run Clojure!:

clj --main cljs.main --watch src --compile app.main --repl

Perintah di atas akan meng-compile namespace app.main ke javascript dan membuka ClojureScript repl. Untuk menutupnya gunakan CMD+D atau CTRL+D. Sampai di sini, seharunya windows baru muncul. Perhatikan dev console, ada log “Hello from cljs-main”.

Tambahkan index.html dengan tag <div id="app"></div> se-level dengan deps.edn, lalu masukan kode di bawah di bagian paling bawah main.cljs.

(r/render [:h1 "Hello ClojureScript!"]
         (js/document.getElementById "app"))

Restart clojure, windows yang muncul selanjutnya akan berubah. Perhatikan, kalau kode [:h1 "Hello ClojureScript!"] adalah JSX react component, yang di wrap dalam tag <h1>.

That’s it!

{ 2 comments… add one }
  • Eurus July 3, 2018, 12:45 pm

    klo bisa sekalian tutorial buat web app bang, buat pemula kaya gw XD

  • Eurus July 3, 2018, 12:38 pm

    windows juga bang, hahaha

Leave a Comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.