你们中的许多人无疑都知道，在这些令人不安的时期，许多年轻人通过在橱窗里展示彩虹画来表达他们对NHS和其他关键工作人员的支持。既然我应该是个成年人，我想我应该试着做得更好--展示一条电脑生成的彩虹。自然，我求助于Clojure来做这件事。我的基本计划是这样的：
在这篇文章中，我将介绍我是如何构建和部署我的简单静态站点的。如果您愿意跟随，请在https://github.com/DaveWM/thank-you-nhs.上克隆我的回购。
多亏了出色的Hiccap库，在Clojure中生成HTML非常容易。Hiccap允许您获取Clojure数据结构，如[：span"；Hello！"；]，并将其转换为HTML字符串。然后，我们的任务是编写一个Clojure函数，该函数返回表示SVG彩虹的HICKUP。这个SVG由多个紧凑的圆圈组成，彩虹的每种颜色对应一个圆圈，外加一个遮罩来“切割”拱门下面的部分。Clojure代码如下所示：
(定义彩虹(让[COLURS["；红色"；"；橙色"；"；黄色"；"；绿色"；"；蓝色"；"；靛蓝#34；"；紫色"；]；(约克的理查德徒劳无功)Viewbox-Width 100；；彩虹是一个半圆形，所以我们需要我们的SVG处于2：1的比例视图。这是拱门的高度-尝试将其设置为不同的值Arch-Height 25；；单色带的宽度；；等于Viewbox高度和拱门高度之间的差，除以颜色带宽的数量(/(-Viewbox-Height Arch-Height)(计数颜色))][：svg{：Viewbox(str"；0"；Viewbox-width"；"；Viewbox-Height)：presveAspectRatio&#)][：svg{：Viewbox(str"；0"；Viewbox-width"；"；Viewbox-Height)：presveAspectRatio&#。}[：defs；；此遮罩为拱形下方的位在彩虹上挖出一个洞[：ask{：id"；arch"；}[：rect{：width"；100%"；：Height"；100%"；：Fill"；White"；}]；注意-SVG坐标颠倒(y=0在顶部)，因此"；Viewbox-Height"；位于底部[：Circle{：cx Viewbox-Height：CY Viewbox-Height：R Arch-Height：Fill"；Black"；}][：g{：MASK"；url(#Arch)"；}(->；>；Colors(贴图索引(FN[IDX COLOR][：圆形{：CX(/Viewbox-Width 2)；这是水平中心：CY Viewbox-Height；；Start。BAND-WIDTH"；：R(-Viewbox-Height(*BandWidth IDX))：填充颜色}])]])。
<；SVG presveAspectRatio="；xMidYMax Slice"；Viewbox="；0 0 100 50"；width="；auto"；>；<；defs>；<；掩码id="；拱"；>；<；矩形填充="；白色"；高度="；100%"；宽度=&。CY="；50"；Fill="；Black"；r="；25"；>；<；/Circle>；<；/MASK>；<；/defs>；<；g掩码="；url(#ARCH)&34；>；<；Circle Cx="；50"；Cy="；50&。/Circle&>；<；Circle Cx="；50"；Cy="；50"；Fill="；橙色"；r="；46.42857"；>；<；/Circle&>；<；Circle Cx="；50"；Cy="；50"；Fill="；黄色"；r="；42.857143&##。50"；Cy="；50"；Fill="；绿色"；r="；39.285713&34；>；<；/Circle>；<；Circle Cx="；50"；Cy="；蓝色"；r="；35.714287"；>；<；/Circle>；<；填充="；靛蓝；r="；32.142857&34；>；<；/Circle>；<；/Circle&>Cx="；50"；Cy="；紫罗兰&34；r="；28.571428"；>；<；/Circle>；<；/g>；<；/svg&。
太棒了！现在，我们只需为包含彩虹SVG的整个页面创建一些问题。以下是代码的略微简化版本(完整代码在此处)：
现在我们只需呈现HTML，并将其输出到一个文件中：
(Defn main[&；args](->；>；(h/html page)；；将我们的卡嗝转换为字符串(spit"；public/index.html"；)；；将字符串输出到HTML文件)
注意：在project.clj中，我们有一行代码：main Thank-you-nhs.core/main，它告诉lein run运行这个主函数。
这就是我们需要的一切！如果您正在学习，请创建一个GitHub、GitLab或BitBucket repo，并将代码推送到其中。我们现在已经准备好在Netlify建立我们的站点。
Netlify是构建和托管静态站点或SPA的绝佳平台。它使站点的启动和运行变得极其迅速。我们希望netlify监视您的git回购，并在每次新的提交运行时执行lein运行，然后将/public目录作为网站托管。如果您正在跟进，并且您想自己尝试一下，请按照以下步骤操作：
就这样!。Netlify将构建和部署该站点，并为您提供该站点的URL。
“Netlify是怎么知道该怎么做的？”我听到你问了。神奇之处在于repo根目录中的netlify.toml文件。这为Netlify提供了一个要运行的命令来构建您的站点。该文件如下所示：
为了展示这个网站，我挖出了一个旧的树莓PI，并把它连接到了监视器上。然后，我将PI的浏览器指向我的站点，并使其全屏显示。结果如下：
这就是如何使用Clojure设置一个简单的静态站点！如果您想了解更多，或者想构建一个更高级的静态站点，我建议您查看Statis库。Yu还可以查看我在这里制作的另一个静态站点。谢谢你的阅读。
另外，如果你想在这个危机时刻帮助NHS做些什么，你可以在这里为“为照顾者服务”活动捐款。