提升前端流程可扩展性的设计模式应用:责任链与工厂模式 发表于 2025-01-24 更新于 2025-05-30 分类于 thinks 在开发涉及多步骤的前端流程时,传统的“硬编码”方式会导致代码耦合度高、流程不易扩展、维护成本大。当我们希望在流程中增加或修改某个步骤时,常常需要在多处改动代码,这不利于项目的长期维护。为了克服这些问题,我考虑使用责任链模式和工厂模式来优化这类需求。责任链模式能够将每个步骤解耦,使每个步骤独立处理,互 阅读全文 »
深入浅出 UniApp:从 UI 组件到数据交互的完整项目配置 发表于 2025-01-24 更新于 2025-05-30 分类于 share 摘要 在日常的前端开发中,框架总是一波接着一波的出现。为了不落后在这个快节奏的更新中,学习框架要抓住重点。 这个框架是干什么的 uniapp是dcloud出品的一个跨越多端的前端框架,基于vue开发。使得用户可以编写vue一套代码部署在微信小程序、支付宝小程序、钉钉、app和网页端。怎么听起来很方便 阅读全文 »
在 VS Code 中为 JSON 文件添加注释的方法 发表于 2025-01-24 更新于 2025-05-30 分类于 share 在 VS Code 中,JSON 文件默认不支持注释,这确实会让配置文件的阅读和维护变得困难。不过,你可以通过以下步骤将 JSON 文件设置为支持注释的格式,从而提高可读性。 配置 JSON 文件以支持注释 打开 VS Code 左下角的设置图标 → 选择设置。 阅读全文 »
Vue3 权限管理从零开始:新手指南 发表于 2025-01-24 更新于 2025-05-30 分类于 share 前言 这篇文章是写给刚入门Vue框架开发或者刚入门的同学,权限管理是基本上每一个项目都会遇到问题,你有登陆,有游客等身份,你总要不同的身份会有不同的网页访问吧。下面就实现从想法到权限管理的构建。 必备条件 Vue3 项目开发语言基础了解 Vue-router 路由管理基础了解 Pina 状态管理器基 阅读全文 »
加速你的项目!详解 Cloudflare Workers & Pages 优选域名设置 发表于 2025-01-24 更新于 2025-05-30 分类于 share 前言 很多人应该都有把自己的域名解析在大善人Cloudflare吧,今天又来介绍如何针对works和pages项目的CDN加速。后面再弄一期使用 Cloudflare CDN 的网站设置优选域名来加速访问。 使用条件 首先,你要确定使用的优选域名,也可以使用自建的,也可以使用网友免费共享的。 本次教 阅读全文 »
Git 删除提交和配置文件的方法 发表于 2025-01-24 更新于 2025-05-30 分类于 share 前言 在日常开发中,可能会不小心将.env等配置文件上传到GitHub仓库。即使删除了这些文件,历史记录中仍能看到其内容,这对隐私可能带来风险。这里有两种处理方法:1) 删除.env文件并清除历史记录,2) 仅取消跟踪该文件,适用于配置内容不重要且项目不公开的情况。 方式一 阅读全文 »
Next.js 14 配置 PWA:打造渐进式 Web 应用的完整指南 发表于 2025-01-24 更新于 2025-05-30 分类于 share 前言 前面的文章中对PWA做了介绍,也介绍了它的交互流程。那么这里就对我开发的音乐网站做一个PWA配置,来实践一下PWA的配置过程。 操作环节 安装依赖 pnpm install next-pwa 然后就是之前文章提到的Manifest配置文件 新建配置文件/public/pwa/manifest 阅读全文 »
PWA 技术解析:实现快速响应、离线能力和流畅操作的 Web 应用 发表于 2025-01-24 更新于 2025-05-30 分类于 thinks 摘要 在现代Web开发的世界中,用户体验是最重要的因素之一。无论是Web应用还是原生应用,用户都期望应用能快速响应、操作流畅、具备离线能力,并能方便地访问。渐进式Web应用(PWA,Progressive Web App)的出现,正是为了满足这些需求。 PWA是一种结合了Web应用和原生应用优点的技 阅读全文 »
优化 Next.js Docker 镜像:减少镜像大小的有效方法 发表于 2025-01-24 更新于 2025-05-30 分类于 share 前言 Next.js除了在vercel上部署之外,更多的是部署在自己的服务器上,为此官方提供了Docker的打包运行方式。这里分享的是如何优化打包的Docker镜像大小。 新建默认项目 安装官方的命令建立项目。 npx create-next-app@latest 然后在项目根目录新建Docker 阅读全文 »
三行 CSS 实现滚动动画:提升用户体验的简单方法 发表于 2025-01-24 更新于 2025-05-30 分类于 thinks 简介 在这篇博客中,我将向大家展示如何使用仅三行简单的CSS代码,实现元素的滚动动画效果。通过创建一个视图容器,添加一些块元素,并利用CSS动画属性,我们可以轻松实现平滑的滚动动画。除此之外,我还会介绍如何根据滚动位置单独针对每个元素进行动画处理,以及如何使用动画范围属性确保元素在到达时完全完成动画 阅读全文 »