推荐一些免费资源，包括网站、书籍和教程，帮助你在 2025 年成为一名前端开发人员

# Web 开发# JavaScript# 编程# 初学者

以下是精选的免费资源列表，包括网站、书籍和教程，可帮助您在 2025 年成为前端开发人员：

Github链接：

  • https://github.com/dypsilon/frontend-dev-bookmarks
  • https://github.com/web-padawan/awesome-web-components
  • https://github.com/thedaviddias/Front-End-Checklist
  • https://github.com/kamranahmedse/developer-roadmap
  • https://github.com/trendmicro-frontend/awesome

    • 1. 核心基础

    HTML 和 CSS

  • 网站：MDN Web Docs - HTML MDN Web Docs - CSS freeCodeCamp - 响应式网页设计
  • 教程：HTML 和 CSS 速成课程 (Traversy Media) Kevin Powell 的 YouTube 频道 (CSS 技巧)
  • 书籍：Jon Duckett 著《HTML 和 CSS：设计和构建网站》（部分图书馆有售或在线 PDF）

    • JavaScript (ES6+)

  • 网站：JavaScript.info Eloquent JavaScript（免费在线书籍）freeCodeCamp - JavaScript 算法和数据结构 使用 Mosh Vanilla Javascript 进行编程
  • 教程：JavaScript 完整课程 (freeCodeCamp) Traversy Media - JavaScript 速成课程
  • 书籍：Kyle Simpson 的《你不知道 JS》（YDKJS）系列（GitHub 上免费：链接）

    • 2. CSS 精通

  • 网站：CSS 技巧学习 CSS (Web.dev)
  • 教程：CSS 网格和 Flexbox (Traversy Media) 免费 CSS Flexbox 和网格游戏

    • 3. 前端框架和库

    React.js

  • 网站：React 官方文档 freeCodeCamp - 前端开发库
  • 教程：React 速成课程 (Traversy Media) The Net Ninja - React 教程
  • 书籍：Fullstack React（旧版本可在网上免费获取或在图书馆获取）

    • 4. TypeScript

  • 网站：TypeScript 文档 freeCodeCamp - TypeScript 手册
  • 教程：TypeScript 速成课程 (Traversy Media) TekTutorialsHub-Logo

    • 5. 现代前端框架

    Next.js

  • 网站：Next.js 官方文档 学习 Next.js (Vercel)
  • 教程：Next.js 速成课程 (Traversy Media)

    • 6.性能与测试

  • 网站：Google Web Dev Guides（性能）Jest 文档
  • 教程：Cypress 端到端测试

    • 7. UI / UX设计

  • 网站：DesignCourse YouTube 频道 Figma for Beginners
  • 书籍：史蒂夫·克鲁格的《别让我思考》

    • 8. 奖励资源

  • 时事通讯和博客：Smashing Magazine 前端焦点
  • 开源贡献：开源新手指南
  • 实践项目：前端导师 freeCodeCamp 项目
  • 社区：Dev.to Reddit - WebDev