Owlet是一系列基於網絡的自導活動,旨在通過創造性探索來學習技術技能。這些幻燈片解釋了該項目的動機。

使用Luminus版本2.9.11.68生成
lein run
lein figwheel
lein auto sassc once
導航到http:// localhost:3000/
確保您擁有Java開發套件的最新版本。如果沒有,請從Oracle下載頁面下載安裝程序。選擇最新版本的面板頂部的接受許可協議,然後單擊平台的文件名,例如JDK-8U112-MACOSX-X64.DMG 。轉到您的下載文件夾,打開.dmg文件,然後按照說明進行操作。要驗證,請在終端中輸入java -version 。您應該看到以下內容:
java version "1.8.0_112"
Java(TM) SE Runtime Environment (build 1.8.0_112-b16)
Java HotSpot(TM) 64-Bit Server VM (build 25.112-b16, mixed mode)
請注意版本(在這種情況下為“ 112”)如何匹配您下載的文件。
您還需要係統上安裝的命令行實用程序git , lein和rlwrap 。在Mac上,獲得它們的最簡單方法是首先安裝Hommerbrew,然後在終端命令行中執行此操作:
brew install git leiningen rlwrap
最後,SASSC編譯器
brew install sassc
現在,要將Owlet代碼複製到您的計算機上,請首先將cd轉到您想要的Owlet目錄的位置,然後克隆此存儲庫:
git clone https://github.com/codefordenver/owlet.git
現在,如果您這樣做ls ,則應該看到一個新的目錄, owlet 。去那裡:
cd owlet
要在此項目上工作,您真正需要的只是終端,瀏覽器和任何文本編輯器。但是,在Jetbrain的Intellij Idea中使用草書插件有很多話要說。由於它了解您的代碼的不同部分及其依賴關係如何共同連接,因此您可以進行代碼重構,智能代碼完成,一鍵式導航到可變定義,立即查看Docstrings,並捕獲Arity和拼寫錯誤。最重要的是,您可以在開箱即用,您可以運行知道您的代碼的rint - e v rint- l oop(repl)。快速嘗試您的現場直播,在REPP的命令行中運行代碼,將少量更改加載到REPL,切換名稱空間或運行單元測試中 - 所有這些都只需幾個擊鍵。
要開始使用Intellij Idea和Cursive,請按照草書安裝說明進行操作。然後導入現有的Leiningen項目,即Owlet。
要配置連接到運行應用程序的草案重錄,我們需要創建一個運行/調試配置。
打開Intellij,然後選擇菜單項運行 - >編輯配置...
單擊左上方的+按鈕,然後選擇Clojure Repl 。
選擇遙控器。
在名稱字段中輸入名稱(例如, Owlet nRepl )。
選擇“單選”按鈕使用Leiningen Repl端口。
取消選中底部激活工具窗口的框。
單擊“確定”按鈕以保存您的替補配置。
現在,假設您在終端中啟動了一個Clojure NREPL(請參閱上面的應用程序),則可以隨時從草書中插入:
轉到運行 - >運行... ,然後選擇您的replip配置(上面稱為“ Owlet Nrepl”)。將會出現一個新的草書式啟動工具窗口。您應該立即在“臥式”窗口中看到這一點:
Connecting to remote nREPL server...
Clojure 1.8.0
現在,我們已連接到clojure nrepl,通過評估供應工具窗口底部的文本框中的以下clojure代碼來創建一個clojurescript rept:
(figwheel-sidecar.repl-api/cljs-repl)
您應該看到這樣的輸出:
...
Prompt will show when Figwheel connects to your application
To quit, type: :cljs/quit
=> nil
現在,由於我們只是“插入”到同一figwheel服務器,因此,當您修改並保存.cljs文件時,FigWheel會注意到並自動重新加載它。從REPL中,您可以在該應用程序運行時控制該應用程序,因為您正在實時應用程序中評估代碼。另外,您可以訪問與編輯器交互的草書REPL工具,例如:
將repl ns切換到當前文件
加載文件中的文件
在商標之前發送表格
在當前NS中運行測試
添加新的repl命令
例如,一個好主意是添加您自己的repl命令以評估上面的cljs-repl代碼。有了一個替補窗口後,選擇工具 - > repl->添加新的repl命令。給您的命令一個名稱,選擇“執行單元”按鈕,然後以上輸入(figwheel-sidecar.repl-api/cljs-repl)如上所述。選擇特定項目的複選框和確定。然後,為了輕鬆訪問,您可以在Intellij Idea->首選項中定義選擇的鍵盤快捷鍵...-> KeyMap 。
運行script/figwheel-repl.sh後,一個Clojure NREPL正在運行,您可以“插入”以獲得另一個clojure repl,然後是另一個clojurescript repl,類似於我們在草書中的做法類似:
確認您的NREPL由script/figwheel-repl.sh啟動,仍在運行。
從終端運行以下命令:
lein repl :connect
現在,您應該使用提示, owlet.server=> clojure repl。
與草書一樣,請在提示下輸入以下Clojure代碼:
(figwheel-sidecar.repl-api/cljs-repl)
您應該看到這樣的輸出:
...
To quit, type: :cljs/quit
nil
cljs.user=>
有了一些額外的設置,您可以使用令人驚嘆的Dirac Devtools瀏覽器調試環境來處理Owlet。您仍將使用FigWheel運行該應用程序,因此修改後的文件仍將自動編譯和加載,但是瀏覽器替補將在Dirac中運行。瀏覽器上的狄拉克環境實際上是一個鍍鉻擴展,由定制的Chrome Devtools組成,Chrome DevTools是Chrome內置的JavaScript調試工具。但是,它利用僅由最新版本的Chrome DevTools提供的功能,這就是為什麼需要Chrome Chrome的Chrome。
如果上面啟動的script/figwheel-repl.sh進程正在運行,請停止它(Control-D)。
下載並安裝桌面應用程序,Google Chrome Canary。
如果您打開它,請退出Chrome Canary。
在終端中,確保當前的工作目錄仍然是包含此readme.md文件的一個。
在命令行,運行
script/start-chrome-canary.sh
您會看到一個空的Chrome窗口,其中帶有位置http:// localhost:3000/。它是空的,因為我們還沒有啟動Owlet Server。
順便說一句,此命令是每當您使用Dirac在Owlet上工作時,您都需要如何啟動瀏覽器。見下文。
安裝Dirac DevTools擴展名,允許其訪問您的數據。您應該在窗口中的地址欄的右側看到一個綠色圖標。
由於您使用上面的腳本啟動Chrome Canary,因此該擴展名實際上將保存在Directory
.dirac-chrome-profile/,因此安裝它或更改某些設置不會影響(也不會受到)您在正常啟動時可能具有的任何現有設置或擴展的影響(也不會受到影響),請雙重敲擊Chrome或Chrome Cany Icon。
現在,Chrome Canary和Dirac DevTools擴展名已在Owlet Project目錄中本地安裝,讓我們將其與Owlet一起使用。
在終端中,確保當前的工作目錄仍然是包含此readme.md文件的一個。
如上所述,使用FigWheel啟動應用程序,但是這次使用--dirac選項:
script/figwheel-repl.sh dirac
當您看到以下內容時,NREPL已經啟動,Dirac Server正在等待瀏覽器客戶端:
...
owlet.server=>
Dirac Agent v0.8.8
Connected to nREPL server at nrepl://localhost:8230.
Agent is accepting connections at ws://localhost:8231.
如果Chrome Canary尚未運行,請在單獨的終端窗口中運行以下操作開始:
script/start-chrome-canary.sh
現在,您應該看到彈出的窗口中運行的Owlet應用程序。
一旦以這種方式啟動Chrome Canary,即使您重新啟動Owlet應用程序和REPL,也可以將其打開。與往常一樣,您可以使用View->“強制重新加載此頁面” (命令檔R)清潔應用程序。
單擊Dirac DevTools工具欄圖標。 Dirac DevTools控制台窗口應出現。請注意有關在clojurescript和JavaScript repls之間切換的說明(Control-)。如果您看到錯誤消息“ CLJS DevTools:某些自定義格式化器未渲染”,則只需查看 - > force Reload此頁面(Command-Shift-r)即可。
儘管您可能習慣於輸入命令option-i,但不要!請勿打開常規的Chrome Devtools。
在“控制台”選項卡中嘗試使用良好的repl,並查看括號如何自動平衡,箭頭鍵將您帶到臥室歷史記錄中,符號在您輸入時完成,輸出是顏色的EDN數據(不是模糊的JS對象),將數據結構顯示為可折疊的小部件,以巧妙地節省空間,等等!
也要嘗試調試器。它的工作方式就像Chrome DevTools調試器一樣,除了源代碼既是Clojurescript,又是它所編制的JavaScript。在“源”選項卡中,向下鑽至頂部 - > localhost:4000-> js/commied-> out ,單擊owlet .cljs感興趣的文件,然後設置一個斷點,當您在應用程序的GUI中執行某些操作時,將會被擊中。當應用在斷點停止時,請查看調試器範圍部分中的當前變量。然後返回“控制台”選項卡,輸入clojurescript表單中。它們將在斷點的上下文中進行評估。單擊簡歷按鈕或鍵F8以讓應用程序繼續。
有了Dirac,您不必放棄草書。正如我們在上面的Figwheel Cljs Repl連接時一樣,我們可以與Dirac Repl連接。
如果您在草書中運行了一個DEPL,請通過單擊其工具欄中的X來停止它。
轉到運行 - >運行... ,然後選擇上面創建的reppor配置,就像以前一樣,您應該立即在窗口中看到此內容:
Connecting to remote nREPL server...
Clojure 1.8.0
現在,像以前一樣,我們連接到了Clojure NREPL,但是這次我們將連接到Dirac Clojurescript Repl。在“ Repl工具”窗口底部的文本框中評估以下Clojure代碼:
(dirac! :join)
您應該看到這樣的輸出:
...
Your current nREPL session is a joined Dirac session (ClojureScript) which targets 'the most recent Dirac session'
...
To quit, type: :cljs/quit
=> nil
如上所述,最好添加新的repl命令並定義鍵盤快捷鍵以為您輸入(dirac! :join)命令。
您可以像我們在Figwheel Repl上一樣與Dirac Repl連接,只有很小的差異。當然,首先要確保您從script/figwheel-repl.sh dirac開始的過程仍在運行,然後只需按照上面的說明,直到最後一步。相反,這樣做:
與草書一樣,請在提示下輸入以下Clojure代碼:
(dirac! :join)
您應該看到這樣的輸出:
...
To quit, type: :cljs/quit
nil
cljs.user=>
當您在Dirac Clojurescript Repl中評估表達式時,將在終端或=>式窗口中顯示結果,如所預期。但是,僅在Dirac Devtools控制台中顯示諸如印刷輸出或異常堆棧痕蹟之類的副作用。這可能會令人困惑,尤其是如果您插入了打印聲明,而您什麼也看不到,或者您沒有意識到某些事情破裂,因為您看不到例外!您需要查看Dirac Devtools控制台。控制台將鏡像您輸入的表達式,其結果和任何印刷的副作用。因此,只需將Chrome Canary和Dirac Devtools窗戶方便地放在附近。
ISC許可證
丹佛和貢獻者的版權(C)代碼
特此允許使用,複製,修改和/或分發此軟件,如果有或無需任何費用,就可以授予上述版權通知和此許可通知,以所有副本出現在所有副本中。
該軟件是“原樣”提供的,作者對此軟件不明權,包括所有隱含的適銷性和健身保證。在任何情況下,作者均不應對任何特殊,直接,間接或結果損害賠償,或任何因使用或與本軟件的使用或績效有關的合同,疏忽或其他侵權訴訟所造成的任何損害,無論是在合同,疏忽還是其他侵權訴訟中造成的任何損害。