免费学习 Web 开发
1 编程简介
2 Web开发简介
3 Web开发基础知识
4 掌握 Web 开发
5 继续学习
动机和背景
我弟弟最近对编程越来越感兴趣。数据科学、人工智能、Web 开发……你知道,所有那些很酷的东西。最终,他有了足够的动力开始学习 Web 开发,并问我该如何入门。我并非 Web 开发专家(我更偏向数据科学),但作为一名前教师,我很想设计一套适合初学者的“课程”。
他以前接触过HTML,可能还接触过一门编程语言。但那已经是近二十年前的事了,我弟弟当时还没真正掌握这些语言,之后也没再做过任何编程工作。所以我可以把他当成一个完全的初学者。有几点我必须牢记:
- 时间:我弟弟全职工作,还要照顾孩子。我只能采取极简主义的学习方式。edX.org 上的哈佛大学 CS50 课程非常棒——他们为完全的初学者讲授计算机科学的基础知识,并包含一门使用 Python 的 Web 开发课程。但在学习 Web 开发之前,课程会讲解很多 C 语言的编程知识。此外,除非你注册,否则你通常无法跟上他们课堂上的代码,因为他们有时会使用 CS50 特定的工具。我不得不混合搭配不同的资源,让它们更好地融合在一起。
- 便捷性:我弟弟热衷于在繁忙的工作和生活之余学习。我希望学习尽可能长时间基于浏览器。对于初学者来说,安装工具和设置环境可能比较棘手,而且他的办公电脑是 Windows,而家用电脑是 Mac。初学者最好直接开始学习代码,因为尝试使用各种工具可能会令人望而生畏,甚至令人望而却步。
- 教学法:我不想听起来太像一位前教师,但学习过程中确实存在更合理的循序渐进方法。应该先介绍一些不太复杂的概念,然后再介绍更复杂的概念。这听起来显而易见,但有些课程侧重于就业准备,因此会尝试尽快掌握最流行的工具。例如,在前端 SPA 技术中,Svelte 似乎是最容易上手的选择,但大多数课程也提供 React 课程。
- 文档:关于通过视频学习和通过阅读学习,有很多值得探讨的地方。这里我就不多说了,但可以肯定的是,所有开发人员在某些时候都需要学习如何阅读文档。但并非所有文档都一样。遵循 FastAPI 的文档比遵循 Flask 的文档容易得多,尽管 Flask 的教程更多。我提出的选择需要考虑视频和文档的结合是否能清晰地解释某些内容。
- 语言:HTML、CSS、JavaScript 和 SQL 是必备的。理论上来说,这些应该足够了,Node.js 和 Express.js 基本涵盖了 Web 开发的后端部分。但我弟弟最初也对数据科学感兴趣,现在也一样。所以我觉得现在开始学习 Python 是个不错的选择。
哦,我想收集完全免费的资源。
所有这些考虑的结果是,我设计了一门课程,名为“兄弟版 Web 开发”。如果你也处于类似的情况,在没有任何编程经验的情况下开始 Web 开发,而且时间又不多,那么你可能会觉得这门课程很有用。课程内容如下:
1 编程简介
1.1 HTML/CSS
只需完成基本教程即可。无需完成所有教程。
1.2 JavaScript
只需完成基本教程即可。无需完成所有教程。
1.3 Python
只需完成基本教程即可。无需完成所有教程。
1.4 SQL
仅针对基础教程和 SQL 数据库教程。
2 Web开发简介
2.1 概念
只需观看即可。无需跟读。只需尝试熟悉这些概念即可。
2.2 工具和设置
这些教程主要讲解如何成为一名 JavaScript 和 Python 开发者所需的工具。请按照教程进行安装并熟悉这些工具。您无需完全熟悉这些工具。目前,只需安装这些工具即可。所有后续课程都将提供一些关于如何使用这些工具的指导。
VS 代码
JavaScript 和 npm
Python 和 pipenv
管理 Python 项目环境的方法有很多。Pipenv 应该是“最佳”的,但之后的一些教程会使用虚拟环境 (virtualenv)。这两种方法都很好,而且这些教程会教你如何使用虚拟环境。在你自己的项目上,可以尝试使用 pipenv。
Git/GitHub
SQLite 和 PostgreSQL
数据库有很多种。其中最流行的有 PostgreSQL、MySQL 和 MongoDB。大多数情况下,PostgreSQL 是最佳选择。所有这些数据库都需要一个数据库“服务器”。这可能比较繁琐,因此开发人员通常在开发阶段使用 SQLite,然后在生产阶段切换到 PostgreSQL。因此,了解一些 SQLite 和 PostgreSQL 的知识是很有好处的。SQL 语言基本相同,所以 W3School 上讲过的内容中并没有什么“新”内容需要学习,但这里有一些关于如何使用 SQLite 和 PostgreSQL 的教程。
2.3 实践
继续学习本入门教程。教程中会涉及一个之前从未介绍过的概念,即 ORM,它将使用一个名为 SQLAlchemy 的工具。别担心,现在只需将其作为入门教程即可。后续会逐步讲解。
🍎至此,您应该对如何制作小型简单的 Web 应用程序有一个基本的了解。
3 Web开发基础知识
3.1 概念
从现在开始,我们将更加深入地学习。观看以下视频讲座。无需完全照着做,但有些讲座可能需要反复观看几遍才能真正理解其中的概念。
CS50 使用 Python 和 JavaScript 进行 Web 编程 - YouTube
3.2 实践
学习以下教程,练习后端和前端 Web 开发。有些教程可能类似,但为了练习,所有教程都值得一看。每个教程的重点略有不同,因此值得全部学习。请注意,您将逐步实现前端与后端的分离。后端提供 API,前端使用 API。
后端
按照本教程使用 Flask 构建完整的 Web 应用程序。
虽然可以使用 Flask 及其模板构建完整的应用程序,但现代应用程序通常将后端与前端分离。这意味着 Flask 仅用于提供应用程序前端部分可以使用的 API。
有一款工具可以帮助您在构建前端之前测试这些 API,它就是 Postman。与其他工具视频一样,您无需记住所有内容,只需安装 Postman 并熟悉它即可。
现在按照本教程构建 API。
前端
前端框架有很多,其中最容易上手的就是 Svelte。跟着本教程一起体验吧。
你可能会觉得需要回头修改一下 JavaScript。这很正常,根据需要回归基础也无妨。但为了展示 Svelte 的使用体验有多么简单,这里有一个 3 分钟的教程,教你如何用 15 行代码构建一个待办事项应用。
这里有一个更长的教程,您可以参考它来构建一个稍微复杂一点的待办事项应用。此外,本教程的最后部分还介绍了如何将这类前端应用连接到后端 API。
🔥到目前为止,您应该对如何制作简单的 Web 应用程序有相当好的了解。
4 掌握 Web 开发
您已经准备好开始构建业余 Web 应用了。为了更上一层楼,您需要精通至少一个前端框架(您已经了解过 Svelte)和至少一个后端框架(您已经了解过 Flask 和 Django)。此外,您还需要熟悉在线部署 Web 应用(例如 Heroku)。所有这些的基础是精通 Python 和 JavaScript。
4.1 学习前端“框架”
这里有很多选择:
- 苗条
- Vue
- 角度
- 反应
选择一种并精通它。Svelte是最优雅、最容易学习的,也是前端技术的最佳入门工具。官方文档中有一个很棒的教程。
要想找到前端开发的工作,你需要了解一些流行的工具。接下来我会学习Vue。这是可选的,我会先尝试用 Svelte 开发一些 Web 应用。
4.2 学习后端“框架”
这里也有很多选择:
- 烧瓶
- Django
- 快速API
- 表达
与前端一样,选择一个并精通它。FastAPI是最现代的 Python 框架。官方文档提供了很棒的教程。事实上,FastAPI 拥有最好的官方教程,涵盖了包括安全性在内的许多概念。然而,它在 YouTube 或其他地方还没有太多的视频教程。该框架的设计与 Flask 非常相似,因此知识应该可以迁移。
在 Python 世界中,最流行的框架是Flask和Django。但后端开发市场却被细分为 Python、JavaScript、Ruby、PHP、Java Scala、Go、Rust 以及其他许多语言。我会坚持使用 Python 和 JavaScript。对于 JavaScript 来说,Express是最流行的后端框架。接下来我会学习Express。同样,这是可选的,我会先尝试使用 FastAPI 开发一些 Web 应用。
4.3 了解如何部署 Web 应用
这里有很多选择,而且情况一直在变化。以下是一些入门建议:
- Docker
- 赫罗库
- Firebase
真的,这些东西太棒了。真的太棒了。网上应该有很多关于如何使用这些工具的教程。下面的一些 YouTube 频道会有很多关于这些工具的教程。
😎兄弟,现在你就可以出发了。你成功了。
5 继续学习
YouTube
- 特拉弗西媒体
- 学术思想
- 网络忍者
- 火船
- 精美印刷
- 代码滴灌
- 简化 Web 开发
- 与 Tim 一起科技
- 科里·谢弗
- 苗条大师
Udemy
他们经常会推出大折扣。所以,有折扣的时候,不妨买一些你感兴趣的课程。Svelte、Vue、Flask、Express、Heroku、Docker、Firebase、身份验证、支付等等。
文章来源:https://dev.to/minchulkim87/learn-web-development-for-free-56of