CSS
用 Grid 与 minmax 写一套自适应卡片列表
三行 CSS 代替媒体查询：卡片列数随容器宽度自动增减，配合 max-width 约束避免超宽屏上一行塞进八张卡片。
阅读约 6 分钟
关于我
写代码第八年，做过电商后台、数据看板，也维护过几个只有几百人访问的小站点。
个人简介
我是朱亦宏，常住在合肥，白天在一家软件公司做 Web 前端，晚上与周末把工作中重复遇到的事情整理成笔记发在这里。这个站从 2021 年起就是我的个人空间，服务器换过两次，主题改过四五版，唯一没变的是「写下来才算真的学过」这句自我要求。
我偏爱朴素的实现方式：能用一段 CSS 讲清楚的，就少引一个依赖；能用系统字体解决排版的，就不加载几兆的字体文件。页面打开快一点，代码读起来顺一点，对我来说和功能正确同等重要。
所在地安徽 · 合肥
从业时间2018 年至今
常用语言JavaScript / TypeScript / Go
写作节奏每月两到三篇
专注方向
把一个问题拆到足够小，答案往往就浮出来了。
前端工程
布局、样式与交互相关的实践记录，多数来自真实项目里的返工与重构。
布局与响应式
布局
sticky 侧栏的三个前提条件
父容器必须留出滚动空间、祖先元素不能裁剪溢出、top 值要小于容器高度，任一条不满足，position: sticky 就会安静地失效。
阅读约 5 分钟
移动端
窄屏排版：字号、行高与点击区域的取舍
把正文压到 15px 以下的收益没有想象中大，真正影响可读性的是行高和左右留白，以及按钮有没有给够 44px 的触控范围。
阅读约 4 分钟
动画与交互
动效
用 IntersectionObserver 做滚动渐显
思路是渐进增强：HTML 里元素默认就是可见的，脚本可用时才临时加上初始隐藏状态，再由观察器淡入，避免脚本失效导致整页空白。
阅读约 7 分钟
体验
锚点跳转的平滑滚动与焦点处理
scroll-behavior 只是起点，还要用 scroll-margin-top 给目标章节留出间距，并考虑把焦点交给标题以照顾键盘操作与读屏软件。
阅读约 5 分钟
CSS
用自定义属性搭一套可换肤的主题
颜色、圆角、阴影全部收进 :root 变量，换主题只需要覆盖一组值；本文记录命名方式与深色模式下的取色经验。
阅读约 6 分钟
后端与工具
服务端脚本、静态站点构建和一些把重复劳动变短的小工具。
Node.js 随记
Node.js
把一个杂乱的数据接口收拾干净
统一响应体的字段、给每个错误编码、把校验提前到路由入口；顺带用 zod 把请求参数的类型收窄，前端对接少写了不少判断。
阅读约 8 分钟
构建
两百行代码写一个静态站点生成器
读 Markdown、套模板、输出 HTML、拷贝静态资源，四步走完就能跑起来；文章最后附上增量构建的思路与目录监听方案。
阅读约 10 分钟
运维
小站点的备份与恢复演练
数据库每晚导出、静态文件每周打包，密钥单独存放；更重要的是定期真的恢复一次，不然备份只是一份自我安慰。
阅读约 6 分钟
开发环境
工具链
我的编辑器配置与快捷键习惯
格式化交给保存动作、多光标代替重复敲击、把常用片段写成缩写；配置不追求齐全，能减少手部移动就够了。
阅读约 5 分钟
终端
把重复的命令收进一份脚本
发版、清理、本地起服务，写成带参数的小脚本，出错时输出可直接复制的命令，团队里新同事上手快了很多。
阅读约 4 分钟
读书与随笔
技术之外的一些摘记，写得比较随意，读到哪算哪。
读书
《代码整洁之道》里的命名与函数长度
重读时最有感触的是「函数只做一件事」这一条：判断标准不是行数，而是还能不能给它取一个准确的短名字。
阅读约 6 分钟
随笔
为什么我开始坚持写发布说明
半年之后回头看，发布说明比周报更有用：它记录的是「改了什么、为什么改」，而不是「这段时间我在忙」。
阅读约 4 分钟
复盘
一次线上白屏的排查记录
结论是一个被忽略的构建产物路径，过程里真正省时间的却是彩排阶段留下的对照环境，以及把现场信息先固定下来再动手改。
阅读约 7 分钟
联系我
技术交流、勘误或者约稿都欢迎，工作日一般当天回复。本站由朱亦宏个人开设并维护，主体性质为个人，主办人即本人，站点域名 zyhxx.xyz。
- 电话
- 0551-6382 4715
- 通信地址
- 安徽省合肥市蜀山区黄山路 606 号 · 邮编 230031
- 本站域名
- zyhxx.xyz