https://github.com/borkdude/cljs-showcase
https://github.com/borkdude/cljs-showcase
Last synced: 7 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/borkdude/cljs-showcase
- Owner: borkdude
- Created: 2023-02-26T17:17:26.000Z (almost 3 years ago)
- Default Branch: main
- Last Pushed: 2023-06-24T13:56:17.000Z (over 2 years ago)
- Last Synced: 2025-05-07T10:01:44.538Z (8 months ago)
- Language: Clojure
- Homepage: https://borkdude.github.io/cljs-showcase/
- Size: 38.1 KB
- Stars: 13
- Watchers: 2
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
Awesome Lists containing this project
README
# cljs-showcase
This repository showcases how you can showcase your ClojureScript library and
make it interactive using [SCI](https://github.com/babashka/sci).
To read the interactive version of this markdown file, go [here](https://borkdude.github.io/cljs-showcase).
To add an interactive ClojureScript snippet, you have to surround your code
blocks with a div that has a class `cljs-showcase`, like the one below. You can
add your own styling, of course.
(+ 1 2 3)
Use data attributes to customize behavior:
`data-cljs-showcase-no-editable="true"`
"you can't edit me!"
`data-cljs-showcase-no-eval="true"`
:you-cant-eval-me!
`data-cljs-showcase-no-eval-on-init="true"`
;; I will not evaluate until you trigger it!
(defonce eval-ct (atom 0))
(swap! eval-ct inc)
@eval-ct
Error messages also show up as results:
``` clojure
(require 'foo)
```
Promise values are resolved and their results are shown:
``` clojure
(-> (js/fetch "dude") (.then (fn [v] (.-status v))))
```
To add your own libraries, go to [src/cljs_showcase/core.cljs](https://github.com/borkdude/cljs-showcase/blob/main/src/cljs_showcase/core.cljs)
and use the SCI API to add your ClojureScript namespaces. E.g. to add [medley](https://github.com/weavejester/medley), we run:
``` clojure
(def medley-ns (sci/copy-ns medley.core (sci/create-ns 'medley.core)))
(ctx-store/swap-ctx! sci/merge-opts {:namespaces {'medley.core medley-ns}})
```
After doing so, we can use medley interactively in a codeblock:
``` clojure
(require '[medley.core :as medley])
(medley/index-by :id [{:id 1} {:id 2}])
```
``` clojure
(ns-publics 'medley.core)
```