搜寻文章分类:技术讨论

工具箱符號

如何管理工具函数

近期维护项目时发现有许多通用的函数散乱的分布在项目当中,于是趁有空时整理出一个统一的结构规则以便团队使用。很多时候我们对这些通用工具函数的印象只停留在要抽离到某个文件夹,至于要怎么管理或是维护这些函数就没有太多想法,导致许多乱象产生,像是:过度抽象、意义不明的命名、神级函数。

箱子符号

了解网页组件化的未来:Web Components

从很早以前就大致知道浏览器开始推出 Web Components 相关 API 与标准,但一直没有机会在实战中使用这项技术。想撰写这篇文章记录是因为随着时间推移发现 Web Components 的应用范围越来越广,因此趁着有空也来了解一下相关知识,并且分析它与现有的解决方案有什么不同。

上传档案图示

我如何使用 Git LFS 来管理大型 Git 档案?

Git 允许我们纪录任何档案的变更,并且可以轻松地回溯到任何一个版本,但是当需要储存大型档案时Git 就会显得力不从心,因为Git 并不是为了储存大型档案(图片、影片、音乐……等二进制档案)而设计的。而这次介绍的 Git Large File Storage 是 Git 的扩充,专门用于解决以上问题。

GitHub Logo 符号

3 招提高 GitHub 代码审查效率

如今 Git 与 GitHub 已经成为业界主流,有很大机率你的专案也会使用到它们来进行版本控制,但由于 GitHub 是一款基于 Git 附加的服务,所以我们时常会轻视它的功能,其实 GitHub 有许多不错的功能却不是那么明显,因此主要分享一些我认为有用但日常使用没有查觉到的功能。

升级符号

来看看 Nx 如何解决套件框架更新的问题 - nx migrate

近期将公司的新 Nx Monorepo 架构专案透过 GitHub Action 添加了自动更新套件的功能,会想实践该功能是因为旧专案疏于更新导致吃了非常多的苦头,希望在新架构下可以有更轻松且自动化的方式去执行更新。其中 Nx 有专属的 nx migrate 指令帮助我们达成这件事,并且背后有些非常有趣的机制与理念。

文章搜寻符号

使用 Pagefind 替任何静态网站添加搜寻功能

不到 3 步骤让你的网站拥有以 WebAssembly 高效驱动的客制化搜寻功能。静态网站像是部落格、文件、个人网站、公司网站……等这类阅读体验为主的网站通常都有搜寻内容的需求,恰逢 Pagefind 1.0 的推出我把原先自制的fuse.js 搜寻功能换成Pagefind,分享如何在任何静态网站上加入搜寻功能。

打勾框符号

TDD 测试驱动开发超赞可以试试看(附实际操作范例)

TDD 测试驱动开发是一种开发方法论,先写测试再实践代码,应该如何撰写测试?或许听过 TDD 但不清楚与单纯写测试差别在哪?这篇文章详细描述 TDD 的优势与实际操作范例快速了解 TDD 为什么这么赞。TDD 目的便是打造一个工作流程能够验证代码的行为,让开发者能够更有信心的重构、更动代码。

重叠的抽象图标

故事化直白的解释 Monorepo 是什么

随着前端的复杂程度增加,Monorepo 这个词汇也时常出现,可惜的是相关介绍资源非常不足,趁着近期较为闲暇的时间来统整记录一下我对 Monorepo 的理解。受到不同好文章与影片的启发,我想写一篇最直白的 Monorepo 解释,希望能够帮助更多人理解 Monorepo 的概念。

文件和齿轮符号

通过导演一部电影来解释 Node Package Manager

NPM 是 JavaScript 开发环境中必不可少的软件包管理器。本文将以导演一部电影为比喻,解释 NPM 的运作方式。编程就像拍摄一部电影,可以亲自设计和管理演员,也可以雇佣他人设计好的演员。NPM 就像一个平台,可以在上面找到许多现成的演员,这些演员就是软件包(Package)。

旋转箭头中央有问号符号

JavaScript 传值与传址,都几咧?

在程式语言中最基本的问题就是问题就是如何纪录与操纵资料,牵扯到传值与传址的问题,这篇教学使用 JavaScript 搭配图表帮助你了解它们的差异。了解如何储存变数有助于更好的操控资料,避免出现改 A 却动到 B 的状况。