个人免费博客注册申请 5分钟教你搭建个人博客

基于Github Pages + docsify。我花了一小时搭建好了个人博客还顺手还写了这篇文章

效果：

封面

内容页

经验之谈：就个人博客来讲。笔者已经折腾过很多了。用过WordPress、Typecho、Hexo等等。主机也用过基于免费的GitPages或者付费的Vps。最后都不了了之。原因要么是VPS到期了懒得续费。要么是数据迁移各种费心。博客要么是基于动态的比如WordPress需要数据库。要么是基于静态的比如Hexo。一迁移你将要面对的是一堆数据库的数据或者是html代码。移植都太麻烦。最后我挖掘了我两个核心需求：免费。易移植。那么Github Pages + docsify完全满足了我的需求

免费：Github Pages本来就是免费的

易移植：docsify是基于js将md文档转换成html。计算在客户端。不在服务器端。服务器只用存md。这个就很舒服了。以后你的博客数据不会是一堆数据库数据或者html代码。而是具有可读性的md文档。下面详细介绍一下

docsify和一般的使用Hexo、Jekyll、Hugo等博客框不同的是。支持Markdown格式。对程序员的博主们是很友好的。不用生成html文件。写完MD格式的博客直接往上一放。框架自己在运行时解析渲染成html页面。

准备工作

1、git环境。github账号

windows下安装git可以看下这篇Git简易教程之git简介及安装

因为我们要使用Github Pages来部署我们的应用。请先注册下github的账号。官网：Github

2、有node环境

Windows下安装node环境

简单而言

去官网下载nodejs：https://nodejs.org/en/。安装好

npm设置代理或镜像。不然因为周所周知的原因会慢到你可能无法想象设置代理。按照实际情况来# http代理npm config set proxy=http://127.0.0.1:8087npm config set registry=http://registry.npmjs.org# https代理npm config set https-proxy http://server:port# 设置用户名或密码。没有就不管npm config set proxy http://username:password@server:portnpm confit set https-proxy http://username:password@server:port# 取消代理npm config delete proxynpm config delete https-proxy设置镜像（推荐）。如果没有代理。可以设置个国内镜像# 设置淘宝镜像npm config set registry https://registry.npm.taobao.org# 验证成功没npm config get registry

3、简要说明一下步骤

使用docsify命令生成文档站点

在github上部署站点

docsify官网

地址：https://docsify.js.org/#/ docsify官网

使用docsify命令生成文档站点

安装docsify-cli 工具

推荐安装 docsify-cli 工具。可以方便创建及本地预览文档网站。

npmidocsify-cli-g

因为我们已经安装了node环境。所以直接打开CMD窗口执行上面的命令就好了。

初始化一个项目

docsifyinit./docs

index.html 入口文件

README.md 会做为主页内容渲染

.nojekyll 用于阻止 GitHub Pages 会忽略掉下划线开头的文件

启动项目。预览效果

到这里。就可以启动项目。然后看下效果了。使用下面命令启动项目：

docsifyservedocs

流程器输入：http://localhost:3000

1、配置左侧导航栏

不建议配置。配置了就不能显示当前文章的目录

在\docs目录下新建一个_sidebar.md的md文件。内容如下：

-我的博客-[第一章节](blog/博客搭建.md)

在index.html文件中配置一下。在内嵌的js脚本中加上下面这句：

loadSidebar:true

2、配置个封面

套路和上面配置左侧导航栏是一样的。

首先新建一个_coverpage.md的md文件。这里面的内容就是你封面的内容。

#Myblogs>我的博客[CSDN](https://blog.csdn.net/xxx) [滚动鼠标](#introduction)

然后在index.xml文件中修改js脚本配置。添加一句：

coverpage:true

3、配置首页

其实就是 docs目录下README.md` 文件的内容。

我们一直没有管他。默认就是这个样子的：

改一下。放上自己牛逼的经历或者是标签。

#个人简介

部署到Github上

登录github账号。建仓库

创建本地仓库。推送到github

右键Git Bash Here打开git命令行初始化一个仓库。并提交所有的博客文件到git本地仓库。

涉及命令如下：

gitinit//初始化一个仓库gitadd-A//添加所有文件到暂存区。也就是交给由git管理着gitcommit-m"myblogsfirstcommit"//提交到git仓库。-m后面是注释gitremoteaddoriginhttps://github.com/xxx/myblogs.gitgitpush-uoriginmaster//推送到远程myblogs仓库

按上面的命令顺序操作。不出意外的话。我们的本地myblogs已经同步到了github上面了。

使用Github Pages

在myblogs仓库下。选中Settings选项。找到GitHub Pages页签。在Source下面选择master branch / docs folder选项。即可完成

最后欢迎来参观一下我的博客：https://scriptwang.github.io/blog/#/

您还感兴趣的文章推荐

以上就是由互联网推广工程师桔子生活网整理编辑的，如果觉得有帮助欢迎收藏转发~

本文标题：个人免费博客注册申请 5分钟教你搭建个人博客
本文地址：https://www.wangchuang8.com/78051.html，转载请说明来源于：桔子生活网
声明：本站部分文章来自网络，如无特殊说明或标注，均为本站原创发布。如若本站内容侵犯了原著者的合法权益，可联系进行处理。分享目的仅供大家学习与参考,不代表本站立场。