程序员茄子
全部
编程
代码
资讯
案例
综合
联系我们
html在线编辑
登录注册
AI,自己全程接管维护
php
mysql
shell
go
vue
css
api接口对接
支付接口对接
最新
最热
一行命令搞定!16.5k Star 的开源神器,让 AI 生成的前端终于有审美了
案例
一行命令搞定!16.5k Star 的开源神器,让 AI 生成的前端终于有审美了
2026-05-11 16:39:33 +0800 CST
view 268
16.5K Stars 的开源项目 taste-skill,让 AI 生成的前端代码告别紫蓝渐变 Hero + 三列圆角卡片的模板风。一行命令安装,支持 Cursor/Claude Code/Codex 等主流编程 Agent。
taste-skill
AI前端
设计规范
Claude Code
Cursor
反slop
前端开发
SKILL
design-md-chrome深度解析:Chrome扩展一键生成网站设计蓝图DESIGN.md
编程
design-md-chrome深度解析:Chrome扩展一键生成网站设计蓝图DESIGN.md
2026-04-27 20:07:57 +0800 CST
view 269
design-md-chrome是Chrome扩展,扫描任意网页自动提取色彩、字体、间距等视觉规范,生成结构化DESIGN.md文件,可直接用于Claude Code等AI编码工具。
Chrome扩展
前端开发
AI工具
设计规范
MySQL数据库的36条军规
编程
MySQL数据库的36条军规
2024-11-18 16:46:25 +0800 CST
view 1577
本文总结了MySQL数据库的36条军规,涵盖了核心军规、字段类军规、索引类军规、SQL类军规和约定类军规。每条军规背后都有实战经验,强调了性能优化和合理使用数据库的原则,如避免复杂运算、合理控制数据量、谨慎添加索引等,以提升数据库的效率和稳定性。
数据库
性能优化
开发规范
前端项目中的日志打印规范,包括日志等级的定义、日志内容的组成、统一的日志格式、日志输出的方法以及日志的封装和收集
编程
前端项目中的日志打印规范,包括日志等级的定义、日志内容的组成、统一的日志格式、日志输出的方法以及日志的封装和收集
2024-11-18 21:06:37 +0800 CST
view 1445
本文介绍了前端项目中的日志打印规范,包括日志等级的定义、日志内容的组成、统一的日志格式、日志输出的方法以及日志的封装和收集。通过示例代码展示了如何实现一个灵活的日志工具,支持不同等级的日志输出和生产环境的日志控制,强调了日志在应用维护中的重要性。
前端开发
日志管理
代码规范
Karpathy Skills 深度解析:当 AI 编程大师的「血泪教训」被压缩成 100 行配置文件
编程
Karpathy Skills 深度解析:当 AI 编程大师的「血泪教训」被压缩成 100 行配置文件
2026-04-10 04:48:17 +0800 CST
view 4257
本文深度解析了GitHub项目`andrej-karpathy-skills`,该项目将AI编程大师AndrejKarpathy对LLM编程的三大缺陷(假设狂魔、复杂度成瘾、顺手牵羊)提炼为四条行为原则,并写入`CLAUDE.md`文件。这100行配置文件通过上下文注入约束AI编程行为,旨在让ClaudeCode像资深工程师一样克制,避免过度设计和不必要修改,从而提升代码质量和开发效率。
人工智能
编程实践
软件开发
AI工具
代码规范
OpenSpec:AI编程助手的规范驱动开发框架,比Spec Kit更轻量
编程
OpenSpec:AI编程助手的规范驱动开发框架,比Spec Kit更轻量
2026-05-23 15:18:15 +0800 CST
view 172
OpenSpec是规范驱动开发(SDD)框架,为AI编程助手提供轻量级spec层,流动式迭代、支持20+AI工具、比Spec Kit更轻量、比Kiro更开放,MIT开源。
AI编程
OpenSpec
规范驱动
SDD
Claude Code
Codex
slash命令
Agent Skills 深度解析:Addy Osmani 如何用纯 Markdown 给 AI 编程助手装上「工程纪律」
编程
Agent Skills 深度解析:Addy Osmani 如何用纯 Markdown 给 AI 编程助手装上「工程纪律」
2026-05-11 15:53:36 +0800 CST
view 261
Google Chrome 工程总监 Addy Osmani 发布了一个名为 agent-skills 的开源项目,通过将 Google 内部严苛的工程规范编码为 AI Agent 可直接执行的纯 Markdown 工作流,让 AI 编程助手从「能跑就行」进化到「可以安全合并」。
Agent Skills
AI编程
Addy Osmani
Claude Code
工程规范
Cursor
Markdown
工作流
Google工程
Agent Skills 深度解析:27K Star 的谷歌开源紧箍咒,让 AI 按生产级标准写代码
编程
Agent Skills 深度解析:27K Star 的谷歌开源紧箍咒,让 AI 按生产级标准写代码
2026-05-02 17:01:28 +0800 CST
view 299
谷歌 Chrome 团队 Addy Osmani 开源的 Agent Skills,27K Star。它是一套生产级工程约束框架,通过六阶段流程、反合理化机制和渐进式信息披露,强制 AI 按生产级标准写代码。
Agent Skills
AI编程
谷歌
开源
工程规范
TDD
Code Review
90% 开发者还在用的 `substr()`,浏览器早已废弃
编程
90% 开发者还在用的 `substr()`,浏览器早已废弃
2025-08-15 12:08:58 +0800 CST
view 821
在前端开发中,`substr()`已被Web标准废弃,尽管浏览器仍兼容。推荐使用`slice()`作为首选替代方案,因为其支持负数索引且行为一致。`substring()`是次选,但存在参数自动交换的问题。尽快迁移到`slice()`可以减少认知负担并提升代码健壮性,避免未来可能的兼容性问题。
前端开发
JavaScript
编码规范
前端代码规范 - 图片相关
编程
前端代码规范 - 图片相关
2024-11-19 08:34:48 +0800 CST
view 1342
本文详细介绍了前端项目中图片的使用规范,包括图片格式选择、尺寸与压缩、图标使用、响应式图片、懒加载、缓存、合理使用、组件化优化、CDN优化以及可访问性等方面。合理使用图片不仅能提升页面加载速度,还能增强用户体验和SEO效果。
前端
图片优化
用户体验
开发规范
技术文档
总结出30个代码前端代码规范
编程
总结出30个代码前端代码规范
2024-11-19 07:59:43 +0800 CST
view 1511
本文总结了30个Vue3及Element-plus的前端代码规范,涵盖目录、模块、组件、事件等方面。这些规范旨在提高代码的一致性、可读性和维护性,特别适用于多人协作的项目。规范包括命名方式、组件结构、事件命名等,强调使用工具如eslint和prettier来保持代码风格的一致性。
前端
Vue
开发规范
agent-skills:Google工程师开源20个Skill,强制AI写代码守规矩
编程
agent-skills:Google工程师开源20个Skill,强制AI写代码守规矩
2026-05-15 18:35:28 +0800 CST
view 234
Google Gemini团队工程师Addy Osmani开源agent-skills,20个Skill文件覆盖完整研发生命周期,7个斜杠命令强制工程规范,解决AI写代码四大痛点。
开源项目
AI Agent
编码规范
Google工程实践
Open Design:31个Skills+72套设计系统,Claude Design的开源替代品
案例
Open Design:31个Skills+72套设计系统,Claude Design的开源替代品
2026-05-09 06:34:08 +0800 CST
view 576
Open Design开源项目:Claude Design的开源替代品,31个Skills+72套设计系统,支持16种AI CLI工具,本地运行Apache-2.0协议,多模型支持,内置图片视频生成,MCP集成
AI设计
Claude Design替代
开源设计工具
本地运行
多模型
设计系统
Vue Print Designer:可视化打印设计器,支持业务表单、标签、票据、快递单
编程
Vue Print Designer:可视化打印设计器,支持业务表单、标签、票据、快递单
2026-06-01 22:26:41 +0800 CST
view 137
Vue Print Designer是一款可视化打印设计器,面向业务表单、标签、票据、快递单等场景,支持模板化、变量化,并提供静默打印与云打印能力,同时兼容多种导出/打印方式。基于Web Components,零依赖适配Vue/React/Angular/原生HTML等所有技术栈。
Vue
打印设计器
开源
Web Components
可视化
打印
表单设计
标签打印
代码
底部导航栏
2024-11-19 01:12:32 +0800 CST
view 1554
该文本展示了一个底部导航栏的HTML和CSS实现,包含了样式设置、动画效果和JavaScript交互。导航栏使用了弹性盒布局,包含多个导航项,每个项都有不同的颜色和图标。通过JavaScript实现了点击切换选中状态的功能,增强了用户体验。整体设计注重语义化和响应式布局,适合现代网页应用。
前端开发
网页设计
用户界面
交互设计
CSS 奇技淫巧
编程
CSS 奇技淫巧
2024-11-19 08:34:21 +0800 CST
view 1607
本文介绍了一系列高效的CSS技巧,旨在帮助前端开发者减少JavaScript代码,提高代码简洁性和用户体验。涵盖了阻止文本选择、响应式字体、宽高比设置、平滑滚动、深色模式、图片填充、动态内容显示等多种实用技巧,适用于现代网页设计。
前端开发
CSS
用户体验
网页设计
响应式设计
Open Design 深度解析:开源世界的 Claude Design 替代品——当 AI 编程代理变身设计引擎
编程
Open Design 深度解析:开源世界的 Claude Design 替代品——当 AI 编程代理变身设计引擎
2026-05-01 23:15:01 +0800 CST
view 1646
深度解析 Open Design 开源项目:4天突破10000 Star的 Claude Design 替代品。不绑定模型、不锁定云服务,支持10+编程代理、31种设计技能、72个品牌设计系统,完全开源免费自托管。
开源
AI设计
Claude Design
设计系统
编程代理
代码
这是一个基于移动优先设计的简单HTML示例
2024-11-18 15:54:42 +0800 CST
view 1575
这是一个基于移动优先设计的简单HTML示例,适合手机浏览的网站结构。示例使用了响应式布局,包含头部、导航栏、主要内容和固定页脚。通过<metaname='viewport'>确保在移动设备上正确显示,并使用CSS样式优化页面布局,适应不同屏幕尺寸。
网页设计
前端开发
响应式设计
CSS 响应式图片与视频全攻略:从基础到进阶
编程
CSS 响应式图片与视频全攻略:从基础到进阶
2025-07-22 12:35:49 +0800 CST
view 946
在设备多样化的时代,响应式图片与视频技术成为提升网页性能和用户体验的关键。通过使用`srcset`、`sizes`和`<picture>`元素,开发者可以根据用户设备特性提供合适的媒体版本,避免流量浪费和加载速度拖慢。本文详细介绍了响应式图片和视频的基础与进阶方案,并提供实战建议与优化技巧。
前端开发
网页设计
响应式设计
编程
键让图片“动”起来!Magic Animator Figma 插件实测体验
2025-08-14 16:12:02 +0800 CST
view 1332
MagicAnimator是由LottieLab发布的Figma插件,能通过AI自动生成可编辑的关键帧动画。用户只需拖入图片并点击按钮,即可快速生成多种动效,支持LottieJSON、GIF和MP4格式导出。该插件简化了动画制作流程,适用于App、网页和社交媒体,提升了设计师的工作效率。
动画制作
设计工具
Figma插件
AI技术
动效设计
开源Chrome插件一键扒光网站设计:自动提取配色/字体/间距,生成AI可读的SKILL.md
编程
开源Chrome插件一键扒光网站设计:自动提取配色/字体/间距,生成AI可读的SKILL.md
2026-04-21 09:02:26 +0800 CST
view 362
design-md-chrome:Chrome插件一键提取网站设计规范(字体/配色/间距/阴影/动画),生成DESIGN.md或SKILL.md喂给Claude Code/Cursor复刻
开源
Chrome插件
设计工具
AI编程
前端
设计系统
Claude Code
Cursor
Vue3中创建一个自定义的下拉选择框组件,创建一个美观的下拉选择框,支持自定义选项
编程
Vue3中创建一个自定义的下拉选择框组件,创建一个美观的下拉选择框,支持自定义选项
2024-11-19 10:01:18 +0800 CST
view 2608
本文介绍了如何在Vue3中创建一个自定义的下拉选择框组件。通过使用setup语法糖,组件支持自定义选项和样式,提供了基本的功能如选项选择和下拉框显隐控制。还探讨了如何在父组件中使用该组件,并提出了进一步美化和功能扩展的建议,如搜索和多选功能。
前端开发
Vue
组件设计
用户界面
交互设计
动态键盘的HTML页面,包含CSS样式和JavaScript代码
代码
动态键盘的HTML页面,包含CSS样式和JavaScript代码
2024-11-18 18:19:31 +0800 CST
view 1318
该文本描述了一个动态键盘的HTML页面,包含CSS样式和JavaScript代码。页面展示了一个可交互的键盘,用户可以通过键盘输入来触发动画效果。JavaScript部分处理键盘事件,随机选择一个键并在用户按下时进行动画反馈。整体设计旨在提供一个有趣的用户体验。
网页设计
前端开发
交互设计
4400人收藏!Kami:让AI生成的文档终于有了值得一看的排版
案例
4400人收藏!Kami:让AI生成的文档终于有了值得一看的排版
2026-05-06 07:10:59 +0800 CST
view 327
4400人收藏的Kami文档设计系统,8条设计铁律让AI生成文档有专业排版,6种文档类型,12种内置SVG图表,暖米色背景+油墨蓝强调色,Serif字体印刷质感
文档设计
AI排版
Kami
PDF生成
设计系统
Claude Skill
tw93
大家都在搜索什么?
devops
易支付
一个官网+多少钱
统一接受回调
统一回调
sub
node
宝塔日志
mysql
shell
ElasticSearch
css
vue
api接口对接
2025
支付接口对接
go
php
php回调
回调
上一页
1
2
3
...
9
下一页