2020年技术雷达：后端和前端（Web）发展趋势评估 - softwaremill

banq

分析总结Technology Radar出现的后端和前端（Web）技术。
 
后端发展趋势
  • 聚合点
在为多个目标（例如Web浏览器和移动设备）构建后端时，我发现GraphQL作为服务器端的资源聚合器非常方便，尤其是与SpringBoot结合使用时。在Java世界中构建面向微服务的体系结构的一种非常普遍的方法是定义功能之间的界限，并为每个功能编写SpringBoot应用程序。我们还在我们的体系结构前面找到一个网关，其中包括负责请求路由和API组成的网关。与其将REST端点暴露于所有可行的场景中，还不如暴露GraphQL端点，以使后端开发与不断发展变化的前端需求脱钩。
此外，GraphQL Inspector可以作为CI管道的一部分运行，以验证graphql模式，查找相似或重复的类型并将其与以前的版本进行比较以捕获重大更改并将通知发送给Slack。
  • 事件驱动EDA
在过去的几年中，当您不得不在架构中引入发布订阅消息系统时，Apache Kafka似乎是默认选择。但是，Kafka不再被广告为发布订阅，而是整个流媒体平台。另外，一个新孩子Apache Pulsar即将登顶。采用Apache Pulsar的原因有几个非常令人信服的理由，例如分层存储，地理复制或对租户的支持，但是我首先要进行概念验证，直到将其视为安全，默认和经过实践验证的选项为止。
Kafka是一个非常知名的消息传递系统，可以用作各种系统之间的中间层。例如，将数据从SQL数据库卸载到数据仓库中。可以使用Kafka Connect框架，尤其是JDBC源连接器来解决此任务。也可以使用称为Tamer的独立连接器Scala应用程序。
提到的两个工具，Kafka和Pulsar，都非常适合事件驱动的体系结构。尽管您可能在使用同步REST API的过程中熟悉OpenAPI（以前称为Swagger），但AsyncAPI是通常在任何EDA中都可以找到的异步API的补充部分。
我们的任务是标准化基于消息的通信，并提高不同系统之间的互操作性。
这个项目将要建立一个标准并提供工具，例如代码和文档生成器，模拟和测试库以及验证器。
  • 微服务
寻找工具来构建面向微服务的架构的Node.js开发人员可能会发现NestJS有用。它支持最常见的通信样式，例如请求-响应，异步消息传递和基于事件。该框架支持TypeScript，利用Express（可与Fastify互换），与Kafka，RabbitMQ和NATS等消息传递系统很好地集成，并支持gRPC和MQTT等各种协议。所有这一切，以及允许开发人员和团队创建高度可测试，可伸缩，松散耦合且易于维护的应用程序。
在部署新版本的应用程序时，测试HTTP API对于确保客户端安全至关重要。同样，在现代微服务体系结构中，您需要确保在此处更新一项服务不会破坏那里的另一项服务。在Spring Cloud世界中，您可以使用Spring Cloud合约，但除此之外，还有很多可用的选择，其中之一脱颖而出：Karate。对于不需要技术的人（例如产品所有者，领域专家或测试人员），他们可以使用特定领域的语言（例如Cucumber）特别有用，而无需编写胶水代码或步骤定义。此外，随着UI测试自动化的推出，Karate 已成为完整的端到端测试框架。
 
前端开发
  • 微服务正在渗入前端开发
开发后端应用程序时，微服务架构已经类似十字路口一样古老存在了。另一方面，尽管微前端被认可，但使用量却少得多。微服务和微前端两者概念是相似的：分离的代码库、团队、独立的生命周期和部署、并明确所有界限。不过，微前端核心思想之一是优先使用当地浏览器的功能，而不是定制API。与微服务架构不同的是使用浏览器事件进行通信，而不是像微服务那样使用全局发布订阅消息平台。
到目前为止，我们一直在尝试使用Frint和single-spa，并且渴望将这种技术引入更大规模的前端应用程序中。但是请记住，Fritt是一个完整的框架，需要您所有的应用程序都遵守其规则。
  • 前端测试
当寻找与Selenium竞争的、支持多种浏览器（Chrome系列和Firefox）的、端到端对开发人员友好的测试框架时，请关注Cypress。请记住，端到端测试位于测试金字塔的上部，并且这种类型的测试要多得多。它还针对具有JavaScript经验的开发人员，而不是喜欢Selenium UI的（手动）测试人员。
在Jest中编写单元测试和集成测试时，您可能会发现“Testing Library ”是一个有趣的扩展。适用于最常见的框架：React，Angular和Vue，它允许使用用户友好的API查询DOM节点，例如按标题，标签，文本，角色和测试ID进行搜索。
另一种测试是视觉回归/验证测试。您可以验证整个页面及其部分，布局以及特定元素，例如按钮，文本字段和图像。BackstopJS是此类测试中的领先工具之一。它支持并行测试运行，可以模拟用户交互，不仅可以针对图像的参考集合进行测试，还可以针对整个环境（如暂存，UAT或生产）进行测试。
  • 另一个构建工具，另一个CSS工具
由于构建工具，依赖项和库的更新数量比您敲键盘的速度快，因此开始前端开发可能会不知所措。
诸如CRA（Create React App）之类的启动器应用程序试图掩盖这种过度复杂性，并且似乎有一个新的后起之秀-Snowpack-完全消除了对捆绑器的需求，至少在Web开发开始时，它承诺更快地启动开发环境，立即在浏览器中反映更改后的效果，并支持TypeScript，Babel，JSX，Sass和CSS模块。它可以与React和Vue一起使用，并与webpack捆绑器集成以生成针对生产进行优化的构建。Snowpack App策略 是关于使用现代ESM语法和Snowpack启动新项目来安装npm依赖项的，该依赖项在浏览器中本机运行，完全不需要捆绑程序。
除了过于复杂之外，Tailwind CSS是另一个CSS框架，但是它的扩展性较差。没有预先设计的组件，因此不会覆盖不需要的样式，也不会调试特定性规则。它支持响应式设计，并允许提取重复的模式，最终设计为自定义：不仅仅是CSS框架，它还是创建设计系统的引擎。
  • 其他
GitPod不一定专门限于后端或前端开发，它允许在云中设置您的开发环境。所有必需的第三方服务（例如数据库，队列等）都可以通过docker包含到环境中。此外，多个团队成员可以共享一个相同的工作空间，从而实时查看彼此的更改，同时处理代码。它与GitHub，GitLab和Bitbucket集成良好。
您不再需要功能强大的笔记本电脑来编程了，Gitpod在Chromebook上的运行也同样流畅。您甚至可以使用平板电脑随时随地进行编码。

banq注：以上是主流媒体的观点，其他观点参考：
服务器端渲染是大多数人不同意的真理 - timr
90年代Web又重新回归 - Max Böck