Cada desarrollador espera tener su propio sitio de blog técnico, y muchos de ellos confían en CSDN, Blog Garden, Nuggets, etc. para compartir artículos técnicos. El propósito de este artículo es llevar a todos a construir rápidamente un sitio de blog gratuito propio. Su principio de realización: primero use Hexo para generar páginas estáticas a partir del código del documento md escrito de antemano, y luego use la función de alojamiento de sitio web estático del código páginas en la nube para implementarlo y empaquetarlo.
Primero vaya a la dirección : http://magnumhou.gitee.io/magnum-blog/
1. Preparación preliminar
1.1 Registrar cuenta Gitee
Registre una cuenta propia de Github o Gitee Este artículo utiliza la demostración de Gitee.
Gitee, comúnmente conocida como Code Cloud, es una plataforma de colaboración de I+D y alojamiento de código basada en Git en China.
Dirección del sitio web oficial de Gitee: https://gitee.com/
Las ventajas de Gitee sobre Github son las siguientes:
- Por razones que todos entienden, la velocidad de acceso a Github será muy lenta y, en ocasiones, incluso se producirán fallas de acceso. Dado que Code Cloud es una plataforma doméstica, le permite experimentar la velocidad de vuelo.
- En comparación con GitHub, Code Cloud no solo proporciona un almacén de Git gratuito, sino que también integra funciones como la inspección de calidad del código y la demostración de proyectos. Para el desarrollo colaborativo en equipo, Code Cloud también ofrece servicios de gestión de proyectos, alojamiento de código y gestión de documentos, gratis para equipos pequeños con menos de 5 personas.
Puede usar Baidu para registrarse y crear un proceso de almacén, es muy simple.
1.2 Instalar Git
Dirección de descarga
Seleccione la plataforma del sistema correspondiente, después de la descarga, instálela de una manera tonta.
Una vez completada la instalación, abra Ejecutar -> ingrese el comando CMD, presione Entrar para abrir la ventana de línea de comando
e ingrese el siguiente comando Git
git --version
Aparece el número de versión, lo que significa que la instalación de git se realizó correctamente
1.3 Establecer una conexión entre Git y Gitee
En cualquier directorio, abra la línea de comando de git bash e ingrese el siguiente comando para generar la clave pública:
ssh-keygen -t rsa -C 邮箱
Aparece el retorno de carro (y/n), ingrese y, y presione el retorno de carro continuamente para generarlo.
Abra el directorio C:\Users\Dell.ssh, busque el archivo id_rsa.pub y ábralo con el Bloc de notas:
Nota: Diferentes computadoras tienen diferentes directorios de usuarios.
Regrese al navegador y busque la página de gitee que se acaba de crear en el almacén en la nube, haga clic en la información personal en la esquina superior derecha, busque "Configuración" y ábrala, busque la "clave pública SSH" en la columna izquierda "Configuración de seguridad" para generar la
clave pública oficial Pasos de orientación
El número predeterminado de claves públicas es 0, en la columna "Agregar clave pública", agregue "Título" y "Clave pública"
Nota: El nombre del título es la clave pública personalizada, que es el contenido del archivo "id_rsa.pub" que se acaba de abrir con el Bloc de notas.
Después de completar el pegado, haga clic en Aceptar. En este punto, se mostrará "Su número de clave pública SSH actual: 1".
Introduzca el siguiente comando para la configuración global:
git config --global user.name "你的用户名"
git config --global user.email "你的邮箱"
Envíe los archivos incluidos en la biblioteca de versiones al almacén remoto de gitee:
git add .
git commit -m 'first commit'
git remote add origin 你的仓库地址
git push -u origin master
En este punto, el envío está completo, abra el navegador, ingrese la dirección de su almacén y actualice para ver el archivo.
1.4 Instalar nodo
Node.js® es un entorno de tiempo de ejecución JavaScript multiplataforma de código abierto.
Node.js (la versión de Node.js debe ser al menos 10.13, se recomienda Node.js 12.0 y superior)
Dirección de descarga del nodo
Dirección china
El proceso de instalación es relativamente simple, solo una instalación de tontos.
Una vez completada la instalación, abra la línea de comando y ejecute el siguiente comando
node -v
Cuando aparece el número de versión, la instalación se ha realizado correctamente. De forma predeterminada, viene con su propio administrador de paquetes npm, que se puede verificar con el siguiente comando
npm -v
1.5 Instalar Hexo
Hexo es un marco de blogs rápido, conciso y eficiente. Permite que cientos de páginas se rendericen instantáneamente en unos segundos. Tiene un poderoso sistema de integración de complementos.
Dirección del sitio web oficial
Instalación global
$ npm install -g hexo-cli
Para usuarios avanzados que estén familiarizados con npm, solo puede instalar el paquete hexo localmente
$ npm install hexo
Crea una carpeta en cualquier lugar. Después de abrir la carpeta, haga clic con el botón derecho, seleccione Git Base -> Git Base Here,
ingrese el siguiente comando y Hexo creará automáticamente todos los archivos necesarios para el sitio web en la carpeta de destino.
hexo init
Actualice la carpeta, habrá el siguiente directorio
Los archivos en el cuadro rojo deben ser empaquetados y generados por usted mismo
Código en paquete.json:
{
"name": "magnum-blog",
"version": "0.0.0",
"private": true,
"scripts": {
"build": "hexo generate",
"clean": "hexo clean",
"deploy": "hexo deploy",
"server": "hexo server"
},
"hexo": {
"version": "6.3.0"
},
"dependencies": {
"hexo": "^6.3.0",
"hexo-deployer-git": "^4.0.0",
"hexo-generator-archive": "^2.0.0",
"hexo-generator-category": "^2.0.0",
"hexo-generator-index": "^3.0.0",
"hexo-generator-tag": "^2.0.0",
"hexo-renderer-ejs": "^2.0.0",
"hexo-renderer-marked": "^6.0.0",
"hexo-renderer-stylus": "^2.1.0",
"hexo-server": "^3.0.0",
"hexo-theme-landscape": "^0.0.3"
}
}
Las instrucciones pertinentes son las siguientes
# 安装依赖包
npm install
# 构建
npm run build
# 启动
npm run server
Después de comenzar, ingrese la ruta localhost: 4000 al navegador para ver el efecto, un sitio web como este
Reemplacé el tema predeterminado del sitio web aquí, dirección: https://hexo.io/themes/
¿Has seleccionado tu tema favorito? En este momento, puede ingresar al github del tema especificado y descargarlo,
descomprimir el paquete comprimido descargado y colocarlo en hexo/themes Regresar al nivel anterior, abrir _config.yml y modificar
el valor correspondiente al tema dentro
npm run server
Actualice la página y aparecerá el tema que desee. ! !
2. Desarrollo
Elija la herramienta md a la que está acostumbrado y comience su viaje de desarrollo de blogs.
¡Cabe señalar que estos deben agregarse al comienzo del blog!
---
# 文章标题
title: Hello My Bolg
# 文章日期格式：2018-05-30 15:20:36
date:
# 文章标签
tags:
# 文章分类
categories:
---
Escriba un contenido de home.md de la siguiente manera:
---
title: '我的博客首页'
---
<pre>
《春江晚景》
竹外桃花三两枝，
春江水暖鸭先知。
茼蒿满地芦芽短，
正是河豚欲上时。
</pre>
Coloque el archivo .md escrito en la carpeta _posts en el directorio de origen en la carpeta hexo y podrá ver que hay un archivo hello-world.md dentro, que es la publicación predeterminada.
iniciar npm run server, actualizar la página
3. Implemente la nube de código
Haga clic derecho en el directorio del blog para abrir PowerShell y ejecute el siguiente comando
# 安装 hexo-deployer-git 插件（将代码推送到码云用）
npm install hexo-deployer-git --save
Abra el archivo _config.yml en el directorio raíz hexo y modifique el valor de deployment.
Ejecute el siguiente comando para implementar el código en Code Cloud.
hexo deploy
Una vez que se complete el envío, vaya a la dirección del proyecto de su nube de código, actualice y vea, y tendrá el archivo que acaba de cargar. Haga
clic en "Servicio" y seleccione "Páginas Gitee"
Nota: este paso requiere la autenticación del nombre real (se debe cargar la tarjeta de identificación) por razones reglamentarias, y la operación solo puede continuar después de que se complete la autenticación.
¡Seleccione la sucursal especificada, inicie el servicio y vea su blog haciendo clic en la dirección correspondiente! ! !
