diff --git a/README.md b/README.md index 18315c9..49175ce 100644 --- a/README.md +++ b/README.md @@ -27,7 +27,17 @@ $ npm install $ npm run dev ``` -**Note:** In dev mode this project comes with re-frame-10x. You can hit `Ctrl + h` to display the overlay and have a time traveling debugger. +### Editor integration + +Integrating shadow-cljs with your editor helps tremendously with development. After having run `npm run dev` as described above you can connect to the REPL and get features like in-editor code execution and code completion / documentation lookup. For further information see [this part of the shadow-cljs user guide](https://shadow-cljs.github.io/docs/UsersGuide.html#_editor_integration), which contains instructions for Emacs, Atom, VSCode and other editors. Make sure to open `localhost:8080` in the browser to execute ClojureScript code. + +### re-frame-10x + +re-frame-10x is a debugger that is bundled with the app in development mode. Once you have the build running, hit `Ctrl + h` and the re-frame-10x window will show up: + +![re-frame-10x in action](./docs/re-frame-10x.png) + +It provides you with tools to inspect the state of the application, undo and replay events, debug performance issues and more. ## Tests diff --git a/docs/re-frame-10x.png b/docs/re-frame-10x.png new file mode 100644 index 0000000..e91e2e3 Binary files /dev/null and b/docs/re-frame-10x.png differ diff --git a/package.json b/package.json index 5786ab5..fcdcb68 100644 --- a/package.json +++ b/package.json @@ -13,7 +13,7 @@ "dev:cljs": "shadow-cljs watch app test", "dev:sass": "npm run build:sass; node-sass -w src/sass/app.sass public/app/style.css", "dev:test": "karma start --reporters growl,progress --auto-watch", - "dev": "npm-run-all copy:* test:compile -p dev:*", + "dev": "npm-run-all copy:* -p dev:*", "test": "run-s test:compile test:run", "test:compile": "shadow-cljs compile test", "test:run": "karma start --single-run"