Talk is cheap, show me nocode

本文参与「少数派 2019 年度征文」 — 多一度思考

大概半个月前，Google收购了一家叫做AppSheet的公司，这家公司的产品可以通过google sheets构建全平台运行的app。或许你没有听过这家公司，也没有用过通过这种方式生成的app，但以Appsheet，Glide，Webflow等为代表的nocode工具正在悄悄改变着大家制作app和创造新产品的方式。

Talk is cheap, show me nocode.

话不多说，今天我们就来聊聊nocode，再看看如何用nocode10分钟做一个疫情信息app。

1° 何为无码？

nocode，区别于传统的写代码编程的方式，就是用非代码的方式制作 app。笔者接触 nocode这个说法是从几篇博文里：《无码时代，我花 5 分钟做了两个 APP》《No Code，无码时代已经到来》。回头看看，其实早些时候用 Coda 实现的个人仪表盘就是一个典型的 nocode 实践。

现代nocode tools（图片来自：https://medium.com/@rrhoover/the-rise-of-no-code-e733d7c0944d）

广义上，所有非代码创作工具都属于 nocode tools，比如使用 Dreamweaver、Wordpress 等来制作网站，用 RPG Maker 来做游戏，甚至包括几乎所有的作图软件（相比于写 tikz/postscript 等）都是传统的 nocode tools。而狭义上看，我们现在所提到的 nocode tools，多是指一些使用非代码交互方式的开发平台，比如开发网页的 Webflow，制作 app 的 Glide、Appsheet、Adalo、Thunkable，自动化 workflow 的 Ifttt、Zapier，以及交互式文档 Notion、Coda、Airtable等等，我们可以称他们为现代的 nocode tools。

仔细想想，这些狭义的，或者说现代的 nocode tools，都有一套共同的模式，即平台化，非代码交互和生态圈。

平台化

或许这一环是现代 nocode tools 里比较容易忽略的一部分，经大佬 @geekplux 指点发现这一点是现代 nocode tools 区别于传统 nocode 软件的一大特征。

DevOps lifecycle（图片来自：https://www.techtrainees.com/top-tools-to-support-devops-promotion-team/）

在软件制作和分发流程中，code 只是其中一环，分发、运营、监控等等同样需要时间精力去构建和维护。相比于传统 nocode tools 通过非代码交互的方式解决 code 问题，现代的 nocode tools 往往还把除 code 之外的各种流程打包成平台，用户只需要专注于软件制作本身，其他问题都交给平台本身。例如 Webflow 可以直接生成即时上线的网站，Glide、Appsheet、Thunkable、Adalo 等都能生成跨平台 App 等等。

非代码交互

nocode，顾名思义，就是不写代码或者少写代码来实现需要的功能，取而代之的是基于图形界面的交互编程方式。相比于接近文字语言的代码，图形界面就像是一种视觉语言，而视觉作为生物本能感觉之一，在不同文化甚至不同物种之间都存在共通性。这就是为什么狗会和人握手，猫还能玩水果忍者😂。

言归正传，对应于视觉语言的编程语言 visual programming language 也是一门发展了很久的学科，包括用来给 LEGO 机器人编程的 LabView，K12 教育中常用的 Scratch，以及根源于 node-based language，现在在各自领域大红大紫的 Blender 的 node editor，Unreal 的蓝图和 Grasshopper 里的 Grasshopper script。Youtube 上有个关于 Visual programming 的小演讲很有意思，感兴趣的小伙伴可以看看：Visual History Of Visual Programming Languages。

现代 nocode tools 大多也借鉴了类似的 visual programming 方式，例如 Thunkable 里类似于 Scratch 的 block 编程，Voiceflow 里的 node 编程等等。Webflow blog 里的 No code is a lie 还分析了各种视觉语言在 nocode tools 里的应用，感兴趣的小伙伴可以移步观看。

图形界面交互把需要一定时间入门的代码编程降维成能快速上手的视觉语言编程是各种现代 nocode tools 的核心，这也就允许会不会代码的用户都能够比较轻松地实现自己想要的功能。

生态圈

现代 nocode tools 里还有重要的一环就是生态圈的建立，这其中包括社群内部互相分享的模板等可复用资源，以及用于链接各种不同数据和工具的 API。

例如交互式文档 Coda 和 Notion 都有海量的模板分享，好多新奇的模板都让人不禁感叹人民群众的创造力，同时互用模板也减少了 nocode 层面的重复造轮子。

另一个重要的生态就是 API，《No Code，无码时代已经到来》曾提到来自 a16z 的「API Economy」，

著名投资机构 a16z 曾提到过一个名词「the API economy」，意思是说如今我们的世界正在被软件吞噬，一大批新一代的软件正在崛起，而这些软件只专注一个方向，解决创造产品时各个环节的问题，让你不用再重复造轮子。最典型的例子就是 Stripe，90% 的终端用户可能都没听过这个名字，也不知道它是干什么的，但每个人都肯定使用过它提供的服务。而它提供的，不过是一套连接支付的 API 而已。所以现今的软件和互联网世界，是由 API 连接起来的。

—— No Code，无码时代已经到来 by DEX Group

而「API Economy」结合通用图形界面和视觉语言编程就可以形成 No code is a lie 所提到的「GUI Economy」，而各种 nocode tools 就是这一模式的先驱者和践行者。

2° 实地上手「无码」app

虽然现在有成百上千的 nocode tools，流行的也有数十种，不过简化来看，各种 nocode tools 所解决的问题无非都是内容，数据，排版这三个方面。换个角度看，就对应大家都会用的文档，表格和幻灯片。看起来各种 nocode tools 的作者们也是这么想，所以创造了像 Coda 这样的交互式文档，Glide 这样的表格转 app，和 Adalo 这样的像做 PPT 一样做 app。

这里我们就试试其中比较具有代表性的收费模式也比较良心的 Glide，用它来快速制作一个疫情信息 app。

作为一个信息展示 app，其中并没有太多的计算和信息处理，只要把数据收集好，再展示出来即可。这也是 nocode tools 最擅长的任务之一啦。作为这次使用的 nocode tool：Glide，它能够读取 Google Sheets 中的数据并生成对应的 app，所以制作这个 app 只有两步，收集数据并保存到 Google Sheets 和制作 app。

收集数据

正如上文所说，现在网络上几乎所有的数据都可以通过 API 自动获取。随着年初新冠病毒的爆发，众多机构，公司和志愿者都投身于疫情信息的收集和发布（十分感谢奋战在各线的工作人员和志愿者们）。这里我直接使用了一些开源的数据接口，获取了丁香园的疫情数据和相关资料，并将他们定期同步至 Google Sheets。

之后要做的事很简单，只要把想要在 app 里不同页面展示的数据放到表格的不同选项卡即可。

数据收集 done！

制作App

上一步我们已经把不同页面的数据放到了表格的不同选项卡，然后我们就可以在 Glide 中对每个页面进行排版和功能指定了。

在 Glide 中导入我们准备好的表格文件，它会自动识别出各个选项卡，并针对每个页面生成一个~~自以为~~合适的排版方式，如果我们不满意默认的排版方式或者数据识别有误，我们只要选择对应部件调整其元数据和展示方式即可。

最后，我们或许想弄个 landing page，只要找个合适的的图片放到表格的 home 选项卡，并在 Glide 中选择展示一些其它数据的缩略图即可。

之后，只要点击「Share app」就可以生成移动端的 App 了（其实是个 PWA）。

App 制作 done！

整个制作流程除了构思和寻找合适的 API 花了不少时间，整个 App 制作过程非常简洁明快，思路清晰的话可以在 10 分钟内完成。实际体验来看，可以说已经把制作 App 的门槛降低到几乎没有了……而且使用体验也非常不错，大多数数据都可以自动识别自动排版，基本上只要微调和选选样式就可以达到想要的效果，十分推荐大家尝试一下。

3° 关于 nocode 的思考

nocode=no problem?

在实际上手 nocode tools 之后，确实刷新了一些之前对 App 制作的认知，整个流程自动化程度非常高，用户只需要大致设计一下功能流程和排版就能很快生成一个可用的 App 原型。

不过沉下心来想想，现在的 nocode tools 也并非完美，高度自动化和可控性是一体两面，没法同时满足，例如 Glide 中提供的部件展示方式虽然多样但还是十分有限，字体的调整也是在大中小几个层级来调整，如果想要更复杂的展示方式，在现阶段就行不通了（现在也还没有稳定的对嵌入 HTML 的支持）。

另一个非常重要的点就是，虽然像 Glide 这样的 nocode tools 极大降低了 app 制作和分发的门槛，但还没有完全解决数据来源和处理的问题。例如在上面的疫情信息app中，从 API 导入到 Google sheets 中的数据往往格式并不统一，有些数据也有所缺损（例如累计确诊和新增确诊的时间跨度不一致，治愈率数据缺失等等），因为 Glide 本身没有计算和数据处理能力，所以我们只能在 Google sheets 里手动添加一些函数来处理不完美的数据并尽量调整成 Glide 容易识别的形式（例如分列和分页等）。相比之下，另一款 nocode tool：Coda 由于集成了表格功能，可以在获取数据之后再对数据进行后处理，并且实时显示出效果，这方面的体验就相对好一些。这也体现了不同的 nocode tools 的设计逻辑，像 Glide 这样的 nocode tools 相当于解决了制作App的最后五公里问题，通过结合像 Google sheets 这样已经很完善的工具把 App 制作的最后一道墙打破。而像 Coda 这样的工具就像是一条龙送到家的服务，所有的东西都可以在一个体系内完成。当然，这两种模式各有优劣，究竟谁是大势我们拭目以待。

nocode vs know code

细心的小伙伴们可能发现了，虽然我们使用了 nocode，但其实并不是一句代码都不用写，像 Google sheets 里的函数，Coda 表格里的计算，API 数据的导入和处理，都需要写一小段 code 来实现。然而，我认为这两者并不矛盾，nocode 的精髓应该是尽量减少 domain specific knowledge，即一些专业技能和复杂编程语言的需求（例如谁也不敢说会写的 C++），将 App 制作的门槛降低到视觉语言编程和文档表格处理的层级，这样，虽然可能还是需要写几行代码，但这几行代码已经是大众熟知或者能飞速上手的代码了。

再进一步想，nocode 未来会不会推动文字编程语言的消失呢？我认为不会，首先，nocode 编程和 code 编程本质上都是实现我们需要的功能逻辑，并没有谁好谁坏之分；另外专业编程语言在专业领域的优势十分明显，就像一个人去了国外，通过肢体语言和视觉语言也能进行简单的交流，但想要真正和当地人进行深入交流，还是需要通过他们能清晰理解的语言。

所以，使用 nocode 工具的过程其实会帮助我们 know code，让我们能更专注于功能逻辑的设计，也更能理解专业编程语言的痛点。正所谓手中无码，心中有码，方能多快好省做 App。

最后还有一些对现有nocode tools的期望：

对于中文的支持。在使用Google Sheets配合Glide做App的过程中，很多跟中文相关的排版都不尽完美，希望以后各种nocode tools能增强对中文的支持，也希望能出现更多国内的nocode tools和开发者。
数据互通。现在各种各样的nocode tools所支持的数据纷繁复杂，像表格的支持就有像Glide和Voiceflow使用的Google sheets，Table2Site使用的Airtable，还有Coda和Notion自带的表格功能，这也让各种nocode tools之间的互通和协作多了一些阻碍，希望将来能够出现更加无缝连接的数据交换方式。
国内的nocode社群。nocode并不是一个突然出现的概念，类似的理念已经存在很久，而nocode的兴起更多是国外很多nocode网站和社群的宣传和推动，像 makerpad、nocode.tech 等等都提供了数以百计的nocode tools推荐和showcase。同时，像 nucode、Coda community等社区也贡献了无数的模板和实践。相比之下，国内还并没有一个像样的nocode社群（也可能是我孤陋寡闻没搜到，欢迎大家指正），笔者用nocode工具（现在是notion）做了一个nocode资源站：Show me nocode，希望感兴趣的小伙伴能一起来搞点事情～

以上就是我对nocode的「多一度思考」，希望大家能够喜欢，虽然笔者本人在19年并不是十分顺利，但在少数派却多少体会到了一些创作和分享的快乐。希望大家在2020都能跨越难关找到内心的乐趣～