• Stars
    star
    293
  • Rank 136,855 (Top 3 %)
  • Language
    Clojure
  • License
    MIT License
  • Created over 4 years ago
  • Updated over 1 year ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Set up a modern CLJS web app by running one command.

Create CLJS App Build Status

Create ClojureScript apps with a single command.
It is focused on making it easy for JS and React developers to get started with ClojureScript.

Create CLJS App works on Windows, Linux, and macOS.
If something doesnโ€™t work, please file an issue.

Heavily inspired on create-react-app. A lot of messages are mostly the same for now (create-react-app maintainers: if that's not ok, let me know).

Quick Overview

npx create-cljs-app my-app
cd my-app
npm start

Then open http://localhost:3000/ to see your app.
When youโ€™re ready to deploy to production, create a minified bundle with npm run build.

Creating an App

Youโ€™ll need to have Node 10.16.0 or later version on your local development machine (but itโ€™s not required on the server). You can use nvm (macOS/Linux) or nvm-windows to easily switch Node versions between different projects.

You'll also need a Java SDK (Version 8+, Hotspot).

To create a new app, you may choose one of the following methods:

npx

npx create-cljs-app my-app

(npx comes with npm 5.2+ and higher)

npm

npm init cljs-app my-app

npm init <initializer> is available in npm 6+

Yarn

yarn create cljs-app my-app

yarn create is available in Yarn 0.25+

It will create a directory called my-app inside the current folder.
Inside that directory, it will generate the initial project structure and install the transitive dependencies:

my-app
โ”œโ”€โ”€ README.md
โ”œโ”€โ”€ package.json
โ”œโ”€โ”€ node_modules
โ”œโ”€โ”€ shadow-cljs.edn
โ”œโ”€โ”€ .gitignore
โ”œโ”€โ”€ public
|  โ”œโ”€โ”€ css
|  |  โ””โ”€โ”€ style.css
|  โ”œโ”€โ”€ index.html
|  โ””โ”€โ”€ favicon.ico
โ””โ”€โ”€ src
   โ”œโ”€โ”€ app
   |  โ”œโ”€โ”€ cards.cljs
   |  โ”œโ”€โ”€ core.cljs
   |  โ”œโ”€โ”€ hello.cljs
   |  โ””โ”€โ”€ hello_cards.cljs       
   โ””โ”€โ”€ e2e
      โ””โ”€โ”€ core.cljs

Once the installation is done, you can open your project folder:

cd my-app

Inside the newly created project, you can run some built-in commands:

npm start or yarn start

Runs the app in the development mode.
Open http://localhost:3000 to view it in the browser. The page will reload if you make edits.

The app uses Reagent, a minimalistic interface between ClojureScript and React.
You can use existing npm React components directly via a interop call.

Builds use Shadow CLJS for maximum compatibility with NPM libraries. You'll need a Java SDK (Version 8+, Hotspot) to use it.
You can import npm libraries using Shadow CLJS. See the user manual for more information.

npm run cards or yarn cards

Runs the interactive live development environment.
You can use it to design, test, and think about parts of your app in isolation.

This environment uses Devcards and React Testing Library.

npm run build or yarn build

Builds the app for production to the public folder.
It correctly bundles all code and optimizes the build for the best performance.

npm test or yarn test, and npm run e2e or yarn e2e

test launches the test runner in the interactive watch mode.
You can use test:once instead to run the tests a single time, and e2e to run end-to-end tests.

See the ClojureScript testing page for more information. E2E tests use Taiko to interact with a headless browser.

npm run lint or yarn lint, and npm run format or yarn format

lint checks the code for known bad code patterns using clj-kondo.

format will format your code in a consistent manner using zprint-clj.

npm run report or yarn report

Make a report of what files contribute to your app size.
Consider code-splitting or using smaller libraries to make your app load faster.

npm run server or yarn server

Starts a Shadow CLJS background server.
This will speed up starting time for other commands that use Shadow CLJS.

License

Create CLJS App is open source software licensed as MIT.

More Repositories

1

angular-quickstart-lib

JavaScript
309
star
2

check-side-effects

Check if importing a given ES module has side effects, and where they come from.
TypeScript
71
star
3

datafire

Persist Datascript databases in Firebase's Firestore.
Clojure
52
star
4

obsidian-babashka

Run Obsidian Clojure(Script) codeblocks in Babashka.
TypeScript
49
star
5

ng-github-actions

Example of using GitHub Actions to test a Angular project
TypeScript
34
star
6

fdb

Reactive database environment for your files.
Clojure
31
star
7

async-interop

Use JS promises with core.async.
Clojure
15
star
8

webpack-rxjs-operators

JavaScript
14
star
9

shadow-cljs-devcards

Clojure
12
star
10

apigility-angular-demo

A simple demo of rapid prototyping of APIs with Apigility and AngularJS
Puppet
10
star
11

terser-performance

JavaScript
8
star
12

rollup-closure-cli

TypeScript
7
star
13

clj-kondo

NPM distribution of https://github.com/borkdude/clj-kondo
JavaScript
6
star
14

roam-to-csv

Convert a Roam Research export to CSV
Clojure
5
star
15

ac-bazel-cli-demo

Python
4
star
16

ivy-bundle-size

HTML
4
star
17

aio-ivy-ve

JavaScript
3
star
18

angular-cli-perf-benchmark

Shell
3
star
19

save-a-selfie-android

Android app for Save-a-Selfie
JavaScript
3
star
20

angular-cli-test-repo

TypeScript
3
star
21

factory-code-location

HTML
3
star
22

architect-app

TypeScript
3
star
23

bazel-windows-docker-container

Dockerfile
2
star
24

pizza-best-practices

2
star
25

rollup-plugin-angular-inline

Angular templateUrl and styleUrls inliner for Rollup.
TypeScript
2
star
26

workspace-project

TypeScript
2
star
27

calva-testing

HTML
2
star
28

node-coz

C
2
star
29

csv-to-json

A simple angular webapp to convert csv to json
JavaScript
2
star
30

self-managed

TypeScript
2
star
31

app-shell-service-worker-app

TypeScript
1
star
32

webpack-angular

JavaScript
1
star
33

ng-packagr-bundle-deps

TypeScript
1
star
34

firebase-rtdb-loglevel

JavaScript
1
star
35

angular-cli-benchmark-app

JavaScript
1
star
36

taskstack

A stack for tasks
CSS
1
star
37

hybrid-app

Angular CLI hybrid app example
TypeScript
1
star
38

one-hundred-tests-proj

TypeScript
1
star
39

hybrid-router-bug

JavaScript
1
star