使用react+docusaurus快速搭建一个博客网站

快速搭建一个react个人静态博客网站，并使用vercel免费部署发布到线上#

首先看下成果图：

image-20210520214105685

本篇你将您学到：

1 如何快速搭建一个自己的博客网站，可以在这个网站里面上传自己的博客、撰写自己的文档； 2 通过github、vercel 自动化部署一个前端项目到线上，免费的。（正常我们要买域名、服务器才能，而这里不需要，当然免费的话网就有点慢了，后面也可以自己搞一个域名服务器发布）

博客框架：

• docusaurus，快速构建一个静态网站。

官方文档：https://docusaurus.io/zh-CN/

网站UI及源码参考：

• 峰华前端工程师个人博客：https://zxuqian.cn/

（已联系过峰华大佬，再次感谢峰华大佬，可以让我在他的源码基础上再进行创作！）

关于docusaurus的讲解，可以看峰华的视频，有讲解，本篇不再赘述。

【JAMSTACK】使用 Docusaurus 静态网站生成器搭建个人博客：https://www.bilibili.com/video/BV1uE411x7mE 【JAMSTACK】部署 Docusaurus 搭建的个人博客：https://www.bilibili.com/video/BV11E411M7WL

本网站源码：

https://github.com/JACK-ZHANG-coming/my-now-blog

本网站ip地址：

https://zhangqiang.vercel.app/

1 拉取github源码到本地，然后运行#

此处可以选择峰华的源码，也可以选择我的这个仓库的源码，我这个仓库源码是改完之后的，下面我将以我的仓库源码作为演示。

image-20210522104648826

2 修改页眉页脚、首页#

b站视频10:00’往后；

3 上传自己的博客（blog）#

b站视频16:40‘往后；

4 上传自己的文档（doc）#

b站视频27:35秒往后；

5 将前端网站部署发布到线上 （vercel）#

见b站视频；

6 本篇博客网站搭建视频教程#

https://www.bilibili.com/video/BV19K4y197yA/

注：本网站仅作为个人记录博客、分享学习知识所用。