前端学习笔记

碎碎念

查看隐藏内容： >folded

qwq;

到现在，从自己第一次接触前端（最普通的 HTML + CSS + JavaScript），好像已经五年了。

最开始是在葫芦侠看到了类似“从零搭建网页”的帖子，下载了楼主分享的源码，然后照着教程，申请了免费主机，把源码部署上。

当时觉得这可太酷了（还发给同学炫耀~

… …

之后看了菜鸟教程，w3school 的文字教程，学了最简单的 html 标签，css 样式，js 好像没看懂（原谅我初中的无知= =）

然后就会自己“写”网页了（指把别人源码的署名改成自己的 <-不好的行为不要学习！QAQ 或在网上加上自己的网名 有点参与感

… …

然后没然后了，后面了解了 Nodejs，学了 Vue Vite 直接开始套别人写好的框架或者组件库了。

所以貌似我对前端三件套 还停留到最基础的层面，知道 HTML 有标签，div 容器，CSS 有 id，class…（@media * 是什么都不知道）

再加上步入大学，AI 更加成熟了，22 年年底我还写了 gpt3.5 的一个 QQ 机器人，当时就找个乐子，AI 说的话模糊不清。实在没想到，现在 AI 已经能够轻松实现Web全栈开发了。

哈，虽然大一，找工作还有段时间，但感觉前途一片完蛋啊（）

所以准备重学一遍，记一遍从零开始的笔记 <-尽可能足够完整

同时还会有各个阶段的小案例。

---

开始

我想我会按照下面逐步进行（从上往下）：

即大致阶段为：

前置知识 -> 基础页面 -> 入门网页设计 -> NodeJs，代码质量 -> 进阶前端框架 -> 不只是网页

在逐步学习过程中，会有一些阶段性任务和部署网页小实践（让你的网页在互联网上立足！）

如果你准备好了，那就让我们开始吧！

前置知识

目前前置知识都是融合在各个小节中，这里就不做添加了 =w=

一阶段：基础页面

我们平时看到的网页界面其实最后都是由 HTML，CSS，JavaScript 三种语言展现的。前端离不开这三部分，就像数学离不开加减乘除一样，它们是最基础的。它们三个很好概括，依次是网页结构语言-HTML，网页样式语言-CSS，网页脚本语言-JavaScript（简写 js）

HTML

1. HTML 全称 HyperText Markup Language，超文本标记语言。

2. 超文本（HyperText）指展示的不再是普通的文本，还可以包含超链接（Hyperlinks），让用户可以在页面间跳转。

3. 标记语言（Markup Language）指的是用标签（如 <h1>、<p>、<a>等）来标记文本的结构或内容。这些标签告诉浏览器如何显示和组织页面的内容，从而形成用户看到的网页。

其他文章：HTML 基础 - 学习 Web 开发 | MDN