程序员经验分享-hwhale

如何在Github上建立自己的个人博客网站详细教程

2023-05-16

概述

之前闲着没事,就利用Github建了一个个人博客网站,效果还不错,今天就来分享一下.
建立自己个人博客网站的好处:
1.面试装逼,这个不必多说…
2.把平时积累的知识和项目记录下来,方便日后查看使用
3.不受其他博客平台的限制

准备工作

开始之前,先大致介绍一下用到的技术和相关概念

Github是什么:

GitHub是一个利用Git进行版本控制、专门用于存放软件代码与内容的共享虚拟主机服务,很多人都把它称作程序员的同性交友网站,具体为啥这么叫我也不知道

GitHub Pages是什么？

Github Pages设计的初衷是为托管在GitHub上的项目提供介绍页面,开发者们可以通过GitHub Pages为他们的每一个项目创建一个用于介绍该项目的静态网站,不过由于他的空间免费而且稳定,因此用它搭建一个个人博客网站是再好不过了.

Git是什么？

Git是一个开源的分布式版本控制系统,可以有效、高速的处理从很小到非常大的项目版本管理.它的作用
和Svn类似,就是一个版本控制的工具,用它可以将我们写的代码提交到Github上.

Jekyll是什么？

jekyll是一个简单的免费的Blog生成工具,将纯文本转化为静态网站和博客;由于咱们的GitHub Pages生成的是静态页面,每次更新博客都需要手动更改HTML,这就使得每次写博客都变得很麻烦,而用了这个工具以后,它会根据预先设置好的格式来生成博客内容,你就无需关心html代码,只需要把重心放在博客的写作上.

Liquid是什么?

Liquid是一种模板语言,可以在HTML页面中使用它;而他的作用就是使用标记、对象和过滤器的组合来加载一些动态内容.

废话不多说,下面来讲讲大致流程
1.登陆你的个Github账号(注册的话这里就不讲了…)
2.新建一个仓库用来保存个人网站项目
3.把做好的个人网站上传到Github上
4.上传成功后,根据域名来访问你的主页

入门案例-Hello Github

创建仓库

先登陆你的Github账号,没有账号的自己去注册一个(注册过程这里就不讲了),如下图新建一个仓库
图1
图2
Repository name就是你的仓库名,这个仓库名必须按图中的格式来写,到时候访问的地址就是这个了,至于下面的Initialize this repository with a README这里,想搞就搞一下,我这里由于是演示就不弄了

配置

好了,经过上面的步骤咱们的Github仓库就算是建好了,下面要来讲讲本地怎么配置了;需要用到Git这个工具,请提前准备好.

一.创建一个本地仓库

1.找一个目录来作为你本地的仓库,比如我的是”F:\Cloud”,那么就在Cloud文件夹下初始化仓库.

2.初始化仓库的方式有两种,一种是用git的图形化界面来创建,另一种是用git命令来初始化,这里我选用图形化界面的方式来创建(极(lan)力(ren)推(bi)荐(bei));

3.来到Cloud目录下右键选择Git GUI Here–>选择Create New Repository

二.配置SSH Key

1.还是用Gui的形式来创建,在help中选择Show SSH key,点击Generate Key(期间啥都不用填,只需要下一步)来生成key

2.把生成的key填写到Github中,在Settings的SSH and GPG keys那里填,title随便写,主要是用来注明的,如图
图3

三.用户配置

使用git命令的方式来配置,右键选择Git Bash Here打开命令窗口,作如下配置

git config –global user.name “你的Github用户名”
git config –global user.email “你的Github邮箱地址”

上传代码

一.写代码(index.html)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style type="text/css">
        h1{
            text-align: center;
            font-size: 50px;
        }
    </style>
</head>
<body>
    <h1>Hello Github</h1>   
</body>
</html>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16

二.提交代码到Github仓库

1.在本地做一次提交(以命令行的方式)

git add .
git commit -m “This is the message describing the commit”添加commit信息

2.把项目提交到Github上

git remote add origin 你的远程仓库地址(git@github.com:MarcusKun/io.git)
注:在创建好Github仓库后有两个地址,一个是https的地址,另一个是SSH地址,也就是上面这个地址.
git push -u origin master(执行这个之前必须先在本地做一次提交操作)

这里写图片描述

3.配置Github Pages
在自己仓库那里找到Settings,配置Github Pages,如下图
图5

4.通过Github Pages那里给的地址访问自己的网页
图6

进阶使用-使用Jekyll来打造自己的个人博客

概述

经过上面的步骤,相信大家已经可以用Github来生成自己的静态网站了,可是毕竟咱们是要打造博客网站啊,不可能每次都用html语法来写博客吧;好了,这个时候就要用到Jekyll这个工具了,有一点要强调的是,我这里不会讲解从头打造一个个人博客网站,而是利用别人提供的Jekyll模板来制作,如果想深入学习的同学可以自行学习Jekyll以及Liquid

一个标准的使用Jekyll工具生成的网站,其目录结构一般是像这样的

├── _config.yml
├── _drafts
|   ├── begin-with-the-crazy-ideas.textile
|   └── on-simplicity-in-technology.markdown
├── _includes
|   ├── footer.html
|   └── header.html
├── _layouts
|   ├── default.html
|   └── post.html
├── _posts
|   ├── 2007-10-29-why-every-programmer-should-play-nethack.textile
|   └── 2009-04-26-barcamp-boston-4-roundup.textile
├── _data
|   └── members.yml
├── _site
└── index.html
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17

简单介绍一下每个目录和文件的作用

文件 / 目录描述
_config.yml保存配置数据。很多配置选项都会直接从命令行中进行设置，但是如果你把那些配置写在这儿，你就不用非要去记住那些命令了。
_draftsdrafts 是未发布的文章。这些文件的格式中都没有 title.MARKUP 数据。学习如何使用 drafts.
_includes你可以加载这些包含部分到你的布局或者文章中以方便重用。可以用这个标签 {% include file.ext %} 来把文件 _includes/file.ext 包含进来。
_layoutslayouts 是包裹在文章外部的模板。布局可以在 YAML 头信息中根据不同文章进行选择。 这将在下一个部分进行介绍。标签 {{ content }} 可以将content插入页面中。
_posts这里放的就是你的文章了。文件格式很重要，必须要符合: YEAR-MONTH-DAY-title.MARKUP。 The permalinks 可以在文章中自己定制，但是数据和标记语言都是根据文件名来确定的。
_data放一些其他配置文件,必须是.yml或者.yaml格式的,比如有一个文件叫members.yml,如果想引用这个文件里的内容就通过site.data.membres来引用
_site一旦 Jekyll 完成转换，就会将生成的页面放在这里（默认）。最好将这个目录放进你的 .gitignore 文件中。

应用

第一步:去JekyllThemes下载一个自己喜欢的模板
第二步:按照之前的步骤把下载好的模板上传到自己的Github仓库中
第三步:在_posts文件夹中放入自己写好的博客,文件名必须是日期-标题名,例如:2016-10-25-我的第一篇博客
第四步:上传博客到Github中即可访问自己的博客

参考

Liquid语法:Liquid reference
Jekyll中文网:Jekyll • 一个简洁的博客、静态网站生成工具 | Jekyll 是一个将纯文本内容转化为静态网站或博客的工具
Git官网:Git

云服务器搭载业务，选择合适的平台最重要！

从目前国内云计算市场的格局来看，国内云计算前三强分别是阿里云、腾讯云和华为云，阿里云、腾讯云作为背靠互联网平台的企业，更偏向于B端用户；华为与作为传统的通信巨头，更偏向于G端。

当然如何选择服务器机型，这里有篇文档汇总的比较详细，文档地址：

云服务器哪家好！2021年阿里云、腾讯云、华为云的服务器配置及价格对比？​

如果是高并发，高IO业务场景，需要确定服务器规格，可让业务应用性能发挥到最佳，参考官方文档：

阿里云服务器规格：规格实例族 - 云服务器 ECS

腾讯云服务器规格：规格实例族 - 云服务器CVM

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

如何在Github上建立自己的个人博客网站详细教程 的相关文章

  • /system/core/init/readme.txt对init.rc的解释

    init rc由许多的Action和Service组成 每一个语句占据一行 xff0c 并且各个关键字被空格分开 c规范中的 xff08 如 n xff09 反斜杠将被忽略 backslash escapes 而被认为是一个空格 xff0c

  • 操作系统---“进程调度模拟程序” , “生产者―消费者问题算法的实现” , “银行家算法的实现”

    如果有正在学习计算机操作系统的小伙伴 xff0c 可以通过此文章对 进程调度模拟程序 生产者 消费者问题算法的实现 银行家算法的实现更加清楚 本人也只是一个学生 xff0c 下面内容我主要整合了一些学习心得和成果 xff0c 还有能够帮助自

  • 电脑桌面美化教程，强迫症福利

    目录 一 透明任务栏 效果图展示 二 桌面图标的布局美化 效果展示 行为 主题 一般设置 添加项目 总结 首先给大家看一下我美化后的桌面 我比较喜欢简约风格的 xff0c 看起来就很舒服 xff0c 也可以根据自己的喜欢添加一些小特效 xf

  • 深入理解设计模式之建造者模式

    老大突然拉住我 xff0c 喜滋滋地告诉我 公司很满意我们做的模型 xff0c 又签订了一个合同 xff0c 把奔驰 宝马的车辆模型都交给我们公司制作了 xff0c 不过这次额外增加了一个新需求 汽车的启动 停止 喇叭声音 引擎声音都由客户

  • 如何改变Android-studio中的APP的名字和图标

    1 更改APP的名字 1 xff09 xff1a 我们打开app gt manifests gt AndroidManifest xml 更改Android xff1a lable 61 34 34 引号之中的文字即可 在这里我们改为QQ

  • 关于Linux下的常用软件工具

    目录 前言 xff1a vim gcc gcc c 43 43 make makefile gdb 写在最后 前言 xff1a 本篇主要介绍的是Linux下几种常用的软件的使用 关于Linux下软件的安装 xff0c yum源的配置请点击

  • 如何在局域网内搭建FTP服务器,实现信息共享

    如何在局域网内搭建FTP服务器 实现信息共享 首先打开控制面板 xff0c 点击程序 点击程序 xff0c 点击启用或关闭windows功能 xff0c 找到lnternet lnformation Services 点击前面小 xff0b

  • 笔记本电脑中Git的复制粘贴

    1 鼠标选中要选择的文本 xff01 别松开 xff01 2 按住 ctrl 43 fn别松开 xff01 3 再松开鼠标 xff0c 按住insert键 xff0c 在撤销键的上面 xff0c 复制完成 xff1b 粘贴 xff1a sh

  • Servlet正常导入依赖之后httpServlet仍然爆红

    一开始的配置文件 lt xml version 61 34 1 0 34 encoding 61 34 UTF 8 34 gt lt project xmlns 61 34 http maven apache org POM 4 0 0 3

  • Java实现生产者和消费者模式

    一 关于Object类中的wait和notify方法 生产者和消费者模式 第一 wait和notify方法任何一个java对象都有不是线程对象的方法 是java中的方法 xff0c 因为这两个方式不是object类中自带的 wait方法和n

  • spring Bean 管理

    目录 1 Bean 管理指的是两个操作 2 Bean的实例化 1 构造器实例化 2 静态工厂方式实例化 3 实例工厂方式实例化 3 Bean 管理主要三种方式 xff08 1 xff09 基于 xml 配置文件方式实现 1 基于xml方式创

  • JAVA设计模式-建造者模式

    JAVA设计模式 建造者模式 介绍 建造者模式是通过一步一步的步骤构建一个包含多个部件的对象 xff0c 每个不同的对象都是具有相同的构建过程 适用于复杂对象的构建 xff0c 用户不需要知道具体的构建细节 xff0c 只需要指定对象的类型

  • MVC框架实现用户登录注册功能（连接数据库）

    目录 一 简单理解MVC框架 二 项目结构 三 项目源码 3 1 User 3 2 UserDao 3 3 RegisterDao 3 4 servletControll 3 5 servletControllRegister 3 6 we

  • Python 第一周常见运算符作业

    一 作业详情 1 第一题 代码如下 xff1a ce 61 int input 34 Enter a defree in Celsius 34 fa 61 9 5 ce 43 32 print 34 s Celsius is s Fahre

  • 第二周python选择分支作业

    一 作业详情 1 第十九题 代码如下 xff1a s1 61 1 3 5 7 9 11 13 15 17 19 21 23 25 27 29 31 s2 61 2 3 6 7 10 11 14 15 18 19 22 23 26 27 30

  • 第三周python作业

    1 第四十一题 代码如下 xff1a a 61 120 for i in range 2 a while a i 61 61 0 print i end 61 34 34 a 61 a i 2 第四十二题 代码如下 xff1a hang 6

  • 字符串练习16个习题

    1 第一题 代码如下 xff1a ss 61 34 S S S 34 print ss print ss replace 34 34 34 34 2 第二题 代码如下 xff1a def f1 x sum 61 0 for it in x

  • 为什么握手是三次，挥手是四次

    三次握手 是指建立一个TCP连接时 xff0c 需要客户端和服务器总共发送3个包 三次握手的目的是连接服务器指定端口 xff0c 建立TCP连接 并同步连接双方的序列号和确认号并交换 TCP 窗口大小信息 在socket编程中 xff0c

  • hcia第二天

    1十进制与二进制转换 xff1a 除了短除法外 xff0c 还可以有如下方法 xff0c 00010101转换为十进制 1 1 43 0 2 43 1 4 43 0 8 43 1 16 61 21 ip地址相关名词解释 xff1a 网络掩码

  • Java 练习题：求平方根

    文章目录 简介程序要求思路解析代码实施 简介 平方根 xff0c 又叫二次方根 xff0c 表示为 xffe3 xff0c 其中属于非负数的平方根称之为算术平方根 xff08 arithmetic square root xff09 一个正

随机推荐

  • ubuntu中安装libpcap

    第一步 xff1a 下载libpcap的网址 xff08 在Ubuntu中的火狐中就可以下载 xff0c 下载的是一个安装包 xff0c 我下载的版本是libpcap 1 10 3 xff09 xff1a http www tcpdump

  • Java的顺序表的创建及对顺序表进行相关的操作

    1 顺序表的定义 xff1a 顺序表是在计算机内存中以数组的形式保存的线性表 xff0c 线性表的顺序存储是指用一组地址连续的存储单元依次存储线性表中的各个元素 使得线性表中在逻辑结构上相邻的数据元素存储在相邻的物理存储单元中 xff0c

  • eclipse如何重命名包名

    点击包名 xff0c F2就可以了

  • Java中String类的常用方法

    一 认识String类 String类在java lang包中 xff0c java使用String类创建一个字符串变量 xff0c 字符串变量属于对象 java把String类声明的final类 xff0c 不能有类 String类对象创

  • Java中Iterable、Collection、List 的常见方法签名以及含义

    三者的关系 一 Iterable Iterable接口是java 集合框架的顶级接口 实现此接口使集合对象可以通过迭代器遍历自身元素 它的成员方法如下 xff1a 方法描述iterator xff08 xff09 返回一个内部元素为T类型的

  • 常见的几种排序算法

    目录 一 冒泡排序 二 选择排序 三 插入排序 四 归并排序 五 快速排序 一 冒泡排序 冒泡排序 xff08 Bubble Sort xff09 也是一种简单直观的排序算法 它重复地走访过要排序的数列 xff0c 一次比较两个元素 xff

  • 数据结构—— 树与二叉树

    一 树的定义与基本术语 1 树的基本概念 树是n xff08 n大于等于0 xff09 个结点的有限集合 n 61 0时 xff0c 称为空树 2 树的相关术语 xff08 1 xff09 结点 xff1a 包含一个数据元素及若干指向其他结

  • MySQL表的增删查改

    目录 一 新增 二 查询 三 修改 四 删除 一 新增 xff08 Create xff09 语法 xff1a INSERT INTO table name column column VALUES value list value lis

  • 计算机组成原理相关概述

    1 计算机发展史 人类对计算的需求是从古至今一直存在的一条主脉络 根据人均算力在不断地攀升 xff0c 分为5个阶段 第一阶段 xff1a 一个国家组织共同使用一台计算机 第二阶段 xff1a 一个商业组织共同使用一台或多台计算机 第三阶段

  • 浅浅了解Servlet

    目录 一 C S架构和B S架构的区别 二 服务器 三 Servlet 四 HTTP协议 五 Servlet xff08 详解 xff09 六 Servlet应用 七 转发与重定向 八 Servlet生命周期 九 Servlet特性 十 状

  • Spring配置数据源 + 注解开发 + 整合Junit

    一 Spring配置数据源 1 1 数据源 xff08 连接池 xff09 的作用 数据源 xff08 连接池 xff09 是提高程序性能出现的 事先实例化数据源 xff0c 初始化部分连接资源 使用连接资源时从数据源中获取 使用完毕后将连

  • IDEA pom.xml添加依赖

    1 打开pom xml文件 xff0c 按住Alt 43 insert 2 搜索选取需要的添加即可 3 但看到导入的依赖报红问题 解决操作如下图 这边刷新操作完之后 xff0c 稍等一下就好了

  • 完全删除catia

    2022 9 25今天这事多少有点让人暴躁 xff0c 比如说有些东西它就是怎么删都删不掉 本帖子重点是如何卸载大多数帖子中没有说明白的CATSysDemon 一 先找到并删除catia的文件夹 卸载一个文件 xff0c 我习惯鼠标先左键选

  • 用Fragment模仿QQ界面

    概要 在android开发中 xff0c Fragment是很重要的一部分 xff0c 他有activity的特性也有他自己独特的生命周期 xff0c 使activity代码更简洁 效果演示 Demo思考问题 1 如何实现的底部三个按钮效果

  • Spring-全面详解（基础知识）

    简介 Spring5框架 内容介绍 xff1a 1 Spring概念 2 IOC容器 3 Aop 4 JDBCTEmplate 5 事物管理 6 Spring5新特性 所需的jar包 参考俺滴下面博客 Spring所需jar包 爱你的阿白

  • 监控系统zabbix—配置告警

    1 给监控项设置触发器 默认情况下 xff0c 监控项不会自动发送告警消息 需要配置触发器与告警 xff0c 并且通过通知方式发送信息给联系人 触发器 xff1a 设置条件 xff0c 当条件达到时 xff0c 将会执行某个动作 动作 xf

  • 串口打印中文乱码及注释乱码问题

    1 使用keil5代码注释出现中文乱码问题 在使用keil5中出现如下问题 xff1a 这时候的解决方法是在keil5顶头工具栏上进入 xff1a Edit Configuration xff0c 如下然后进行选择GB2312编码方式 xf

  • 蓝桥杯备赛练习（一）寻找单词中出现最多的字母

    输入一行包含一个单词 xff0c 单词只由小写英文字母组成 小蓝正在学习一门神奇的语言 xff0c 这门语言中的单词都是由小写英文字母组 成 xff0c 有些单词很长 xff0c 远远超过正常英文单词的长度 小蓝学了很长时间也记不住一些单词

  • Button点击事件

    Button点击事件一般有四种方法 xff1a 1 xff1a 匿名内部类 2 xff1a 自定义内部类 3 xff1a 通过当前Activity实现点击事件接口 4 xff1a 在xml文件中绑定 匿名内部类格式 xff1a lt But

  • 如何在Github上建立自己的个人博客网站详细教程

    概述 之前闲着没事 就利用Github建了一个个人博客网站 效果还不错 今天就来分享一下 建立自己个人博客网站的好处 1 面试装逼 这个不必多说 2 把平时积累的知识和项目记录下来 方便日后查看使用 3 不受其他博客平台的限制 准备工作 开

热门标签