利用vps搭建blog（傻瓜操作篇）

在VPS上搭建1panel面板

详细步骤请参考：https://www.youtube.com/watch?v=_Cx9QYWJzvk&list=PLQ7XpN98G86WRnGK4jPNP7lDFEt1uObQc&index=2

1. 安装1panel面板

   curl -sSL https://resource.fit2cloud.com/1panel/package/quick_start.sh -o quick_start.sh && sudo bash quick_start.sh
   # 1panel官网有各个系统的部署命令
   1pctl #1panel平台命令行工具
   

2. 安装插件

   • openresty
   • mysql
   • halo （填写已经用CF代理好的域名）

利用halo搭建自己的博客

1. 搭建流程(包括证书的申请)

   • 1panel中点击网站，创建网站
   • 进入网站完成账号密码初始化
   • 在1panel-网站-证书中，启用https

2. 博客的具体设置
   进入halo后台：域名/console

   • 主题：当前主题的基本设置（类似对工具栏，侧边栏这些的设置，得试一试）
   • 设置：代码注入部分可以进行一些简单的CSS操作（例如背景），被主题定义了的东西是无法进行修改的

对于css和html的一些基本认知

1. script
   script标签用于添加 JavaScript 代码，主要用于实现网页的动态功能和交互性。通过代码注入，你可以在页面加载时执行特定的逻辑，或者响应用户的操作。

• 功能：

  • 动态操作 DOM：可以修改网页的结构、内容或样式，例如添加新元素、更改文本、隐藏/显示内容等。
  • 事件处理：监听用户的操作（如点击、鼠标悬停、键盘输入），并执行相应动作。例如，点击按钮时复制代码。
  • 数据处理：处理数据、发送网络请求（例如 AJAX 调用）、操作本地存储等。

2. style
   style 标签用于添加 CSS 样式，主要用于控制网页的外观和布局。通过代码注入，你可以自定义页面的视觉效果，覆盖默认样式。

• 功能：
  • 定义样式：设置元素的颜色、字体、大小、边距、背景等视觉属性。（动画效果本质上就是样式变化的表现）
  • 布局调整：控制元素的排列方式（例如浮动、定位、Flexbox、Grid）。
  • 交互效果：通过伪类（如 :hover、:active）实现鼠标悬停、点击等效果的样式变化。

3. script和style之间的关系

• 优先使用 <style>：
  • 如果动画效果是固定的、简单的（如背景色渐变、文字抖动、淡入淡出），直接用 CSS 实现，性能更好，代码更简洁。
  • 例如：背景闪烁、文字旋转、渐变过渡等。
• 使用 <script>（JavaScript）辅助：
  • 如果动画需要用户交互（如点击触发、鼠标跟随）、动态调整（根据条件改变速度、暂停动画）或复杂计算（例如路径动画），用 JavaScript 控制。
  • 例如：点击按钮触发动画、根据滚动位置调整动画效果。
• 协作方式：
  • 通常 CSS 定义动画效果（@keyframes 和 animation），JavaScript 负责控制动画的触发或参数调整。
  • 例如：CSS 定义一个背景色渐变动画，JavaScript 在用户点击时添加类名以触发该动画。

后续对于页面搭建的学习大纲

也不知道需要多少年才能下定决心学习这个不需要的东西，也许一辈子也不会去碰把ahah，简单的使用一下halo记录自己就行了。最后想勉励自己一下：

1. html基础学习
2. css基础学习
3. 学习后端技术（如 Node.js、Express、MongoDB），实现文章存储、评论等功能。
4. javascript基础学习