Web 技术框架概览
Web 技术框架概览现代 Web 开发中,前端框架帮助开发者以组件化的方式构建复杂界面,提升开发效率与可维护性。本文介绍当前最主流的几个 Web 前端框架,并进行横向对比与选型建议。 主流前端框架ReactReact 由 Meta(原 Facebook)开发,是目前生态最庞大的前端框架。它基于 组件 + 单向数据流 的核心理念,配合虚拟 DOM 实现高效的界面更新。 核心特点:函数式组件、Hooks、JSX 语法 适用场景:大型中后台系统、跨平台应用(React Native) 生态:Redux/Zustand(状态管理)、Next.js(服务端渲染) VueVue 由尤雨溪开发,以渐进式框架著称,上手门槛低,单文件组件(SFC)写法直观。 核心特点:响应式数据绑定、模板语法、组合式 API(Composition API) 适用场景:中后台管理界面、中小型项目、需要快速上手的场景 生态:Pinia(状态管理)、Nuxt.js(服务端渲染)、Element Plus(UI 组件库) AngularAngular 是谷歌维护的重量级框架,提供开箱即用的完整解决方案...
从零搭建 GitHub Pages 静态博客:Hexo + Butterfly + Actions 自动部署
前言这篇是博客的第一篇正式文章,顺便把“从 0 到 1 把个人博客部署到 GitHub Pages”的完整过程记下来——包括环境、配置、CI 工作流,以及几个真的会卡住新手的坑和对应解法。后面自己或别人再部署同类静态站,照着抄就能少走弯路。 技术栈:Hexo 7.3 + hexo-theme-butterfly 5.6 + GitHub Pages(用户级)+ GitHub Actions。 一、技术选型:为什么是 Hexo + Butterfly静态博客方案一大把(Hugo / Jekyll / Astro / VuePress…),选 Hexo + Butterfly 是因为它一次性满足了我的 5 条硬需求: 需求 Butterfly 表现 1. Markdown + LaTeX/KaTeX 公式 内置 mathjax 开关,装 hexo-filter-mathjax 即生效 2. 多媒体(图片 + 视频链接嵌入) 支持标准 Markdown 图片;视频用 ` 包裹 iframe 即可 | | 3. 相册 / 图集...
Hello World — 欢迎来到我的博客
你好,世界!👋欢迎来到我的个人博客!这里是 aidon 的数字花园,用于记录编程、数学与生活中的思考。 关于这个博客本博客基于以下技术栈搭建: 组件 技术选型 说明 框架 Hexo 7.x 快速、简洁且高效的 Node.js 静态博客框架 主题 Butterfly 美观、功能丰富的 Hexo 主题 托管 GitHub Pages 免费、稳定的静态网站托管服务 CI/CD GitHub Actions 自动构建与部署流水线 公式 MathJax 支持 LaTeX 数学公式渲染 搜索 本地搜索 基于 hexo-generator-searchdb 的客户端搜索 博客功能 📝 Markdown 写作 — 使用纯 Markdown 撰写文章,专注内容创作 📐 LaTeX 公式 — 支持行内公式与块级公式,适合学术写作 🖼️ 相册/图集 — 内置相册功能,方便展示图片 🏷️ 分类 & 标签 — 灵活的文章分类与标签系统 📅 时间线归档 — 按时间归档,方便回溯历史文章 🔍 本地搜索 — 无需后端服务的全文搜索 �...
多媒体与标签功能演示
Markdown 基础格式文本样式 粗体 (Bold) 斜体 (Italic) 删除线 (Strikethrough) 行内代码 (Inline Code) 超链接 引用块 (Blockquote) 列表无序列表 Hexo 博客框架 Markdown 渲染器 丰富的插件生态 Butterfly 主题 响应式设计 暗色模式支持 GitHub Pages 托管 有序列表 安装 Node.js 安装 Hexo CLI 初始化博客项目 安装 Butterfly 主题 配置并发布 代码块1234567891011def fibonacci(n: int) -> list[int]: """Generate the first n Fibonacci numbers.""" if n <= 0: return [] seq = [0, 1] for _ in range(2, n): seq.append(seq[-1] + seq[-2]) ...
LaTeX 数学公式渲染指南
概述Butterfly 主题内置了 MathJax 支持,只需在文章 Front-matter 中设置 mathjax: true 即可启用 LaTeX 公式渲染。 行内公式行内公式使用 $...$ 包裹,例如: 欧拉公式:$e^{i\pi} + 1 = 0$ 勾股定理:$a^2 + b^2 = c^2$ 质能方程:$E = mc^2$ 正态分布:$f(x) = \frac{1}{\sigma\sqrt{2\pi}} e^{-\frac{(x-\mu)^2}{2\sigma^2}}$ 块级公式柯西-施瓦茨不等式$$\left( \sum_{k=1}^{n} a_k b_k \right)^2 \leq\left( \sum_{k=1}^{n} a_k^2 \right)\left( \sum_{k=1}^{n} b_k^2 \right)$$ 傅里叶变换$$\mathcal{F}{f(t)} = F(\omega) = \int_{-\infty}^{\infty} f(t) e^{-i...