使用react+docusaurus快速搭建一个博客网站
2023-06-13 09:16:28 时间
快速搭建一个react个人静态博客网站,并使用vercel免费部署发布到线上#
首先看下成果图:
本篇你将您学到:
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源码到本地,然后运行#
此处可以选择峰华的源码,也可以选择我的这个仓库的源码,我这个仓库源码是改完之后的,下面我将以我的仓库源码作为演示。
2 修改页眉页脚、首页#
b站视频10:00’往后;
3 上传自己的博客(blog)#
b站视频16:40‘往后;
4 上传自己的文档(doc)#
b站视频27:35秒往后;
5 将前端网站部署发布到线上 (vercel)#
见b站视频;
6 本篇博客网站搭建视频教程#
https://www.bilibili.com/video/BV19K4y197yA/
注:本网站仅作为个人记录博客、分享学习知识所用。
相关文章
- 雷军做程序员时写的博客,有点东西!
- Hexo博客框架初识入门到进阶.md
- react的jsx和React.createElement是什么关系?面试常问
- zblog系统博客的robots.txt文件的写法教程
- K2 编译器将在 Kotlin 2.0 中进入稳定状态 | 官方博客
- 使用 Hexo 和 GitHub 实现一台电脑的搭建两个博客
- react源码分析--深度理解React.Context
- 一个颜值爆表的开源博客系统
- react 基础之组件篇二——Style in React
- 优化多用户博客 WordPress 文章列表页加载
- 博客世界最受欢迎的30个插件
- Maintenance Mode:把博客设置为维护状态的 WordPress 插件
- 跟踪博客留言回复的三种方法
- 如何有规律的备份 WordPress 博客
- WordPress 技巧:将你的博客添加到百度首页
- 2020年总结下过去的一年博客的变化
- 经典|如何快速成为CSDN博客专家详解程序员
- [nodejs] nodejs开发个人博客(一)准备工作详解编程语言
- 数据库支持的网络服务:玩转MySQL博客(mysql blog)