ReactPress
是使用React开发的开源发布平台,用户可以在支持React和MySQL数据库的服务器上架设属于自己的博客、网站。也可以把ReactPress
当作一个内容管理系统(CMS)来使用。
前言
此项目是用于构建博客网站的,包含前台展示、管理后台和后端。
此项目是基于 React + antd + NestJS + NextJS + MySQL 的,项目已经开源,项目地址在 github 上,喜欢的,欢迎给个 star 。
项目地址:https://github.com/fecommunity/reactpress
- 前台&管理后台展示: https://github.com/fecommunity/reactpress/tree/master/client
- 后端:https://github.com/fecommunity/reactpress/tree/master/server
1. 效果图
1.1 前台展示
pc 端
移动端适配
管理后台
管理后台是在蚂蚁金服用户开源的 antd 5.0 基础上进行开发的。
2. 体验地址
网站首页:https://blog.gaoredu.com/
管理后台:https://blog.gaoredu.com/admin
3. 计划
这次是一个完整的全栈式开发,只要部署了这个项目的代码,是完全可以搭建好博客网站的。
环境准备
$ git clone --depth=1 https://github.com/fecommnity/reactpress.git
$ cd reactpress
$ npm i -g pnpm
$ pnpm i
配置文件
项目启动后会加载根目录下的 .env
配置文件,请确保MySQL数据库服务和下面的配置保持一致,并提前创建好 reactpress
数据库
DB_HOST=127.0.0.1 // 数据库地址
DB_PORT=3306 // 端口
DB_USER=reactpress // 用户名
DB_PASSWD=reactpress // 密码
DB_DATABASE=reactpress // 数据库
环境准备好后,执行启动命令:
$ pnpm run dev
打开浏览器访问 http://127.0.0.1:3001
4. 收获与感触
学而不用,基本等于没学,因为最近一直在做自己的个人博客网站,所以好久没更新技术文章了;而且是利用业余时间做的,所以经过差不多两个月的搬砖,现在网站终于都上线了。
开发网站的这段时间里,每天晚上几乎都搬砖到接近 11 点,周末的时间大多也在搬砖,每天写完文章,也快 12 点了,搬砖不易啊,喜欢或者觉得不错的,欢迎到 github 上给个 star,谢谢。
5. 文档教程
- 项目地址: https://github.com/fecommunity/reactpress
- next.js 源码:https://github.com/vercel/next.js
- nest.js 源码:https://github.com/nestjs/nest
ReactPress 系列文章
ReactPress 是什么?:https://blog.csdn.net/m0_37981569/article/details/143495843
ReactPress—基于React的免费开源博客&CMS内容管理系统:https://blog.csdn.net/m0_37981569/article/details/143455403
ReactPress数据库表结构设计全面分析:https://blog.csdn.net/m0_37981569/article/details/143662572
ReactPress 安装指南:从 MySQL 安装到项目启动:https://blog.csdn.net/m0_37981569/article/details/143662086
ReactPress – An Open-Source Publishing Platform Built with React:https://blog.csdn.net/m0_37981569/article/details/143635836
ReactPress:构建高效、灵活、可扩展的开源发布平台:https://blog.csdn.net/m0_37981569/article/details/143635551
ReactPress技术揭秘:https://blog.csdn.net/m0_37981569/article/details/143634709
ReactPress:深入解析技术方案设计与源:https://blog.csdn.net/m0_37981569/article/details/143610300
ReactPress:重塑内容管理的未来:https://blog.csdn.net/m0_37981569/article/details/143610158
ReactPress系列—NestJS 服务端开发流程简介:https://blog.csdn.net/m0_37981569/article/details/143536219
ReactPress系列—Next.js 的动态路由使用介绍:https://blog.csdn.net/m0_37981569/article/details/143535847