大家好，这里是副业巴巴,我们的养网站防老系列已经连载了11篇文章了：
养网站防老第3步：根据搜索意图使用ChatGPT的GPT4生成网页
养网站防老第8步：添加统计代码，提交到 Google Search Console，增加外链，等待被收录
养网站防老第9步：谷歌对于AI生成内容的态度及如何让AI生成高质量内容
时不时有朋友问站长，没有基础可以养网站防老，做网站赚美元吗？
所以今天站长增加一个第0步，教你怎么去自学前端开发入门。
站长很推荐所有没有前端基础或者没有编程基础的朋友学习B站的这个前端入门视频教程：
教程网址： https://www.bilibili.com/video/BV1Wr4y1R7Bd/
这是一个很好的前端入门教程，最好的地方是，他只讲用 HTML 和 CSS 来制作网页，没有一上来就让你学 Vue 或者 React 。
而站长讲的做出海工具网站赚美元，其实大多数时候，有了 HTML 和 CSS，再配合一点原生 JS 知识就可以了。
所以，这是一个很适合大家入门学习前端的视频课程。
看看大纲，全是干货，没有废话：
? 内容纲要
00:00 开场白
01:19 建立 HTML 文件结构
02:50 HTML 常用标签
06:54 如何用 CSS 修改样式
09:29 HTML5 语义标签（Semantic Elements）
10:28 CSS 盒子模型 (Box Model)
14:08 CSS Position 布局
16:12 CSS Class 选择器
17:42 CSS Flexbox 布局
22:38 HTML 表单设计
24:31 使用 CSS 固定导航栏
25:22 CSS 响应式设计 (Responsive Design)
https://www.bilibili.com/video/BV1Wr4y1R7Bd/
B站有个评论说“三十分钟讲了我们老师一学期讲的”，从这就可以看出这个视频的含金量了。
那么你要怎么学呢？
视频很短，只有28.5分钟，所以第一遍，你只需要跟着看，不要动手操作，就看，看完了，你就对整体有了一个大概的了解。
视频里写代码用的是 VSCode ，电脑是 MacOS 系统，你的电脑如果是 Windows 系统，一些操作可能会有点不太一样，但没关系，不一定要严格的按照他的操作一步一步做，你先理解他的操作目的是什么，然后你在你的电脑里做到同样的目的就行。
第一遍看完了之后，你就去下载 VSCode ，如果你下载不到，也没关系，直接用电脑自带的任何一个能够纯文本编辑器就行，如记事本，只要别用 Word ，都没问题。
站长觉得学前端最好的地方就是，你完全不用任何别的软件，就用 Windows 自带的记事本和浏览器就可以开始学，入门门槛极低。
如果你的电脑没有谷歌浏览器也没关系，有什么浏览器就用什么。
总之，不要把时间浪费在安装教程里的一模一样的软件上。
第二遍，你就可以跟着视频开始一步一步做了，任何搞不懂不知道怎么做的地方，可以去百度，可以去问ChatGPT，直到搞懂为止。
总之，不要遇到一点困难，你就放弃。
如果你利用工作之余的时间来学习，那么2周的时间是足够学完的。
2周之后，你就可以自己徒手写前端网页了。
然后你就可以开始学原生 JS 知识了，这个时候，你就没必要去跟着视频学习了，直接打开 MDN ，了解一下 JS 是什么，能干什么，把快速入门学完。
网址： https://developer.mozilla.org/zh-CN/docs/Web/JavaScript 。
再下一步，你就没必要把 JS 所有知识学完了，你把 MDN 当作手册，去翻你网页里某个按钮点击之后，假如要获取某个输入框的值，然后在网页的另一个地方显示出来，要怎么做。也就是去学习 JS 事件的用法。
学会这个就足够了，然后你就可以去做一个在线闹钟网页工具，需求是网页里有一个时间选择框，可以选择未来2小时内的某个时间点，然后点击确定按钮，网页开始倒计时，每秒变动一次，到了0秒，网页播放一段音乐。
能做出这么一个可交互的网页，并且布局合理的话，你就算前端入门了。
后面需要用到什么，再去学什么就行。
至于要不要去学 Vue ，建议你先用原生的 HTML+CSS+JS 做几个网站再说。
至少做了3个网站后，你就会发现，有一些原生代码不太方便的地方，那么可以再去学习 jQuery 或者 Vue 。
一定记住，我们目的是做网站赚钱，不是学前端去找前端开发工作，所以用到什么学什么就行，只要能够实现网页功能就行，没必要一定追求用 Vue 。
因为你一旦接触了 Vue ，你就会掉入一个大坑，需要学习的知识增加N倍。
花费在学习的时间会增加N倍，极容易半途而废。
月入25万美元的 Levels 还在用 PHP+jQuery ，但是一点也不妨碍他做的网站赚钱。
好了，今天的文章就到这里了。
