Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/pitch-io/uix
Idiomatic ClojureScript interface to modern React.js
https://github.com/pitch-io/uix
clojure clojurescript react
Last synced: 3 months ago
JSON representation
Idiomatic ClojureScript interface to modern React.js
- Host: GitHub
- URL: https://github.com/pitch-io/uix
- Owner: pitch-io
- License: epl-2.0
- Fork: true (roman01la/uix)
- Created: 2021-09-03T14:05:56.000Z (over 3 years ago)
- Default Branch: master
- Last Pushed: 2024-11-06T20:28:03.000Z (3 months ago)
- Last Synced: 2024-11-06T21:28:59.306Z (3 months ago)
- Topics: clojure, clojurescript, react
- Language: Clojure
- Homepage: https://github.com/pitch-io/uix?tab=readme-ov-file#docs
- Size: 3.25 MB
- Stars: 373
- Watchers: 6
- Forks: 21
- Open Issues: 4
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Funding: .github/FUNDING.yml
- License: LICENSE.md
Awesome Lists containing this project
README
_Idiomatic ClojureScript interface to modern React.js_
> "Oh god, I just started learning reagent. Don’t tell me I’ll have to switch" /r/clojure
- API compatibility: React v18.3.1
- UIx v1 is in [roman01la/uix](https://github.com/roman01la/uix) repo
- Discuss at #uix on [Clojurians Slack](http://clojurians.net)
- [A slide deck explaining UIx and migration path from Reagent](https://pitch.com/public/821ed924-6fe6-4ce7-9d75-a63f1ee3c61f)
- [Talk about UIx at London Clojurians meetup](https://www.youtube.com/watch?v=4vgrLHsD0-I)
[](https://circleci.com/gh/pitch-io/uix)
[](https://clojars.org/com.pitch/uix.core)
[](https://clojars.org/com.pitch/uix.dom)
## Installation
```
npm install [email protected] [email protected] --save-dev
```
```clj
{:deps {com.pitch/uix.core {:mvn/version "1.1.1"}
com.pitch/uix.dom {:mvn/version "1.1.1"}}}
```
### How to start a new project with UIx
- Run `npx create-uix-app@latest my-app` to scaffold a new project
- Clone starter template manually from [pitch-io/uix-starter](https://github.com/pitch-io/uix-starter)
## Usage
```clj
(ns my.app
(:require [uix.core :refer [defui $]]
[uix.dom]))
(defui button [{:keys [on-click children]}]
($ :button.btn {:on-click on-click}
children))
(defui app []
(let [[state set-state!] (uix.core/use-state 0)]
($ :<>
($ button {:on-click #(set-state! dec)} "-")
($ :span state)
($ button {:on-click #(set-state! inc)} "+"))))
(defonce root
(uix.dom/create-root (js/document.getElementById "root")))
(uix.dom/render-root ($ app) root)
```
## Docs
- [What is UIx?](docs/what-is-uix.md)
- [Components](docs/components.md)
- [Elements](docs/elements.md)
- [Hooks](docs/hooks.md)
- [State](docs/state.md)
- [Effects](docs/effects.md)
- [Props validation](docs/props-validation.md)
- [Interop with React](docs/interop-with-react.md)
- [Interop with Reagent](docs/interop-with-reagent.md)
- [Code-splitting and React.lazy](docs/code-splitting.md)
- [Migrating from Reagent](docs/migrating-from-reagent.md)
- [Server-side rendering](docs/server-side-rendering.md)
- [Hot reloading](docs/hot-reloading.md)
- [React DevTools](docs/react-devtools.md)
- [Code linting](docs/code-linting.md)
- [Differences from Reagent](docs/differences-from-reagent.md)
- [Utilities](docs/utilities.md)
- [Examples](/core/dev/uix/examples.cljs)
- [Internals](docs/internals.md)
- Other render targets
- [React Native](/docs/react-native.md)
- [React Three Fiber](/docs/react-three-fiber.md)
- [Getting help from ChatGPT](/docs/chat-gpt.md)
## Testing
```
scripts/test
```
_Note: to ensure you're using the right Node.js version, you can use [nvm](https://github.com/nvm-sh/nvm) and run `nvm use`
once in the directory. Otherwise the Node.js version you use is in the `.nvmrc` file. See nvm repo for more documentation._
## Publishing
1. Update version in core/release.edn, dom/release.edn and in README.md
2. Update docs if needed
3. Update CHANGELOG.md
4. Publish both `core` and `dom` packages to Clojars
```
cd core && CLOJARS_PASSWORD={YOUR_CLOJARS_TOKEN} clj -A:release --skip-tag
cd dom && CLOJARS_PASSWORD={YOUR_CLOJARS_TOKEN} clj -A:release --skip-tag
```
## Who's using UIx?
- [Pitch](https://pitch.com/)
- [Pitch iOS app](https://apps.apple.com/us/app/pitch-collaborate-on-decks/id1551335606?platform=iphone)
- [Cognician](https://info.cognician.com/)
- [Multiply](https://multiply.co/)
- [Totcal](https://totcal.com/)
- [ClojureScript Studio](https://www.clojurescript.studio/)
- [Ogres, virtual tabletop](https://ogres.app/)
- [ShipClojure](https://www.shipclojure.com/)
- [Metosin](https://www.metosin.fi/en)
## Thanks to
- [UIx v1](https://github.com/roman01la/uix) for initial set of ideas and learnings
- [Helix](https://github.com/lilactown/helix) for even more ideas
- [Pitch](https://github.com/pitch-io) for sponsoring and dogfooding the work