石头的学习小站

石头，一名 Web 前端开发者

我在这里记录学习前端的过程：从 HTML 结构与 CSS 布局，到 JavaScript 的运行机制和 React 的组件写法。笔记按主题整理，适合刚开始学、或者想回头查一段原理的人慢慢读。

开始阅读关于我

HTML · CSS · JAVASCRIPT · REACT

石头

精选笔记

查看全部文章
浏览器中展示 Flexbox 主轴与交叉轴对齐关系的示意图
CSS 布局与样式约 8 分钟

Flex 布局的三个属性，先把主轴想清楚

刚学 Flex 时最容易把 justify-content 和 align-items 记混。这篇笔记从主轴出发，把方向、对齐与伸缩三件事拆开，再说明什么时候应该换成 Grid。

Flex布局
纸面手绘的 JavaScript 事件循环与任务队列时间线示意
JavaScript 核心约 6 分钟

把事件循环讲成一句话：先同步，再微任务

面试里常被问到的事件循环，本质上是一轮一轮的清空顺序。这篇笔记用最小的例子说明同步代码、微任务与渲染之间的关系。

事件循环异步
代码编辑器中展示 React Hooks 的 useEffect 代码片段
React 实践约 9 分钟

useEffect 到底什么时候执行：依赖数组与渲染的关系

把 useEffect 当成生命周期来记，很容易写出重复请求和内存泄漏。这篇笔记从渲染结果出发，说明依赖数组、清理函数与请求时机。

Hooks副作用

按主题找内容

HTML 基础文档结构、语义标签与可访问性的起点1 篇CSS 布局与样式盒模型、Flex 与 Grid，把页面排整齐2 篇JavaScript 核心作用域、异步与浏览器里的运行机制2 篇React 实践组件、状态与 Hooks 的日常写法2 篇

关于我

我是石头，平时写前端页面，也把学到的东西整理成笔记。这个站点不是教程合集，而是我按自己的理解重写过的内容：先把概念讲清楚，再给能跑的例子，最后说明哪里容易出错。

HTML · CSS · JavaScript · React · 响应式布局 · 组件状态

了解更多