面向新手的完整网站开发路线图

由 Mux 赞助的 DEV 全球展示挑战赛：展示你的项目！

对于技术新手来说，知道该学什么以及学习顺序往往是个难题。Web 开发生态系统中编程语言种类繁多，工具也琳琅满目，很容易让人迷失在茫然无措的漩涡中。

因此，我为新手和有志成为网页开发者的人士制定了一份简短而精炼的网页开发路线图，以及相应的资源。

目录

• 学习 HTML
• 学习 CSS（及框架）
• 学习 JavaScript
• 学习 React、Vue 或 Angular
• 学习WordPress的基础知识
• 学习服务器端语言/框架
• 学习 SQL 或 NoSQL，或者两者都学。
• 学习 Git 和任何公共仓库
• 学习开发者工具
• 学习SEO
• 找到你的第一个客户

学习 HTML

HTML 是网页的标记语言。有了它，你可以给文本添加下划线、粗体、斜体等效果。你还可以创建导航、表单以及许多其他网页元素。HTML 的主要用途是为网页构建结构。与其他语言相比，HTML 无疑是最容易学习的。而W3Schools
就是学习 HTML 的最佳平台之一。

学习 CSS（及框架）

CSS（层叠样式表）用于设置HTML元素的样式。如果没有CSS，整个网页看起来会很单调。CSS还可以用来创建简单而又引人注目的过渡效果和动画。

想了解更多关于 CSS 的知识吗？观看 Brad Traversy 在 YouTube 上发布的这门入门速成课程：

CSS 由 TraversyMedia 提供

学习 JavaScript

JavaScript 用于使网页更具动态效果。动画、提示框、计时器、动态按钮等功能都可以轻松使用 JavaScript 实现。借助 JavaScript，您可以编写脚本和逻辑，并在事件触发时执行。JavaScript 是一种多范式的高级语言，它已发展成为最流行的语言之一，不仅在 Web 开发领域，而且在许多其他领域也广受欢迎。

Mozilla开发者网络以其详尽全面的JavaScript学习指南而闻名。

MDN 的 JavaScript 指南

学习 React 或 Vue（或 Angular）

这些是前端 JavaScript 框架/库。它们让编写 JavaScript 代码变得更轻松快捷。因此，您可以忽略基础规则，快速创建动态应用程序。它们用于创建单页应用程序，即只有一个页面（通常是 index.html）的应用程序。然后使用路由（通过 JavaScript）将页面映射到其他资源。

在 YouTube 上可以学习这两本书：

React 速成课程
VUE 速成课程

学习 WordPress 基础知识

WordPress 是一款内容管理系统，它能让你以惊人的速度创建 Web 应用程序，而无需掌握任何编程知识。只需少量培训，你就能使用 WordPress。

使用 WordPress 创建博客

学习 PHP、Python 或 Node

这些都是用于创建服务器端应用程序的服务器端语言/技术，即不在浏览器上运行，而是在 Web 服务器上运行的应用程序。创建此类应用程序的一些好处包括更高的安全性和搜索引擎优化 (SEO)。

Node 速成
Python 教程

学习 SQL 和（或）NoSQL

SQL数据库系统使用表格关系模型来表示数据及其关系。NoSQL提供了一种不同于关系数据库中使用的表格关系模型的数据存储和检索机制。SQL数据库的例子包括MySQL、Oracle、PostgreSQL和Microsoft SQL Server。NoSQL数据库的例子包括MongoDB、BigTable、Redis、RavenDB、Cassandra、HBase、Neo4j和CouchDB。数据库本质上是数据的容器。

SQL入门视频

学习 Git 和 GitHub

Git 是一款版本控制工具，用于管理和跟踪源代码的所有更改。GitHub 就是一个公共代码仓库，任何人都可以上传、存储和管理他们的源代码。
想要深入学习 Git，没有比这个网站更好的地方了：

Git 深度课程

学习开发工具

Chrome DevTools 是最流行的应用调试和评估工具之一，但市面上还有许多其他选择。Brad Travery 的 DevTools 速成课程就能满足你的需求：
DevTools 课程

学习SEO

SEO 代表搜索引擎优化，它包含了搜索引擎（例如 Google）如何对网站进行排名的规则。如果您想创建需要自然流量的专业网站，那么学习 SEO 非常重要。我找到了一篇很棒的 SEO 入门文章：
SEO 深度解析

寻找你的第一个客户（自由职业）

到了这一步，你应该已经准备好找到你的第一份开发人员工作了。你可以以自由职业者的身份，通过以下平台找到工作：

• Fiverr
• Upwork
• 顶层
• 古鲁
• 自由职业者
• 每小时人数
• Upstack
• Github 招聘信息

遇到问题时，请访问这些平台。

• 谷歌（搜索你的问题）
• Stack Overflow
• YouTube

持续学习，持续练习，持续进步。

你也可以在推特上联系我。

再见！

附言：我的私人博客在这里