目录

  • 前言
    • 技术简单过
    • Github Pages 的部署(个人网址的托管)
      • 1、创建自己github的Pages(并把项目拉下来自己测试跑)
        • ①、安装环境和拉取项目
        • ②、创建自己github的Pages
      • 2、如何把自己本地的项目部署到自己的Pages
    • Github issues (原功能是追踪项目的)
      • 1、配置专门访问的token令牌
        • ①、注册一个token令牌
        • ②、把注册完的token令牌设置到自己的项目中
      • 2、设置(书单,灵感,友链,关于)、(分类,标签)
        • ①设置closed的issues
        • ②设置open的issues
        • ③书单,关于,友链格式规定(标签,分类设置)
    • Gitalk (评论系统)
      • 1、设置一个评论应用
      • 2、把注册完的ID和Secret放到自己项目中
      • 3、给每一个需要评论的文章或者(关于,书单,友链)建一个 issues
    • LeanCloud (第三方管理数据,类似数据库的概念)
      • 1、注册LeanCloud账户和创建应用
      • 2、创建三个class(Comment,Counter,Visitor)
      • 3、把对应的ID 和Key来修改自己配置
  • 后言

前言

本次的一个布局技术都写的非常详细了,只要按着来就行,不过,先说明本次主题为二次元主题。
如果真的喜欢本主题的不妨可以试一试(建议跟据目录来看)

在很久很久以前。。。。

嘛,就在前不久我正在。。

额,上图仅仅表示我的无敌 无聊,本人不抽烟。
嗯嗯,在我闲来无事的过程中我找到了一个我特别喜欢的个人博客网站;
然后:(放图~哦哦)

大佬”蝉时雨“,自己写的主题:
1、所用前端技术:vue
2、博客文章存储技术:Github issuses(就是原项目的讨论部分,分类,心情也是使用的,待会细讲)
3、博客评论技术:Gittalk (嗯,就是github提供的开发者设置里面有)
4、博客热度技术:LeanCloud (因为没有后端数据库方面,所以使用第三方存储)

传送门:蝉时雨的网站
传送门:蝉时雨的github

嘛,待会就以这几个部分讲解


技术简单过

先说好其实并不难,真的不难,按着来就行!!!
思维图如下:

脑图版:

本次的仓库:

本次的要改动代码:

本次环境:

在食用 Aurora 主题之前,需先安装 Nodejs 和 Git 环境,这两步不必细说。环境安装完毕,由于 Aurora 使用 vue 开发,所以需要安装 vue-cli。

欧克,Let`go


Github Pages 的部署(个人网址的托管)

1、创建自己github的Pages(并把项目拉下来自己测试跑)

①、安装环境和拉取项目

需先安装 Nodejs 和 Git 环境,这两步不必细说

①安装vue-cli

npm install -g @vue/cli-service-global

②拉取项目(唔,经常玩的倒是不用这么解释了)

# clone 主题
git clone git@github.com:chanshiyucx/aurora.git# 进入主题目录
cd aurora# 安装依赖包
npm install# 本地预览
npm start

依赖包安装完毕,便可执行 npm start 本地预览效果,访问 http://localhost:8080/, 当然现在看到的是蝉时雨的博客

②、创建自己github的Pages

重点是 github pages库的创建,并且一个用户只能有一个Pages


1、测试

2、选主题

3、然后直接在网址输入自己的网址,(比如我的:liwangwang321.github.io)

我的是我的主题,你们是刚刚选择的主题。。。


2、如何把自己本地的项目部署到自己的Pages

这个时候我们已经简单的把大佬的主题拉下来了,
那么就开始第一次部署到自己的Pages上(啥也不改)

现在大佬的主题有一键部署的功能

修改内容

然后记得 Shift+右键 (用管理员的权限执行命令,我之前第一次没执行成功,然后使用管理员权限就行了)

成功


Github issues (原功能是追踪项目的)

1、配置专门访问的token令牌

①、注册一个token令牌

这个token令牌是用来去访问github仓库的访问权限的设置。

成功后:

②、把注册完的token令牌设置到自己的项目中


2、设置(书单,灵感,友链,关于)、(分类,标签)

①设置closed的issues


设置labels(也可以设置分类)


②设置open的issues


设置


③书单,关于,友链格式规定(标签,分类设置)

书单:书单页面使用##做分割,内容示例如下:


## ES6 标准入门author: 阮一峰
published: 2017-09-01
progress: 正在阅读...
rating: 5,
postTitle: ES6 标准入门
postLink: //chanshiyu.com/#/post/12
cover: //chanshiyu.com/yoi/2019/ES6-标准入门.jpg
link: //www.duokan.com/book/169714
description: 柏林已经来了命令,阿尔萨斯和洛林的学校只许教 ES6 了...他转身朝着黑板,拿起一支粉笔,使出全身的力量,写了两个大字:“ES6 万岁!”(《最后一课》)。

友链:友链页面使用##做分割,内容示例如下:


## 阁子link: //newdee.cf/
cover: //i.loli.net/2018/12/15/5c14f329b2c88.png
avatar: //i.loli.net/2018/12/15/5c14f3299c639.jpg

关于:关于页面使用##做分割,内容示例如下:


## 关于随便

标签设置

分类设置

文章模块
文章模板没有太多的格式约束,只需要在文章正文顶部加上封面配图即可,配图采用的是 markdown 的注释语法,所以并不会在正文里渲染,以后即使你更换博客主题,也不会影响内容的展示。

[pixiv: 41652582]: # 'https://raw.githubusercontent.com/chanshiyucx/yoi/master/bg/3.jpg'


Gitalk (评论系统)

1、设置一个评论应用

位置:

新建引用

2、把注册完的ID和Secret放到自己项目中

位置:

修改文件:

3、给每一个需要评论的文章或者(关于,书单,友链)建一个 issues

具体的可以去大佬的仓库看看
传送门:蝉时雨的github


LeanCloud (第三方管理数据,类似数据库的概念)

1、注册LeanCloud账户和创建应用

账户要是国际版的

创建应用

2、创建三个class(Comment,Counter,Visitor)

3、把对应的ID 和Key来修改自己配置


修改配置


后言

嘛,差不多了,其实要改变的配置就改变那个config.js就差不多了,

其他的感觉多玩下github就行,

啊啊,不过说实话之前还是不太会玩github来着,现在。。。。。

如果真的喜欢本主题的不妨可以试一试,仓库可以直接去看

传送门:蝉时雨的网站
传送门:蝉时雨的github
我的传送门:https://liwangwang321.github.io/

快速搭建一个自己的个人博客(Github Pages~二次元主题)相关推荐

  1. 如何搭建一个属于自己的博客/企业网站?

    本文首发于 Guanngxu 的个人博客:如何搭建一个属于自己的博客/企业网站 本文参考内容: 如何做博客/企业站以及注意事项 Typecho支持Emoji表情方法 说明:此篇文章得益于王红星的指导, ...

  2. 初学者入门:使用WordPress搭建一个专属自己的博客

    体验简介 阿里云云起实验室提供相关实验资源,点击前往  场景将提供一台基础环境为CentOS 的ECS(云服务器)实例,这台服务器上已经内置LAMP环境.我们将会在这台服务器上安装 WordPress ...

  3. Hexo+gitee:30分钟搭建一个自己的个人博客网站 欢迎友链呀<(▰˘◡˘▰)

    Hexo + Gitee 部署自己的个人博客   目前市场上比较火的一些博客框架: Hexo.jekyll.Solo.Halo .gohugo.VuePress.wordpress 等等 ,这些都是开 ...

  4. 如何用 windows+github搭建一个优美的hexo博客

    如何用 windows+github搭建一个优美的hexo博客 1.Hexo简单介绍 Hexo 是一个快速.简洁且高效的博客框架.Hexo 使用 Markdown(或其他渲染引擎)解析文章,在几秒内, ...

  5. 如何搭建一个属于自己的博客网站?(小白教程)

    如何搭建一个属于自己的博客网站?(小白教程) 一.准备阶段 二.搭建阶段 1.服务器阶段 2.宝塔面板阶段 3.WordPress阶段 三.结尾语 欢迎大家访问我的个人博客:endeavorchuan ...

  6. 教你三分钟用docker compose搭建一个自己的个人博客网站

    hi,大家好,我是 jack xu,今天和大家聊一个轻松.好玩.易懂的话题,就是教大家搭建一个自己的个人博客网站,可以在同事朋友面前炫耀一把.事情的缘由是我们公司有个同事,有一天他给了我一个网站,我打 ...

  7. Docker学习之路05:五分钟用docker compose搭建一个自己的个人博客网站!

    五分钟用docker compose搭建一个自己的个人博客网站! Docker学习路线传送门: Docker学习之路01:Docker的安装 Docker学习之路02:阿里云镜像加速器 Docker学 ...

  8. 如何搭建一个属于自己的博客网站?

    很多人包括我在内,都希望能有一个自己的博客网站,但大部分人都不知道从何处着手,但实际上建立一个博客网站并没有想象的那么复杂,即便我们不是很懂技术,也可以做一个属于自己的网站.以下是我建立个人网站的一些 ...

  9. 使用vuepress搭建一个完全免费的个人博客网站

    前言 只听过vue,没听过vuepress?它可是新的vue全家桶成员之一,尤雨溪大神推出的一款好用的模板. 不信?请看Evan You github.star数已过万,并不少. vuepress用于 ...

最新文章

  1. Mac-使用文本编辑的html浏览器打开出现源代码问题
  2. python导入py文件-Python导入其他文件中的.py文件 即模块
  3. Block相关内容梳理
  4. 03_TortoiseGit冲突和补丁演示,补丁冲突
  5. Docker安装实践Jenkins
  6. python多轴图_Python多子图布局与坐标轴科学计算方法,python,及,计数法
  7. (转载)MySQL基础(非常全)
  8. HexEdit Linux下命令集
  9. nyoj20吝啬得过度(DFS)
  10. MYSQL客户端访问服务端
  11. 机器视觉软件工程师的生活是怎样的?
  12. 数学概率之z=x+y和z=x-y和z=x/y的分布
  13. 【转载】白素贞的身世之谜
  14. 全球及中国工业自动化电缆行业研究及十四五规划分析报告
  15. python 新词发现
  16. JAVA实现CRC16校验
  17. 人为何会生病?(1)
  18. 怎样用JS实现关闭当前窗口
  19. Beautiful Soup 基础入门(实验楼学习笔记2)
  20. Java 操作 word 文档 (三)段落Paragraphs,文本加粗、斜体、字体、字体大小、复杂文本

热门文章

  1. 饭统网倒闭:不创新、不放权就是作死
  2. android:登录界面记住密码
  3. 迷你无人机 FPV WIFI CAMERA图传破解,mini drone WIFI camera
  4. IT管理的致命七宗罪
  5. 记录--微信小程序,uniapp,H5端发送,显示emoji表情
  6. 故障管理系统,如何使用二维码报修
  7. 单片机C51数据类型和存储器类型
  8. 2021春工程伦理习题答案
  9. 250fps,实时、高性能车道线检测算法 LaneATT——Keep your Eyes on the Lane: Real-time Attention-guided Lane Detection
  10. 2019.11.23-参加 21世纪杯 中小学英语演讲大赛