Skip to content

Instantly share code, notes, and snippets.

@prestancedesign
Forked from daiyi/re-playground-readme.cljs
Last active December 8, 2020 14:04
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save prestancedesign/29a2c419feed735c1ae75e906dad5a0d to your computer and use it in GitHub Desktop.
Save prestancedesign/29a2c419feed735c1ae75e906dad5a0d to your computer and use it in GitHub Desktop.
Re-frame playground
(ns instructions.core
(:require [reagent.dom :as dom]
[re-frame.core :as re-frame]))
(defn info []
[:div {:style {:max-width 500}}
[:h1 "re-playground"]
[:p "code is livereloaded.
this right-hand panel has the id 'app'.
to render reagent into this panel, target this element with "
[:code "(js/document.getElementById 'app')"]
". see the "
[:a {:href "?gist-id=daiyi/6ca3d5fd72c3d79b3f1e77cb754006b5"} "examples"]
"!"]
[:h2 "load from gist"]
[:p "to easily share re-frame sketches, you can save your code to a "
[:a {:href "https://gist.github.com"} "github gist"]
" and load it into this editor with the url param: "
[:code "gist-id=[github-username]/[gist-id]"]]
[:p "for example: " [:a {:href "?gist-id=daiyi/62db9d22136503a42cbbe5dc5ec0337d"} "?gist-id=daiyi/62db9d22136503a42cbbe5dc5ec0337d"]]])
;; This renders the app to the right-hand panel
(dom/render
[info]
(js/document.getElementById "app"))
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment