文件检查符号

2 种方法验证 JSON-LD 是否正确运作?

JSON-LD 是一种夹带更多资料以描述网页内容的方式之一。通常不太留意它,直到真正实施后也不知道有无用处?该如何检验搜索引擎是否正确抓到这笔资料?这篇文章分享我的经验以及让你实际验证 JSON-LD 是否和规范且被正确解读。

旋转箭头符号

如何重写陈旧系统:就像忒修斯之船

近期面对许多陈旧代码维护的问题,碰巧我翻找到这个博客:Understand Legacy Code,记录一下「重写」陈旧系统可能会遇到的困境与解套方案。以我自己手上的项目为例,在进行项目升级评估时发现事情比原先想象还要复杂!

沟通符号

消除团队学习债务:每日小会

开发者在记录或转移知识方面的「失败」并不是因为懒惰或缺乏关心。 相反,[环境压力]促使他们在绩效和学习目标之间的复杂紧张关系中找到平衡。当让学习变得显见并不安全时,绩效文化就会获胜。透过每日小会的方式,每天花费短小的时间让学习在团队中被提倡鼓励。

重叠的抽象图标

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

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

介面符号

通过元件化以构建可扩展的用户界面

近期在大改造现有产品的设计系统,预期会与来自不同领域的人合作,因此这篇文章是写给对网页无任何前置知识的人的,主要介绍「界面组件化」这个概念。组件是一块拼图、一个积木、一个齿轮……,就是一个可以被重复使用并且可被组合成更大物件的概念。

打勾对话框符号

如何开会?开会前、开会中、开会后应当注意的事项!

开会是一门学问,也是身为团队领袖必备的软技能之一,架构差劲的会议会不只影响个人更甚至会整体团队的生产力,特别是在远端工作盛行的时代沟通技巧更尤为重要,架构差劲的会议会不只影响个人更甚至会整体团队的生产力,本篇文章探讨开会前中后有哪些细节是可以注意的。

选色器符号

记录如何从头打造数字产品 - 颜色篇

近期公司购买了设计相关的课程,期望透过研究改良目前的设计来提升与开发合作的效率,恰好我之前的工作领域也与设计相关,而且我很早就想跨领域多写与网页相关的文章!因此打算特地开一系列文章记录课程笔记以及我自己补充的想法与资源。

方框内有数字四的符号

新工作 4 个月以来接触 E2E 测试与 BDD 的心得

在加入新工作的数个月内我撰写了接近百支大大小小功能的E2E 测试,打算透过边撰写这篇文章边阅读文件稳固自己的知识,同时也方便团队成员能够快速上手我从零开始建立的E2E Cypress 测试专案,并且最终期望能够尝试实验导入BDD 流程到团队开发流程当中。

不高兴表情符号

为什么 CSS 这么难学这么诡异?

开发者们对 CSS 有不同的意见,有的人说它很简单、有的人说它难以驾驭,这些都是事实。我时常听到苦恼的后端或是与其打交道多年的自己脱口而出:「CSS 真的好诡异阿!」,这篇文章来总结为什么CSS 是一个让人又爱又恨的存在,它为什么这么难学这么诡异?

机器人符号

将 AI 应用到你的 Coding 工作流当中 - GitHub Copilot

开发者的工作性质造就我们注定要站在最前线与 AI 并肩作战,而 GitHub Copilot 这些年的陪伴显著的提升了我的开发生产力与更有效率的学习开发技巧,是少数我觉得真正值得付费的服务之一,不管你是新手还是老鸟 Copilot 都有对应的定位帮助你加速开发。

笑脸符号

乐观 UI (Optimistic User Interface) 是什么?有哪些实践细节是你应该注意的?

不要让使用者等待!越多的等待时间,就越容易让使用者流失,因此让应用程式的回馈即时,是很基础重要的原则。 Optimistic UI 强调即时、乐观的使用者介面回馈。在用户触发操作后,系统即时假定成功,迅速更新介面,提升使用者体验。这种方法有效缩短用户等待时间,创造更流畅、令人满意的互动体验。

图片缩放符号

制作响应式网页需要多少尺寸版本?三个论点说服你越少越好。

我既设计网页也开发网页,并且在过去几年经验中总结发现设计与开发配合上容易遇到的问题像是:我需要绘制多少种尺寸的网页?我需要为网页设置多少个断点?这篇文章我分享自己作为设计者与开发者的经历以及你为何应该使用越少的断点来制作响应式网页越好。

层级符号

一个简单聪明的方法让你永远不用烦恼管理 Z-index 的问题

赋予网页元素相对的关系而非绝对的数值,让我们强烈联系元素之间的差异,而非取决于某个魔法数字可以避免很多折腾。最近看到一篇文章,作者提到用 CSS Variable 来赋予相对而非绝对数值的 `z-index` 值,真是优雅简洁的方法!完美的发挥了 CSS 变量的优势,促使我写下这篇文章。

节点连接符号

如何优雅的于 Vue 正确的处理数据加载

索取并显示资料对前端工程师来说是家常便饭的事,但随着背后延伸的状态越来越多,就会让整个专案极度混乱,因此想要藉由这篇文章点出现有问题并提出一些可行的方案,纪录寻找更高效解法的过程。在索取资料时连带的有许多状态需要被管理和调整,文章透过 Vue 来探讨如何更优雅的处理这些状态。