【亲测免费】 NiceFish（美人鱼）项目教程

1、项目介绍

NiceFish（美人鱼）是一个系列项目，旨在示范前后端分离的开发和部署模式。前端有三个版本：浏览器环境、移动端环境、Electron 环境；后端有两个版本：SpringBoot 版本和 SpringCloud 版本。该项目的目标是提供一个完整的开发框架，帮助开发者理解和实践前后端分离的开发模式。

2、项目快速启动

2.1 克隆项目

首先，克隆 NiceFish 项目到本地：

git clone https://github.com/damoqiongqiu/NiceFish.git

2.2 安装依赖

进入项目目录并安装依赖：

cd NiceFish
npm install

2.3 启动项目

启动前端项目：

npm start

启动后端项目（以 SpringBoot 版本为例）：

cd nicefish-spring-boot
./mvnw spring-boot:run

3、应用案例和最佳实践

3.1 应用案例

NiceFish 项目可以用于开发各种类型的 Web 应用，包括但不限于：

• 企业内部管理系统
• 电子商务平台
• 社交网络应用

3.2 最佳实践

• 前后端分离：NiceFish 项目示范了如何通过 API 进行前后端通信，确保前后端代码的独立性和可维护性。
• 组件化开发：使用 PrimeNG 和 Bootstrap 等组件库，提高开发效率和代码复用性。
• 数据可视化：集成 ECharts 和 ngx-echarts，实现丰富的数据可视化效果。

4、典型生态项目

4.1 NiceFish-React

NiceFish-React 是 NiceFish 项目的 React 版本，基于 React 18，使用 PrimeReact 组件库，适合熟悉 React 框架的开发者。

4.2 NiceFish-Ionic

NiceFish-Ionic 是一个移动端 demo，基于 Ionic 框架，支持 PWA（渐进式 Web 应用），适合开发移动端应用。

4.3 NiceBlogElectron

NiceBlogElectron 是一个基于 Electron 的桌面端项目，将 NiceFish 打包成桌面端应用，适合需要开发桌面端应用的场景。

通过以上模块的介绍，您可以快速了解和启动 NiceFish 项目，并根据实际需求进行开发和部署。