Tweet
Tweet

Slide 1

Slide 1 text

Word Penne

Slide 2

Slide 2 text

Word Penne • WEB application for Flashcards • ClojureScript • Firebase

Slide 3

Slide 3 text

Demo

Slide 4

Slide 4 text

Tech • Shadow-cljs ... Build tools • Reagent, re-frame ... React • Bidi ... Router • Stylefy ... CSS in CLJS • Fork ... Form management • malli ... Spec and validation • Cypress ... E2E test • Firebase Emulators ... Emulators for using Firebase on localhost

Slide 5

Slide 5 text

You can use shadow-cljs and npm in combination. Shadow-cljs Useful build tools

Slide 6

Slide 6 text

• Popular • Useful • Documents • View -> Dispatch -> Event -> State -> Subscriptions • Interceptors Reagent, re-frame React wrapper and Flowing

Slide 7

Slide 7 text

Validate args Interceptors Specs by malli

Slide 8

Slide 8 text

No content

Slide 9

Slide 9 text

• clojure.spec • easy to write • readable error messages malli Data-driven Schemas for Clojure/Script

Slide 10

Slide 10 text

Shadow-cljs and css shadow-cljs don't support building css You can't import css files on cljs files Solutions • CSS in CLJS (Stylefy) • Tailwind CSS

Slide 11

Slide 11 text

Stylefy

Slide 12

Slide 12 text

Firebase • I used firebase npm package. I didn't use wrappers • Firebase Emulators is usable • Preview channels in Firebase Hosting are usable

Slide 13

Slide 13 text

Cypress

Slide 14

Slide 14 text

Tech • Shadow-cljs ... Build tools • Reagent, re-frame ... React • Bidi ... Router • Stylefy ... CSS in CLJS • Fork ... Form management • malli ... Spec and validation • Cypress ... E2E test • Firebase Emulators ... Emulators for using Firebase on localhost