又重新搭了个个人博客

这篇具有很好参考价值的文章主要介绍了又重新搭了个个人博客。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

哈喽大家好,我是咸鱼。

前段时间看到一个学弟写了篇用 Hexo 搭建博客的教程,心中沉寂已久的激情重新被点燃起来。(以前搞过一个个人网站,但是因为种种原因最后不了了之)

于是花了一天时间参考教程搭了个博客网站,我的博客网址是:https://xxxsalted.github.io/

下面是相关教程。

环境准备

俗话说:"工欲善其事必先利其器",在搭建个人博客之前我们先要把环境准备好。

  • Github 准备

作为全球最大的程序员同性交友网站(不是),我们首先创建一个 Github 账号,官网地址:https://github.com

然后我们下载并安装 Git,官网地址: https://git-scm.com/downloads

毕竟是国外地址,我们访问起来可能比较慢,这时候我们可以访问下面的地址来下载

https://registry.npmmirror.com/binary.html?path=git-for-windows/v2.42.0.windows.2/
  • Node.js 准备

Node.js 简单来讲是一个 JavaScript 的运行环境,让我们的 JavaScript 代码不需要在浏览器上也能运行。

下载安装 Nodejs:http://nodejs.cn/download/

  • 环境配置

下载安装好 Git 和 Node.js 之后,我们在键盘上按下 win+R 键,输入 cmd

然后在弹出的 cmd 窗口中输入下面的命令,来检验是否安装成功

git --version

npm version
  • 下载 cnpm

npm 是 Node.js 的安装包管理器,但是由于限制我们有时候通过 npm 下载东西会特别的慢,这时候我们就需要换一个国内的下载源并且使用 cnpm 来管理 Node.js。

npm install -g cnpm --registry=https://registry.npmmirror.com

初始化博客

  • 安装 Hexo

接下来我们要安装 Hexo ,还是在刚刚弹出的 cmd 窗口中输入:

cnpm install -g hexo
  • 创建新文件夹

我们在电脑任意位置创建一个新文件夹(最好别放在 C 盘下且文件名是英文),这个文件夹将用于储存你网站的静态文件。

比如说我的新建文件夹路径如下:

E:\myblog

然后右键鼠标,打开Git Bash Here,并依次输入以下命令:


# 初始化 hexo
hexo init

# 生成网页文件
hexo generate

# 部署到本地上
hexo server

在执行命令的时候出现权限相关问题(npm ERR! { Error: EPERM: operation not permitted, mkdir 'C:\Program Files\nodejs\node_cache\_locks'),可以参考下面这篇文章来解决:

https://www.cnblogs.com/yinxiangzhenlihai/p/15936518.html

然后你会发现你的目录下面多了很多文件:

接着打开下面网址验证一下:

http://localhost:4000/

如果你想停止运行,可以在上面的 bash 命令窗口中执行 Ctrl+C 命令。

到现在我们的个人博客就完成了一半了!

托管至 GitHub

  • 仓库创建

我们登录自己的 Github ,然后在 Github 中新建一个仓库。

注意: Repository name一定要按照图片上的格式填写,其他的默认即可。

  • 设置免密登录

为了方便我们本地与 Github 互相通信,我们需要设置 SSH 免密登录。

首先找到你的 Github 邮箱和用户名,然后在你个人博客的文件夹下右键鼠标,打开Git Bash Here,并依次输入以下命令:

git config --global user.name "github 用户名"

git config --global user.email "github 邮箱"

然后我们检验一下:

git config user.name
git config user.email

接着我们在键盘上按下 win+R 键,输入 cmd,在 cmd 窗口里面输入下面的命令:

# 检查本机是否已经存在 SSH 密钥
cd ~/.ssh

如果提示:No such file or directory 则输入如下代码,生成 SSH 文件:

ssh-keygen -t rsa -C "github 邮箱地址"

然后连续敲 3 次回车,最终会生成一个文件在“用户”目录下,打开 “用户” 目录(C:\用户\用户名.ssh)并找到id_rsa.p ub文件。

用“记事本”打开并复制里面的内容,在 Github 主页的右上角进入 Setting -> 左侧菜单栏 “SSH and GPG keys” -> New SSH Key -> 填写你获得的 SSH Key

部署博客

到了这一步,我们就可以正式地把博客部署到 Git 上了,进入我们前面创建的博客文件夹,然后找到配置文件 _config.yml

下面是我的配置文件的部分内容,大家可以参考一下

部署路径部分:

deploy:
  type: git
  repo: 你的 git 仓库地址
  branch: master

网站相关部分:

# Site
title: Amoon's blog
subtitle: ''
description: ''
keywords:
author: Ammon
language: zh-CN
timezone: 'Asia/shanghai'


## Set your site url here. For example, if you use GitHub Page, set url as 'https://username.github.io/project'
url:https://xxxsalted.github.io 
root: /
permalink: :year/:month/:day/:title/
permalink_defaults:
pretty_urls:
  trailing_index: true # Set to false to remove trailing 'index.html' from permalinks
  trailing_html: true # Set to false to remove trailing '.html' from permalinks

我们还需要安装一个插件,打开 Git bash 窗口

# 安装自动部署工具
cnpm install hexo-deployer-git --save 

然后依次执行下面的命令

# 清除 public 缓存文件
hexo clean 

# 生成新的网站静态文件到默认设置的 public 文件夹,也可以用 hexo g 命令
hexo generate 

# 部署到 github,也可以用 hexo d 命令
hexo deploy 

当然,在生成静态文件之后你可以使用 hexo s 命令生成一个本地的 hexo 网站来做相关检验和测试,如果没什么问题就使用 hexo d 命令将其部署到 git 上

最后我们的博客就搭建成功啦!文章来源地址https://www.toymoban.com/news/detail-859236.html

到了这里,关于又重新搭了个个人博客的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 个人博客系统调试详细过程

    系统功能的详细说明和源代码见以下链接:https://blog.csdn.net/shooter7/article/details/121180333 相关的源码数据库文件、软件安装包可以联系博主koukou(壹壹23七2五六98) 调试过程如下: 一、数据库安装 首先调试使用的数据库是Mysql5.7.19,安装包可添加上面博主koukou获取。 解压下载的压

    2024年02月03日
    浏览(35)
  • 个人博客系统(前后端分离)

    努力经营当下,直至未来明朗! 普通小孩也要热爱生活! 个人博客系统采用前后端分离的方法来实现,同时使用了数据库来存储相关的数据,同时使用tomcat进行项目的部署。前端主要有四个页面构成:登录页、列表页、详情页以及编辑页,以上模拟实现了最简单个博客列表

    2024年02月02日
    浏览(41)
  • 个人博客系统(二)

    该博客系统共有八个页面,即注册页面、登录页面、添加文章页面、修改文章页面、我的博客列表页面、主页、查看文章详情页面、个人中心页面。 1 注册页面 该页面如图所示: 首先,要先判断注册的用户名、密码、确认密码以及验证码是否为空,若有一个为空,点击提交

    2024年02月16日
    浏览(39)
  • 部署个人博客系统

    目录 1.安装jdk 2.安装tomcat 3.数据库 4.部署博客系统 1.建库建表 2.微调代码 3.打包 4.拷贝 5.访问博客系统 为了能将我们写的项目部署到云服务器上 首先需要将部署时所依赖的环境搭建好 需要安装jdk,tomcat,mysql 直接使用包管理器进行安装,基于yum安装 yum就相当于一个应用商店 y

    2023年04月17日
    浏览(40)
  • Java课程设计个人博客

    目录 引言:在此说明在本次课设过程中所遇到的困难! 一、项目搭建的问题 Q1:Web项目应用啥么编译器编写? Q2:如何创建Web项目(MAVEN)? Q3:Tomcat服务器开头控制台显示乱码如何解决? Q4:Tomcat服务器怎么设置项目的开始界面,从而只要在输入项目名便可访问项目? Q5:Tomcat服务

    2024年01月20日
    浏览(43)
  • 个人博客目录(持续更新中)

            博主是一个业余的matlab选手,平时会在博客上发一些matlab有关的学习资料和电气专业的论文复现。写这篇博客目录是为了方便大家检索。         博客中包括了免费博客和付费博客,不同之处如下:         免费博客主要是我自己学习过程中的我自己的整理总

    2024年02月14日
    浏览(39)
  • 个人博客系统【项目篇】

    1.CSS 2. JS 3.HTML 4.数据库 5.pom.xml image  

    2024年02月11日
    浏览(52)
  • 个人博客项目笔记_01

    前端的工程运行流程: 进入项目目录执行cmd命令: 若是第一次启动需要依次输入如下命令: 之后直接执行 npm run dev 即可! 新建maven工程blog作为父工程,然后在父工程中创建子工程blog-api 向父工程的pom.xml文件中导入依赖。 在子工程的resources文件夹下创建application.properties文

    2024年04月08日
    浏览(92)
  • 个人博客文章归档实现

    随着博客的文章越来越多,那么归档就显得尤为重要,然后最近也是没什么课,加紧更新一下博客,之前也是更新了评论、留言板。 然后博客是使用的前后的不分离的项目,数据返回一般都是用的.NET的强类型数据返回,也会用到分布视图。 重点是一段sql查询困恼我许久,在

    2024年02月09日
    浏览(40)
  • ❤ 个人博客的搭建和设置

    闲暇时候自己试着做了一个自己的个人博客,博客使用的Github进行托管,还在阿里云买了属于自己的域名 具体步骤如下 git --version 4、进入自己想要搭建的放在Github的文件夹 一、clone仓库到本地 git clone 自己的代码仓库地址 git clone 你的代码仓库地址 二、添加自己的东西到文件

    2024年02月03日
    浏览(93)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包