产品信息
- 形态
- AI技能 & 智能体
- 分类
- 教育与科研 › 编程学习
- 定价
- 开源
- 平台
- Web
- 授权协议
- MIT
- 首发日期
- 2026年9月26日
- 收录时间
- 2026年9月26日
概览
Web Skills 是一个开源项目，以可视化的方式梳理了 Web 开发者需要学习的各项技能。它由 Andreas 维护，在 GitHub 上获得了超过 7600 个 star。 该项目将 Web 开发知识体系划分为多个主要模块，包括： - **Fundamentals**：涵盖 HTML、CSS、JavaScript 的基础语法与核心概念，以及浏览器原理、HTTP 协议和调试方法。 - **Accessibility**：涉及屏幕阅读器、ARIA、键盘可访问性、无障碍表单与颜色对比度等内容。 - **Web Components**：介绍 Custom Elements、Shadow DOM、HTML Templates 等原生组件技术。 - **Progressive Webapps**：覆盖 Service Workers、离线优先策略、性能指标（如 LCP、TBT）、渲染性能、安全策略（HTTPS、CSP、OWASP）等 PWA 相关知识。 - **Build tools**：列举了 NPM、Yarn、Webpack、Rollup、Babel、TypeScript、ESLint、Prettier 等常用构建与工程化工具。 - **Frameworks & Libraries**：提及 Vue、React、Angular、Svelte、lit-element、Stencil 等前端框架。 - **Testing**：包含单元测试、集成测试、系统测试、验收测试等方法论。 用户可以通过在线页面查看交互式可视化图谱，也可以在 README 中以列表形式浏览全部技能点。该项目适合希望系统性了解 Web 开发知识版图的学习者，或用于团队内部评估技能覆盖情况的参考。
功能特性
- 可视化技能图谱：通过在线页面以图形化方式展示 Web 开发技能树，便于直观浏览。
- 基础知识模块：涵盖 HTML、CSS、JavaScript 语法、DOM 操作、正则、异步编程等核心内容。
- 无障碍访问指南：整理 ARIA、屏幕阅读器支持、键盘导航、无障碍表单等 Accessibility 知识点。
- Web Components 梳理：包含 Custom Elements、Shadow DOM、Slots、Constructible Stylesheets 等技术。
- PWA 与性能优化：覆盖 Service Workers、离线策略、Lighthouse 指标、渲染管线、代码分割等内容。
- 构建工具清单：列出 NPM、Webpack、Rollup、Babel、TypeScript、ESLint 等工程化工具。
- 框架与库参考：提及 Vue、React、Angular、Svelte、lit-element 等主流前端框架。
- 测试方法论：包含单元测试、集成测试、系统测试、验收测试、冒烟测试等分类。
版本更新
新版本提醒我
首个版本 · Web SkillsQ&A
- Web Skills 是什么？由 AI 生成
- Web Skills 是一份面向 Web 开发者的技能可视化概览，以图谱和列表的形式整理了从基础到进阶的各项技术知识点。
- 在哪里可以查看这个技能图谱？由 AI 生成
- 可以访问 https://andreasbm.github.io/web-skills 查看交互式可视化版本，或者直接在 GitHub 仓库的 README 中以列表形式浏览。
- 这个项目涵盖了哪些技术领域？由 AI 生成
- 主要包括 Fundamentals（HTML/CSS/JS/浏览器）、Accessibility、Web Components、Progressive Webapps、Build tools、Frameworks & Libraries 和 Testing。
- 技能是如何选择的？由 AI 生成
- 原文 README 目录中包含 "How did you choose the skills?" 这一 FAQ 条目，但正文截断未展示具体回答内容。
- 为什么没有包含某个特定技术？由 AI 生成
- 原文 FAQ 中包含 "Why haven't you included XYZ Technology?" 这一问题，但具体解释因文本截断未显示。
收藏
这个产品还没有主理人
由平台收录或原作者已注销。如果它是你的作品，证明与它的关系后即可成为主理人。
认领这个产品