react

【译】Roam Research 自定义组件 —— 跟 {{roam/render}} 来一次亲密接触!

Roam Research 采用的是 Clojure 技术栈的 Datomic/datascript Datalog 数据库,能够将内容同步到不同的设备,并管理非常复杂的撤销操作,还能够支持各种程度的自定义组件和插件功能定制,方便开发者利用 Reagent 渲染组件,并支持与 JavaScript 互操作。本文就将硬核解析 Roam 背后原理,发掘 Roam 基于 Block 的深层技术优势,帮助你迎接 Roam API 时代的到来! 原文地址:A closer look at {roam/render} —— Zsolt Viczián Roam 就好像一把优秀的瑞士军刀,竟然包含一个完整的 ClojureScript 开发环境。在过去两周里,我逐渐熟悉了 ` {{roam/render}} `。这篇文章可以算作我自己的笔记,总结整理一下我的所见所学。
吕立青

前端单元测试实战:React + Redux Testing Library

PPT 内容: https://jimmylv.gitee.io/slides/react-test 为什么要有单元测试? 走 🚶 vs 🏃 跑 写不好是能力问题,不写则是态度问题。 单元测试客观上可以让开发者的工作更高效,React 应用的单元测试是一定要的。 单元测试的上下文 谈任何东西都一定要有个上下文。你的论述不能是「因为单元测试有这些好处,所以我们要做单元测试」,而应该是「不做单元测试我们会遇到什么问题」,这样才能回答「为什么要写单元测试」的问题。那么我们谈论单元测试的上下文是什么呢?不做单元测试我们会遇到什么问题呢?上图为一个产品从 idea 分析、设计、开发、测试到交付并获取市场反馈的过程。 缩短反馈周期 而单元测试的上下文就是存在于「敏捷」当中。敏捷为的是更快地交付有价值的可工作的软件。为此,它有一个指标来度量这个「更快」,那就是 lead time,它度量的是一个 idea 从提出被验证,到最终上生产环境面对用户的时间。
吕立青

【译】《React 学习之道》The Road to learn React (简体中文版) 最简单,且最实用的 React 实战教程

通往 React 实战大师之旅:掌握 React 最简单,且最实用的教程。 前言 《React 学习之道》这本书使用路线图中的精华部分用于传授 React,并将其融入一个独具吸引力的真实世界 App 的具体代码实现。 如何掌握 React 存在特别多的路线图。本书提取这些路线图中的精华部分,并将其融入于一个具体的应用程序当中。您将会构建一个属于自己的 React 应用程序。在本次学习之旅当中,您将学习 ES6,了解所有 React 的基础知识、先进理念,以及组件的内部状态管理。 作者与译者 首先,感谢 The Road to learn React 原书作者,Robin Wieruch。本书的翻译始于 React China 社区的一个帖子:The Road to learn
吕立青

技术雷达之「微前端」- 将微服务理念扩展到前端开发(下:实战篇)

前言与大纲 本文分为理论和实战上下两篇。本篇为微前端的实战篇,共计约 5k 字,预计阅读时间 10 mins。 在技术雷达之「微前端」- 将微服务理念扩展到前端开发(上:理论篇)中,我们介绍了微前端在单体应用和微服务的架构演进中所产生的缘由,将微服务理念运用到前端开发就是为了解决臃肿前端的当前现状。与此同时,合理拆分微前端也给我们的应用开发带来显而易见的好处,在本篇当中我们将逐一介绍微前端的实践方案与可能遇到的问题和对应的优化建议。 * 微前端的可选实践方案(4 种 +) * 创建更小的 Apps(而不是 Components) * 如何组合微前端的 App 模块? * Option 1: 使用后端模板引擎插入 HTML * Option 1.1: 渐进式从后端进行加载 * Option 2: 使用 IFrame 隔离运行时 * Option 3: 客户端 JavaScript 异步加载 * Option
吕立青

技术雷达之「微前端」- 将微服务理念扩展到前端开发(上:理论篇)

前言 本文分为理论和实战上下两篇。本篇为技术雷达之「微前端」- 将微服务理念扩展到前端开发(上:理论篇),共计约 2k 字,预计阅读时间 5 mins。 在 ThoughtWorks 正式发布的最新一期技术雷达(下载地址:technology-radar-vol-17-cn.pdf)当中,「微前端(Micro Fontends)」已经进入到试验阶段,而试验环所列出的技术是我们认为值得去追求的。理解如何建立这种能力对您所在的组织十分重要,现在就可以尝试在一个低风险的项目上试点和实践这项技术,帮助您真正地了解这门技术。 摘自技术雷达:我们已经从引入微服务架构中获得了明显的好处,微服务架构可以让团队裁剪出独立部署的交付物以及可维护的服务。不幸的是,我们还看到许多团队在后端服务之上创建了前端单体——一个单一,庞大和杂乱无绪的浏览器应用。我们首选的(经过验证的)方法是将基于浏览器的代码拆分成微前端。在这种方法中,Web 应用程序被分解为多个特性,每个特性都由不同的前后端团队拥有。这确保每个特性都独立于其他特性开发,测试和部署。这样可以使用多种技术来重新组合特性——有时候是页面,有时候是组件
吕立青

「技术雷达」之 Micro Frontends:微前端 - 将微服务理念扩展到前端开发

[slide] ✨ Micro Frontends ✨ 微前端 - 将微服务理念扩展到前端开发 (via Jimmy Lv 🐵) [slide] ⏲️ | Agenda 1. 微前端的概念缘由与定义 2. 微前端的实践方案(4+) 3. Demo 4. 优缺点总结与思考 [slide style=”background-image:url(‘https://raw.sevencdn.com/JimmyLv/images/master/2017/12/1513920317188.png’)”] The Majestic Monolith [note] * 当今的软件开发环境中,大多数应用程序都是单一的,这种方法的缺点之一是企业所有者一年内需要做的决策数量非常有限(因为依赖关系,响应时间较慢)。 * 升级产品,在一系列相关服务中增加尺寸较大等新功能,需要所有相关方共同努力,以同步方式进行变更。 [/note] [slide]
吕立青