Skip to content

Instantly share code, notes, and snippets.

@pandeiro
Last active June 2, 2020 08:02
Show Gist options
  • Star 9 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save pandeiro/c5d2728bd04aab4f31c3 to your computer and use it in GitHub Desktop.
Save pandeiro/c5d2728bd04aab4f31c3 to your computer and use it in GitHub Desktop.
Example of a simple webapp written as a single file

Instructions

  1. Get Boot
  2. Copy the above file to $HOME/app.boot
  3. $ chmod a+x $HOME/app.boot
  4. $ cd && ./app.boot
#!/usr/bin/env boot
(print "Loading dependencies... ")
(set-env! :dependencies '[[pandeiro/agua "0.1.0"]])
(require '[agua.core :refer [defhtml defcss defcljs serve]])
(println "done.")
;;
;; HTML page: expects three %s for css, prerendered html and js
;;
(defhtml page
[:head
[:meta {:charset "utf-8"}]
[:title "My App"]
[:style "%s"]]
[:body
[:div#root "%s"]
[:footer "Copyright 2015 you"]
[:script "%s"]])
;;
;; CSS
;;
(defcss styles
[:*
{:box-sizing "border-box"}]
[:body
{:padding "36px"
:background "black"
:color "lightgray"
:text-align "center"}]
[:h1
{:color "white"}]
[:input
{:font-size "24px"
:background "rgb(20,20,20)"
:border "solid 1px white"
:font-style "italic"
:padding "12px"
:color "rgb(150,150,150)"
:border-radius "8px"}]
[:footer
{:position "fixed"
:bottom 0
:left 0
:width "100%"
:padding "8px"
:font-family "monospace"}])
;;
;; ClojureScript
;;
(defcljs app
(ns app.core
(:require [reagent.core :as r]))
(def state
(r/atom
{:person "person"}))
(defn- person-val [e]
(or (not-empty (.-value (.-target e))) "person"))
(defn main [state]
[:div
[:h1 (str "Hello, " (:person @state))]
(when js/document
[:input
{:placeholder "Name, please"
:on-change #(swap! state assoc :person (person-val %))}])])
(defn not-found []
[:div
[:h1 (str "404: '" js/location.pathname "' wasn't found.")]])
(defn router []
(condp re-find js/location.pathname
#"^/$" [main state]
[not-found]))
(if js/document
(r/render [router] (.getElementById js/document "root"))
(r/render-to-string [router])))
(defn -main [& args]
(serve {:html page, :css styles, :app app}))
@ccfontes
Copy link

This is so sexy 👍

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment