+
+ 光速搭建个人博客网站! +
+
+ +

授课笔记

怎么样制作一个公开的网站

工具

    +
  • 网站的源代码
  • +
  • IP地址/域名
  • +
  • 维护方式
  • +
  • 现成的框架与开源的社区
      +
    • Wordpress
    • +
    • Typecho
    • +
    • Hexo
    • +
    • Docsify
    • +
    +
  • +
+

最简单公开:生成一个二维码(理工男的浪漫)

+

公开平台

- 短文字(微博、知乎)
+- 短视频(抖音、快手)
+- 长视频(B站 yyds)
+- 长文(知乎、简书)
+- 生活资讯(小红书)
+- 最大的个人IP平台(微信公众号)
+
+

个人公众号的制作

网站制作

1. 部署网站框架(Github、Gitee 码云)
+2. 托管后,与域名链接
+3. 域名访问
+
+
+

网站部署工具I - 利用Docsify展示MD文件

准备工作

    +
  • 包管理器 Node.js(npm) nodejs package manager
  • +
  • 开源框架 Docsify
  • +
  • 内容 Markdown (Typora)
  • +
+

开始安装

安装包管理器 npm

Node.JS 官网 根据平台下载 LTS 版本。

+

验证是否安装成功:Windows 系统下打开命令行,快捷键Win+R,输入 cmd 回车(即Command)
输入 npm --version ,如有结果则正确

+

安装 Docsify

    +
  1. npm i docsify-cli -g 安装 Docsify 包 (i = install)
  2. +
  3. 找一个顺眼的文件夹存储目录,在 cmd 中打开(见下方技巧)
  4. +
  5. 初始化项目 docsify init init (initialize) 初始化, 输入Y
  6. +
  7. 预览网页 docsify serve serve 即服务
  8. +
+

制作网页

更改初始化完的目录中的README.md文件即可,可用 Typora 打开。

+

部署方式

    +
  1. 打开Gitee.com,进行注册
  2. +
  3. 新建一个仓库,仓库名与个人空间地址相同。选择设置模板——readme文件。
  4. +
  5. 点击服务——Gitee Pages,进行实名认证。
  6. +
  7. 点回代码页,点击文件——新建文件夹。
  8. +
  9. 在新建文件夹中上传 Docsify 文件。
  10. +
  11. 再次打开Gitee Pages,分支不变,目录填新建的文件夹。点击启动即可。
  12. +
  13. 更改 README.md 即可更改内容,更新即可。
  14. +
+
+

Markdown 语法

    +
  • ### 标题

    +
  • +
  • *内容*斜体 **内容** 粗体

    +
  • +
  • 代码``` 行内

    +
  • +
  • 列表

    +
      +
    • 无序列表
        +
      • *-+
      • +
      +
    • +
    • 有序列表
        +
        1. +
        2. +
        +
      • +
      +
    • +
    +
  • +
  • 分割线 ---

    +
  • +
+

cmd 技巧

    +
  1. 工作目录 输入盘符 : 切换磁盘
  2. +
  3. cd (change directory) + 要切换的目录
  4. +
  5. cd.. .. 表示上一级目录 . 表示当前目录
  6. +
  7. dir显示当前目录的文件
  8. +
+
+

网站部署工具 II - 利用Hexo制作静态博客

准备工作

    +
  • 了解开源:热爱共享 和 开放自由(黑客->极客)
      +
    • 史蒂夫·乔布斯、沃兹尼克 APPLE I红皮书的故事
    • +
    • 最出名的开源社区:Github.com / OpenResty / OpenSSL
    • +
    • 国内开源社区:Gitee.com 码云 / Coding.net / OSCHINA
    • +
    +
  • +
  • 安装 NPM 管理器 https://nodejs.cn 一路下一步,不要更改任何东西
      +
    • 验证是否装好:npm --version
    • +
    +
  • +
+

使用Hexo

初始化步骤(只需运行一次)

    +
  1. 安装 Hexo 管理器,直接在cmd中运行npm install -g hexo-cli 验证是否装好: hexo

    +
  2. +
  3. 安装 Git:https://registry.npmmirror.com/binary.html?path=git-for-windows/v2.35.1.windows.2/

    +
  4. +
+

​ 下载 Git-2.35.1.2-64-bit.exe,一路下一步啥都别管

+
    +
  1. 找一个顺眼的文件夹,右键在此处打开Git Bash Here,输入hexo init运行
  2. +
  3. 运行 npm install , 初始化完成
  4. +
+

配置网站

    +
  1. 预览效果 hexo s

    +
  2. +
  3. 写内容,新建一个网页 hexo new 网页名字

    +
  4. +
  5. 找到 md 文件,/source/_posts/目录里找到新建的文件,改动后保存即可,刷新即看效果

    +
  6. +
+

更换主题

    +
  1. 打开官网:https://hexo.io/zh-cn/docs,点击上方的 Themes,可以找到许多主题,选择一个
  2. +
  3. 跟随文档说明进行安装,通常是打开本地的hexo目录,进行 Git Clone 操作.
  4. +
+

部署网站

    +
  1. 安装 hexo-deployer-git. 命令为npm install --save hexo-deployer-git
  2. +
  3. _config.yml(如果有已存在的请删除)添加如下配置:
  4. +
+

​ repo 网址在个人仓库中 - 克隆/下载 - 复制,注意空格

+

deploy: type: git repo: https://gitee.com/fallcityv/fallcityv.git branch: master

+
    +
  1. 运行 hexo clean && hexo deploy |代替:(hexo d) 。如出现deploy done则表示成功

    +

    注意:用户名填邮箱或手机号,输密码不会显示,输完回车即可。

    +
  2. +
  3. 打开 Gitee Pages 服务,部署目录空,直接更新或启动。

    +
  4. +
+

作业

注册gitee.com , 完成实名认证,将网站部署到公网

+ + +
+