2020 年 6 个月 Web 开发精通计划——免费
你想成为一名网页开发人员吗？如果你一直想进入网页开发领域，却不知从何入手，那么你来对地方了。在本指南中，我将带你了解为期六个月的网页开发精通计划，助你掌握网页开发技能。
工具、语言和框架
在网页开发中，主要使用的三种语言是 HTML、CSS 和 JavaScript。HTML 代表超文本标记语言（Hyper Text Markup Language）。HTML 允许用户设计要在网页上显示的文档。CSS 代表层叠样式表（Cascading Style Sheets）。CSS 是一种用于设置网站样式的语言，包括颜色、布局等等。JavaScript（有时也称为 JS）是一种编程语言，它使网页具有交互性。例如，点击按钮时发生的情况就是由 JavaScript 控制的。
框架是一段预构建的软件，可以用 JavaScript 编写（但不一定），它可以增强网页功能，简化前端开发体验。前端框架控制用户界面（用户看到的内容）。三大主流前端框架是 Vue、Angular 和 React JS。在我看来，React JS 是最流行、也是最好的前端框架。React JS 之所以在 2020 年成为最流行的前端框架，是因为它高度可定制、轻量级且功能强大。使用 React JS 的网站包括 Instagram、Netflix、Facebook、Uber 等等。后端框架则简化了服务器的创建。本计划将包含一些最流行的后端框架：Node.js、Express.js、GraphQL 等
。
要存储网站信息，你需要一个数据库。PostgreSQL 是 2020 年最流行的数据库。这是因为 PostgreSQL 功能强大，而且对于初学者来说非常容易上手。PostgreSQL 也能完美处理任何规模的数据，无论数据量大小。 （
图片用于帖子）
第一个月
第一个月主要学习基础知识，熟悉编程和开发工具。你会深入学习 CSS、HTML、JavaScript，以及一些 React、Node 和 Express 的内容。我建议使用 VSCode 作为代码编辑器（编写代码的地方），并学习一些 Git 和 GitHub（版本控制系统和开发者共享代码的平台）。我会推荐一些免费和付费课程。我刚开始学习 Web 开发时选择了付费课程，并从中受益匪浅。但如果你预算有限，免费课程也完全够用。
课程推荐：
免费：
HTML：https://www.youtube.com/watch
?v=pQN-pnXPaVg CSS：https: //youtu.be/ieTHC78giGQ
JavaScript：https: //youtu.be/W6NZfCO5SIk
React：https://youtu.be/DLX62G4lc44
付费： https: //www.udemy.com/course/the-complete-web-developer-zero-to-mastery/
第二个月
第二个月，你可以开始独立完成项目，并逐渐熟悉开发工具、语言和框架。我建议你选择以下几个 React 项目之一进行独立开发：计算器、天气应用、随机名言生成器或投票系统。如果你遇到问题，Stack Overflow 是一个很棒的社区，开发者们会在那里互相帮助解决问题。完成一些基础的 React 项目后，我建议你学习数据结构和算法。这些内容可能比较难，也更偏重理论，但我保证绝对值得。数据结构和算法在你选择的任何 Web 开发领域都至关重要。我推荐这个课程：https://youtu.be/t2CEgPsws3U。学习完数据结构和算法后，我鼓励你用 React 创建一个数据结构或算法可视化工具。例如，排序可视化工具、路径查找可视化工具或二叉树可视化工具。这将加深你对所选数据结构或算法的理解。记得把这个项目分享到 GitHub 上。如果你还不知道 Git 或 Github 是什么，我推荐这个迷你课程：https://youtu.be/DVRQoVRzMIY。
第三个月
本月的重点是掌握基础知识，并逐步过渡到中级和高级主题。我建议你使用 React 和 Firebase 自行创建一个实时聊天应用程序。务必使用 React Hooks 和最新的 React 标准（例如函数式组件）。之后，我建议你学习 TypeScript。TypeScript 为 JavaScript 添加了类型定义。虽然这不是必须的，但你未来在工作中很可能会用到它。大多数人在大型项目中更倾向于使用 TypeScript，因为它比 JavaScript 更具可扩展性和安全性。我建议你阅读 TypeScript 文档，因为你现在已经是一名中级开发者，应该学习如何有效地阅读文档。之后，我建议你观看这个关于如何在 React 中实现 TypeScript 的教程：https://www.youtube.com/watch?v =Z5iWr6Srsj8。本月最后，我建议你观看这个教程：https://youtu.be/Fy9SdZLBTOo，但要用 TypeScript 来实现。
第四个月
好了。你现在已经是一名相当专业的开发者了，已经投入了三个月的时间学习 Web 开发。我推荐你学习这个课程，它能帮你完成迄今为止最复杂的项目（再次强调，尽量使用 TypeScript）：https://youtu.be/7qAXvOFhlDc。之后，我建议你使用之前教程中学到的 PERN + TypeScript 技术栈做一个博客网站（甚至可以做一个 Medium 的克隆版）。博客网站完成后，我建议你学习 GraphQL。就像你学习 TypeScript 一样，阅读 GraphQL 的文档来学习它。掌握了 GraphQL 的基础知识后，学习如何用它创建一个 REST API。你可以做任何你喜欢的全栈项目。为了结束这个月的学习，可以在 LeetCode 上做一些有趣的编程题。这些题目可以提升你的数据结构和算法技能，同时也能让你体验到解决问题的乐趣！
第五个月
你的六个月计划即将完成。现在是时候掌握前端、后端和数据库之间的连接了。本教程完美地总结了你目前为止所学的知识，涵盖了 GraphQL、TypeScript、PostgreSQL、React 和 Express，并会教你一些新的框架和工具。本教程的链接是：https://youtu.be/I6ypD7qv3Z8。在学习本教程以及本月剩余时间里，尝试每天在 LeetCode 上完成 1 到 2 道简单/中等难度的题目。完成教程后，可以添加更多功能，例如用户页面、评论、话题标签/标签等等，尽情发挥你的创造力！如果你还有时间，我鼓励你继续完善“Reddit 克隆”项目。
第六个月
这是最后一个月了，即将完成！你已经完成了许多令人印象深刻的项目。不妨浏览一下 GitHub，找到一些对你影响深远的项目（例如 VSCode）。为了积累开源经验，可以为你最喜欢的项目添加一些新功能。参与开源项目是与其他开发者共同开发产品、解决实际问题的绝佳途径。由于开源项目需要保持一定的代码质量，因此参与开源项目也有助于提升你的代码的可扩展性、可重用性和可理解性。此外，还可以创建一个全栈作品集，展示你迄今为止完成的优秀项目。
感谢阅读我的《六个月 Web 开发精通计划》。祝你在成为顶尖开发者的道路上一切顺利！
亨利
视觉表现：