【ReactPress】React + antd + NestJS + NextJS + MySQL 的简洁兼时尚的博客网站

news2024/11/13 12:02:05

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

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2237560.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

ZISUOJ 2024算法基础公选课练习一(1)

前言、 又是一年算法公选课&#xff0c;与去年不同的是今年学了一些纯C&#xff08;而不是带类的C&#xff09; 一、我的C模板 1.1 模板1 #include <bits/stdc.h> using i64 long long;int main() {std::cin.tie(nullptr)->sync_with_stdio(false);return 0; } 1…

【1】虚拟机安装

1.安装VMware WorkStation Pro VMware下载地址&#xff1a; 密钥&#xff1a;YF390-0HF8P-M81RQ-2DXQE-M2UT6 2.新建虚拟机 centos7下载地址&#xff1a;centos-7.9.2009-isos-x86_64安装包下载_开源镜像站-阿里云

【SpringBoot】SpringBoot自带的Jackson入门使用

导入依赖 springboot自带的&#xff0c;挨个点进去&#xff0c;就能找到 自定义对象转换器 import com.fasterxml.jackson.databind.DeserializationFeature; import com.fasterxml.jackson.databind.ObjectMapper; import com.fasterxml.jackson.databind.module.SimpleModu…

软件工程概论项目(一),git环境的配置和平台代码的拉取

距离软工概论项目答辩还有五个周的时间&#xff0c;需要做一个项目&#xff0c;把心得体会都做一个记录。以便以后进行回顾和反思 这里写目录标题 一、环境的配置gitbash 一、环境的配置 gitbash 安装gitbash&#xff0c;简单说两句&#xff0c;git用于多人协作和代码托管&am…

分布式数据库中间件mycat

MyCat MyCat是一个开源的分布式数据库系统&#xff0c;它实现了MySQL协议&#xff0c;可以作为数据库代理使用。 MyCat(中间件)的核心功能是分库分表&#xff0c;即将一个大表水平分割为多个小表&#xff0c;存储在后端的MySQL服务器或其他数据库中。 它不仅支持MySQL&#xff…

万字长文解读深度学习——循环神经网络RNN、LSTM、GRU、Bi-RNN

&#x1f33a;历史文章列表&#x1f33a; 深度学习——优化算法、激活函数、归一化、正则化深度学习——权重初始化、评估指标、梯度消失和梯度爆炸深度学习——前向传播与反向传播、神经网络&#xff08;前馈神经网络与反馈神经网络&#xff09;、常见算法概要汇总万字长文解读…

一文了解什么是腾讯云开发

关于云开发的猜想 说到云开发&#xff0c;作为开发者的大家是否大概就有了想法。比如说过去的开发工作都是在自己本地电脑的开发工具&#xff0c;比如IDEA开发工具进行开发的&#xff0c;开发完成后再部署到服务器测试以及上线。那么腾讯云开发&#xff0c;是不是就是不用本地…

双指针算法的妙用:提高代码效率的秘密(2)

双指针算法的妙用&#xff1a;提高代码效率的秘密&#xff08;2&#xff09; 前言&#xff1a; 小编在前几日讲述了有关双指针算法两道题目的讲解&#xff0c;今天小编继续进行有关双指针算法习题的讲解&#xff0c;老规矩&#xff0c;今天还是两道题目的讲解&#xff0c;希望…

【Python】从入门开始抓取你想要的电影,一周可掌握基础,附完整源码

Python学习很简单&#xff0c;只是你走进了误区。 为什么你一定要先掌握枯燥的基础点后&#xff0c;再去做实际操作呢&#xff1f; 其实&#xff0c;你根本坚持不了那么长时间&#xff0c;但实际上你可以直接去做python项目。 不信&#xff1f;看看我做这个项目的思路&#x…

逐梦代码深林:Linux编译之舞,链接之诗——自举、动静态库的浪漫旅程

文章目录 问题引入&#xff0c;为什么要进行编译->汇编?一、详细解释编译器自举1. 从最初的二进制编程到汇编2. 第一代汇编编译器的诞生3. 编译器自举的出现&#xff1a;从汇编到更高级的编译器4. 自举的延续&#xff1a;从汇编到高级编程语言5. 为什么要进行编译器自举&am…

AI 写作(六):核心技术与多元应用(6/10)

一、AI 写作的核心技术概述 AI 写作在当今数字化时代正发挥着越来越重要的作用。它不仅极大地提高了写作效率&#xff0c;还为不同领域带来了创新的可能性。 AI 写作的核心技术主要包括基于模板的文本生成和基于深度学习的文本生成。基于模板的文本生成通常依赖预先设定的模板…

米家通过HomeAssistant控制笔记本电脑开关机

米家通过HomeAssistant控制笔记本电脑开关机 配置HomeAssistant配置EMQX mqtt自动化配置电脑关机实现电脑开机实现&#xff08;网络唤醒WOL包&#xff09; 环境准备&#xff1a; HomeAssistant&#xff1a;能配置接入米家的设备&#xff0c;我这里采用fnos安装MQTT服务器&…

QT信号和槽与自定义的信号和槽

QT信号和槽与自定义的信号和槽 1.概述 这篇文章介绍下QT信号和槽的入门知识&#xff0c;通过一个案例介绍如何创建信号和槽&#xff0c;并调用他们。 2.信号和槽使用 下面通过点击按钮关闭窗口的案例介绍如何使用信号和槽。 创建按钮 在widget.cpp文件中创建按钮代码如下 …

环境背景文本到语音转换

&#x1f3e1;作者主页&#xff1a;点击&#xff01; &#x1f916;编程探索专栏&#xff1a;点击&#xff01; ⏰️创作时间&#xff1a;2024年11月9日23点20分 点击开启你的论文编程之旅https://www.aspiringcode.com/content?id100000000027&uida9ecaa6323844415b87…

MySQL初学之旅(1)配置与基础操作

目录 1.前言 2.正文 2.1数据库的发展历程 2.2数据库的基础操作 2.2.1启动服务 2.2.2创建与删除数据库 2.2.3数据类型 2.2.4创建表与删除表 2.3MySQL Workbench基础使用简介 3.小结 1.前言 哈喽大家好吖&#xff0c;今天博主正式开始为大家分享数据库的学习&#xff…

【环境搭建】使用Dockerfile构建容器搭建Kylin特定版本

Kylin的有些版本官方已经下架了&#xff0c;Docker Hub上也没镜像了&#xff0c;所以需要自己搭建以下&#xff0c;为了以后更方便快捷地使用&#xff0c;就编写了一个更轻量级的Dockerfile。 准备工作 本次搭建使用的源码包来自华为云镜像站&#xff0c;里面有Kylin各个版本…

【图】图学习

0 回顾数据结构逻辑 1 图的定义和基本术语 必须有顶点&#xff0c;可以没有边。 Cn2和2*Cn2&#xff08;数学上的&#xff0c;n个顶点取2个顶点&#xff09; 概念有些多。。。。。。 2 图的定义 3 图的存储结构 无向图的邻接矩阵 有向图的邻接矩阵 网&#xff08;有权图&#…

基于RMD算法模型的信号传输统计特性的matlab模拟仿真

目录 1.程序功能描述 2.测试软件版本以及运行结果展示 3.核心程序 4.本算法原理 5.完整程序 1.程序功能描述 基于RMD算法模型的信号传输统计特性的matlab模拟仿真。参考的文献如下&#xff1a; 即通过RMD随机中点位置模型算法&#xff0c;实现上述文献的几个仿真图。 2.…

【React】React 生命周期完全指南

&#x1f308;个人主页: 鑫宝Code &#x1f525;热门专栏: 闲话杂谈&#xff5c; 炫酷HTML | JavaScript基础 ​&#x1f4ab;个人格言: "如无必要&#xff0c;勿增实体" 文章目录 React 生命周期完全指南一、生命周期概述二、生命周期的三个阶段2.1 挂载阶段&a…

软件工程 软考

开发大型软件系统适用螺旋模型或者RUP模型 螺旋模型强调了风险分析&#xff0c;特别适用于庞大而复杂的、高风险的管理信息系统的开发。喷泉模型是一种以用户需求为动力&#xff0c;以对象为为驱动的模型&#xff0c;主要用于描述面向对象的软件开发过程。该模型的各个阶段没有…