Clojure.tokyo.descjop
?
1 like?573 views
This document provides instructions for creating a desktop application using the descjop template for Clojure projects. It describes downloading Electron, initializing a new project, building the project for development and production, and packaging the application. The template supports Om and Reagent frameworks and runs on macOS, Windows, and Linux. It allows adding basic menus and shortcuts and outlines future goals like supporting main process figwheel and UI frameworks.
![Add application menu (2)
add code to src/PROJECT_NAME/core.cljs after (part 1)
(def menu-template
(if is-mac
[{:label app-name
:submenu [{:label "Quit."
:accelerator "Command+Q"
:click (fn [] (.quit app))}]}
{:label "Help"
:role "help"
:submenu [{:label "About this mac app"
:accelerator "Command+H"
:click (fn [] (.openExternal Shell "http://descjop.org/"))}]}]
[{:label "Help"
:submenu [{:label "About this windows/linux app"
:accelerator "Control+H"
:click (fn [] (.openExternal Shell "http://descjop.org/"))}]}]))](https://image.slidesharecdn.com/clojure-170703104215/85/Clojure-tokyo-descjop-29-320.jpg)
![Add application menu (3)
add code to src/PROJECT_NAME/core.cljs -main function’s “ready”
(.on app "ready"
(fn []
...
;; menu build
(.setApplicationMenu Menu
(.buildFromTemplate Menu (clj->js menu-template)))
...
))](https://image.slidesharecdn.com/clojure-170703104215/85/Clojure-tokyo-descjop-30-320.jpg)
Clojure.tokyo.descjop
- 1. descjop A Leiningen template for Web based desktop application with Electron 2017/7/3 Clojure.Tokyo
- 2. A Leiningen template for Web based desktop application with Electron ● Open source project ● MIT License ● Stars : 304 http://descjop.org/
- 3. Electron is … https://electron.atom.io/ Build cross platform desktop apps with JavaScript, HTML, and CSS
- 4. Philosophy
- 5. descjop’s Philosophy ● Fun ● Not difficult ● Support All Platforms (Electron supported) ● Quick Start
- 6. Features
- 7. Features ● leiningen project template ○ Minimum project(no use library) ○ Om based project ○ Reagent based project ● Include helper alias ○ init ○ externs ○ build ● Support macOS, Windows, Linux ● Support develop mode (with figwheel) ● Support packaging app
- 8. Quick Start
- 9. Quick Start 1. Create project 2. Init project 3. Make enterns 4. Build project 5. Start figwheel 6. Run!
- 10. Create project
- 11. Create a new descjop project (If not already installed grunt.) Minimum (“”) / om (“+om”) / reagent (“+reagent”) $ lein new descjop PROJECT_NAME +reagent $ npm install -g grunt-cli
- 12. Project directory ● app/ ○ dev/ … development root ○ prod/ … production root ● electron/ … downloaded electron ● src/ … electron main process ● src_front_profile/ ○ PROJECT_NAME ■ dev/ … development env ■ prod/ … production env ● src_front/ … render process ● project.clj
- 13. Init project
- 14. Init project npm install and download electron. init project (for macOS / Linux user) init project (for Windows user) wait a few minutes! $ lein descjop-init $ lein descjop-init-win
- 15. Make externs
- 16. Make externs (if you need externs.) $ lein descjop-externs
- 17. Build project
- 18. Build project production and development mode. // build JavaScript both develop and production mode $ lein descjop-once // build for develop $ lein descjop-once-dev // build for production $ lein descjop-once-prod
- 19. Start figwheel
- 20. Run with figwheel Open other terminal window, before run application. and, Run Application $ lein descjop-figwheel // for Windows $ .electronelectron.exe app/dev // for macOS $ ./electron/Electron.app/Contents/MacOS/Electron app/dev
- 21. Package Project
- 22. Package Project (If not already installed Electron-packager.) Supported Platforms are macOS, Windows 32/64 bit and Linux $ npm install -g electron-packager // for OSX $ lein descjop-uberapp-osx // for windows 64bit app $ descjop-uberapp-win64
- 23. Roadmap
- 24. Roadmap ● add Re-frame template ● add Om-next template ● support main process figwheel ● support some UI frameworks
- 25. Try it!!
- 26. You can use help Help alias $ lein descjop-help
- 27. Practice
- 28. Add application menu (1) add code to src/PROJECT_NAME/core.cljs after `(def app …)` (def is-mac (= (.-platform nodejs/process) "darwin")) (def Menu (.-Menu Electron)) (def Shell (.-shell Electron)) (def app-name (.getName app))
- 29. Add application menu (2) add code to src/PROJECT_NAME/core.cljs after (part 1) (def menu-template (if is-mac [{:label app-name :submenu [{:label "Quit." :accelerator "Command+Q" :click (fn [] (.quit app))}]} {:label "Help" :role "help" :submenu [{:label "About this mac app" :accelerator "Command+H" :click (fn [] (.openExternal Shell "http://descjop.org/"))}]}] [{:label "Help" :submenu [{:label "About this windows/linux app" :accelerator "Control+H" :click (fn [] (.openExternal Shell "http://descjop.org/"))}]}]))
- 30. Add application menu (3) add code to src/PROJECT_NAME/core.cljs -main function’s “ready” (.on app "ready" (fn [] ... ;; menu build (.setApplicationMenu Menu (.buildFromTemplate Menu (clj->js menu-template))) ... ))
- 31. - END - Thank you! 2017/7/3 Clojure.Tokyo