从0到1手把手教你搭建个人博客

简介: 从0到1手把手教你搭建个人博客

首先 搭建博客的话 我们得了解什么是Github  就是没有服务器的情况下 把我们的代码托管到了Github上

74709b02a88f46a5b01a6d6f6f7d2cb1.png Github Pages 可以被认为是用户编写的、托管在 github 上的静态网页。使用 Github Pages 可以为你提供一个免费的服务器,免去了自己搭建服务器和写数据库的麻烦。此外还可以绑定自己的域名。

hexo

什么是hexo呢

Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown(或其他渲染引擎)解析文章,在几秒内,即可利用靓丽的主题生成静态网页。

官网:hexo

在搭建我们的博客之前我们需要安装几个软件~


安装Nodejs

Node.js (nodejs.org)


26d51e8b208e40c387e52f23157c23b3.png

Git

安装Git Bash(使用Mac和Linux的朋友们可以跳过这一步):git官网

检验软件是否安装成功

我们打开我们的任务管理器

win+r

git --version

node -v

npm -v

2b516af962c94df1a6af7faead09a57d.png

好啦 安装完毕

此外若安装成功,在桌面右键鼠标,可以看到菜单里多了 Git GUI HereGit Bash Here两个选项,第一个是图形界面的Git操作,另一个命令行,我们一般使用第二个

82ad5434730e45b2a9c9b53206e488bc.png

接下来就是hexo的安装辣

选择一个文件夹 接着 git bash ,输入以下 npm 命令即可安装

npm install hexo-cli -g


这个命令表示安装 hexo 的脚手架

Hexo 初始化配置

hexo init
npm install hexo-deployer-git --save

74c31d51a7ef401399a40007edcb1a69.png

a37eb9cf528e43388871af41eafe3b4b.png

如图表示 安装完毕 下一步就是启动我们的hexo!

执行以下命令

hexo generate
hexo server


5c3a62bd05fb4ee09cfaf2389fe0c8d4.png

此时会出现一个端口号 我们将我们的端口 运行到网页!


a2c4a32d15c44956adc10d3f539869d7.png

此时hexo搭载的默认化界面就出来了!

然后进入我们的Github 官网 GitHub


0705dfbbcc094ebc9a7a262b00363824.png


配置 SSH 密钥:只有配置好 SSH 密钥后,我们才可以通过 git 操作实现本地代码库与 Github 代码库同步,在你第一次新建的文件夹里面

ssh-keygen -t rsa -C "your email@example.com"
//引号里面填写你的邮箱地址,比如我的是2268125923@qq.com

然后会出现下图

0c75e5742c93441f88a80c5c2b6fdd6a.png

然后:

Enter passphrase (empty for no passphrase):
//这里是要你输入密码,其实不需要输什么密码,直接回车就行
Enter same passphrase again:

然后出现

Your identification has been saved in /c/Users/you/.ssh/id_rsa.
Your public key has been saved in /c/Users/you/.ssh/id_rsa.pub.
The key fingerprint is:
这里是各种字母数字组成的字符串,结尾是你的邮箱
The key's randomart image is:
这里也是各种字母数字符号组成的字符串

运行以下命令,将公钥的内容复制到系统粘贴板上

clip < ~/.ssh/id_rsa.pub


405632f858974934be10b1f0f63ecacb.png

登录你的github 点击settings


SSH and GPG Keys:


3.选择 New SSH key:


然后把那一段公用密匙 加进去就完成了🍗


如何为博客更换自己喜欢的主题

王同学在这里力推butterfly


butterfly主题官网:Butterfly 安裝文檔(一) 快速開始 | Butterfly


安装完butterfly 的插件 如图:


7e68a722e8854d8fa2340e0b93c36848.png

以上就是王同学带给大家搭建hexo框架的第一步!

相关文章
|
JavaScript 安全 前端开发
从零开始搭建个人网站博客
从零开始搭建个人网站博客
155 5
|
弹性计算 关系型数据库 Apache
手把手教你使用阿里云服务器搭建个人博客
这是我第一次搭建个人博客网站,总体上来说还是非常顺利的,主要四个步骤,首先创建阿里云服务器,其次创建云数据库实例,再次阿里云服务器链接云数据库,最后安装WordPress。四步轻松就可以搭建个人博客网站啦,之前搭建博客起码需要一两周的时间,这次建站只花费了我1个小时就完成啦。
2565 9
|
JavaScript 开发工具 数据安全/隐私保护
手把手教你打造炫酷个人博客:从零开始到成功上线
手把手教你打造炫酷个人博客:从零开始到成功上线
140 0
|
域名解析 缓存 JavaScript
手把手教你从零开始搭建个人博客,20分钟上手
手把手教你从零开始搭建个人博客,20分钟上手
397 0
手把手教你从零开始搭建个人博客,20分钟上手
|
存储 JSON 前端开发
手把手带你搭建个人博客系统(二)
手把手带你搭建个人博客系统(二)
146 0
手把手带你搭建个人博客系统(二)
|
前端开发 JavaScript Java
手把手带你搭建个人博客系统(一)
手把手带你搭建个人博客系统(一)
379 0
手把手带你搭建个人博客系统(一)
|
域名解析 运维 Linux
打造个人博客(学习篇)
打造个人博客(学习篇)
打造个人博客(学习篇)
|
开发框架 .NET Serverless
阿里云快速搭建个人博客
使用阿里云体验搭建博客
阿里云快速搭建个人博客
|
存储 缓存 JavaScript
第一次搭建个人博客
以前一直都是用的开发环境,从来没有想过在服务器上搭建一个网站。本来因为搭建博客会很简单,没想到单单的配置mongodb就花了我将近一天的时间。最后迫于无奈只能用宝塔面板来搭建我的个人博客了
第一次搭建个人博客
|
存储 数据库
个人博客搭建
阿里云真给力
个人博客搭建