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)代码
特此允许使用,复制,修改和/或分发此软件,如果有或无需任何费用,就可以授予上述版权通知和此许可通知,以所有副本出现在所有副本中。
该软件是“原样”提供的,作者对此软件不明权,包括所有隐含的适销性和健身保证。在任何情况下,作者均不应对任何特殊,直接,间接或结果损害赔偿,或任何因使用或与本软件的使用或绩效有关的合同,疏忽或其他侵权诉讼所造成的任何损害,无论是在合同,疏忽还是其他侵权诉讼中造成的任何损害。