ColinJiang

一个现代化的、可扩展的样板项目，用于使用 React、Tailwind CSS 和 Radix UI 构建美丽的、响应式的网络应用程序。

本系列主要分享，如何在我们的真实业务场景中使用设计模式。 虽然本文的题目叫做“订阅通知”，但是呢，本文却主要介绍「观察者模式」如何在真实业务场景中使用。是不是有些不理解？解释下： 其实说白了，就是分布式架构中使用消息机制MQ解耦业务的优势，是不是这么一想很容易理解了。 详细说：…

前言 从我个人理解来看，设计模式其实就藏在我们平时的代码中，只是有人把它们提、炼出来，赋予了一些专业的名词和定义，下面给大家介绍一个日常项目开发中非常实用的设计模式，也就是策略模式。 策略模式的定义

本文将介绍一种基于 CSS 变量技巧，通过合理使用 CSS 变量，实现 CSS 动画 @keyframes 的复用。 CSS 变量 CSS 变量大家应该都比较熟悉了，已经不能算是新知识了，快速过一遍。

假设，我们有这样一张 Gif 图： 利用 CSS，我们尝试来搞一些事情。 图片的 Glitch Art 风 在这篇文章中 --CSS 故障艺术，我们介绍了利用混合模式制作一种晕眩感觉的视觉效果。有点类

终于，在漫长的等待下，容器查询（CSS Container Queries）将在 Chrome 105 版本得到正式的支持！ 而目前，我们也能在 Chrome Canary 版本中，或者在 Chrom

最近我在 CodePen 上看到了这样一个有意思的动画： 整个动画效果是在一个标签内，借助了 SVG PATH 实现。其核心在于对渐变（Gradient）的究极利用。 完整的代码你可以看看这里 --

今天，遇到了一个很有意思的问题，一名群友问我，仅仅使用 CSS，能否实现这样一种响应式的布局效果： 简单解析一下效果： 在屏幕视口较为宽时，表现为一个整体 Table 的样式 而当屏幕视口宽度较小时，