중국어 간체 |
프런트엔드와 백엔드가 분리된 Spring Boot + Vue 기반 콘텐츠 관리 시스템
데모: (www.icecmspro.com) 백스테이지: (admin.icecmspro.com)
공식 홈페이지: (www.icecms.cn)
IceCMS 문서: (http://www.icecms.cn)
콘텐츠 관리: 기사, 사진, 자료 등 다양한 유형의 콘텐츠를 관리합니다.
열 관리: 열을 사용자 정의하고 열을 추가, 삭제, 수정 및 확인합니다.
사용자 관리: 권한 추가, 삭제, 수정, 할당 등의 기능을 포함하여 백엔드 사용자를 관리합니다.
데이터 통계: 웹사이트 방문, 사용자 행동 등에 대한 통계 분석
템플릿 관리: 웹사이트 템플릿을 사용자 정의하여 웹사이트를 쉽고 빠르게 구축합니다.
SEO 최적화 : 홈페이지 제목, 키워드, 설명 등 SEO 최적화 기능
프론트 데스크: www.icecmspro.com
유니앱 모바일 단말기: uni.icecmspro.com
백스테이지: admin.icecmspro.com 계정 admin
비밀번호 admin123
API 문서: api.icecmspro.com/doc.html
JDK8을 기반으로 개발되었으므로 8 이상의 종속성을 추가해야 합니다.
< dependency >
< groupId >javax.xml.bind</ groupId >
< artifactId >jaxb-api</ artifactId >
< version >2.3.0</ version >
</ dependency >
핵심 프레임워크: Vue2.x, Vue Router, Vuex
Vue 프로젝트는 @vue/cli4.x를 기반으로 구축되었습니다.
JS 종속성 및 참조 CSS: axios, moment, nprogress, v-viewer, prismjs, APlayer, MetingJS, lodash, mavonEditor, echarts, tocbot, iCSS
백엔드 CMS는 부분적으로 vue-admin-template을 기반으로 합니다.
UI 프레임워크는 Element UI입니다.
요소 UI: 부분 사용, 일부 작은 구성 요소, 빠른 효과 구현을 용이하게 하기 위해 UI 스타일 변경
라벨 기능 추가
일부 UI 개선
Docker 프런트엔드 배포 방법
docker compose 원클릭 배포
Docker 배포 방법(권장, 빠른 실행 또는 테스트에 사용할 수 있음)
# 未安装docker的请先安装docker,已经安装的跳过此步
yum install docker-ce -y
#启动docker
systemctl start docker
# 配置国内源
# 创建docker目录
sudo mkdir -p /etc/docker
# 创建配置文件
sudo tee /etc/docker/daemon.json <<-'EOF'
{
"registry-mirrors": ["https://mirror.ccs.tencentyun.com"]
}
EOF
# 加载新的配置文件
sudo systemctl daemon-reload
# 重启docker服务
sudo systemctl restart docker
main-命令执行
Ps:按顺序执行
1.运行Mysql容器
docker run -d -p 0:3389
--name ice-sql
--restart always
thecosy/icemysql:v2.2.0
2.运行Spring容器
docker run -d -p 8181:8181
--name ice-api
--restart always
--link ice-sql:db
thecosy/icecms:v2.2.0
3.运行Vue容器
docker run -d -p 3000:80
--name ice-vue
--restart always
--link ice-api:iceApi
thecosy/icevue:v2.2.0
#访问前端地址http://ip:3000
iceCMS/
├── HELP.md
├── IceCMS-java.iml
├── IceCMS-main --java主程序启动入口
│ ├── IceCMS-main.iml
│ ├── main.iml
│ ├── pom.xml
│ ├── src
│ └── target
├── IcePay-ment --java支付模块
│ ├── IcePay-ment.iml
│ ├── pom.xml
│ ├── src
│ └── target
├── IceWk-ment --java前端api模块
│ ├── IceWk-ment.iml
│ ├── pom.xml
│ ├── src
│ └── target
├── IceWk-uniApp --h5Uniapp模块
│ ├── App.vue
│ ├── LICENSE
│ ├── components
│ ├── main.js
│ ├── manifest.json
│ ├── nPro
│ ├── package-lock.json
│ ├── package.json
│ ├── pages
│ ├── pages.json
│ ├── static
│ ├── store
│ ├── subPage
│ ├── template.h5.html
│ ├── theme
│ ├── uni.scss
│ ├── uni_modules
│ ├── utils
│ └── vue.config.js
├── IceWk-vues --前端vue模块
│ ├── LICENSE
│ ├── README.md
│ ├── babel.config.js
│ ├── build
│ ├── dist
│ ├── jest.config.js
│ ├── jsconfig.json
│ ├── node_modules
│ ├── package-lock.json
│ ├── package.json
│ ├── postcss.config.js
│ ├── public
│ ├── serverless.yml
│ ├── src
│ ├── vue.config.js
│ └── yarn.lock
├── README.md
├── bin
│ ├── clean.bat
│ ├── package.bat
│ └── run.bat
├── doc
│ └── IceCMS环境使用手册.docx
├── mvnw
├── mvnw.cmd
├── pom.xml
└── sql --项目sql文件
├── icecms5.6.sql
└── icecms8.0.sql
1.환경 구성
MySQL JDK1.8 이상 Maven Nodejs WeChat 개발자 도구
2. MySQL 데이터베이스 IceCMS
를 생성하고 /sql/IceCMS.sql
을 실행하여 테이블 데이터를 초기화합니다.
3. iceCMS-주 관리 백그라운드의 백엔드 서비스 시작
3.1. 데이터베이스 연결을 구성하기 위해 IceCMS-main/src/main/resources/application.yml
구성 정보를 수정합니다.
3.2. Redis를 설치하고 시작합니다. (사용하지 않으면 영향을 미치지 않습니다.)
3.3. 명령줄을 열고 다음 명령을 입력합니다.
cd iceCMS
mvn install
mvn clean package
java -Dfile.encoding=UTF-8 -jar iceCMS/iceCMS-main/target/iceCMS.jar
#在iceCMS.jar目录输入 java -jar iceCMS.jar
4. iceCMS-vues 디렉토리를 입력하세요
명령줄을 열고 다음 명령을 입력하세요.
# 克隆项目
git clone https://github.com/PanJiaChen/vue-admin-template.git
# 进入项目目录
cd IceWk-VUE
# 安装依赖
npm install
# 建议不要直接使用 cnpm 安装以来,会有各种诡异的 bug。可以通过如下操作解决 npm 下载速度慢的问题
npm install --legacy-peer-deps --registry=https://registry.npm.taobao.org
# 启动服务
npm run dev
# 构建测试环境
npm run build:stage
# 构建生产环境
npm run build:prod
5. 프런트 엔드 시작
브라우저를 열고 http://localhost:9528을 방문하여 프런트 엔드 페이지로 들어갑니다.
프런트엔드 및 백엔드 시작(백엔드 주소 http://localhost:9528/admin)
6. 유니앱 모바일 단말기를 시작하세요
다운로드HBuilderX
(https://ext.dcloud.net.cn/plugin?id=9261) uniapp 모바일 플러그인 디렉터리를 입력하고 가져오기를 클릭한 후 로컬로 가져옵니다.
IceCMS-uniapp 프로젝트를 로컬에서 열 수도 있습니다
IceWK-uniApp
디렉터리를 열고 컴파일하고 패키징합니다.
자주 묻는 질문:
utf8mb4
인지 확인하는 경우 일반적으로 문제가 없습니다("사이트 설정" 및 "기사 세부 정보"와 같은 많은 테이블 필드에는 이모티콘 표현을 지원하기 위해 utf8mb4
형식 문자 집합이 필요합니다. 그렇지 않으면 SQL 파일을 가져올 때 가져오기가 성공하면 일부 필드가 불완전하여 프런트엔드 페이지에서 데이터를 렌더링할 때 오류가 발생합니다.root
, 123123
입니다. 개인 프로젝트이므로 비밀번호를 변경할 수 있는 페이지가 없습니다. top.naccl.util.HashUtils
아래의 main
메소드에서 비밀번호를 수동으로 생성하여 저장할 수 있습니다. 데이터베이스에서.application-dev.properties
의 구성 정보를 수정하는 데 주의하세요.token.secretKey
수정할 때 주의하세요. 그렇지 않으면 토큰 보안이 보장되지 않습니다. QQ 커뮤니케이션 그룹: (951286996)
Tg 그룹: [https://t.me/+1rau4SBwFyE1OTA1](https://t.me/+1rau4SBwFyE1OTA1)
본 그룹은 학습 및 교류 그룹으로, 프로그램 관련 이슈가 있을 경우 직접 이슈를 제출해 주시기 바랍니다.
GPL-3.0 라이센스 © pipipi-pikachu
비상업적 오픈 소스 소프트웨어 라이선스를 제공한 JetBrains에 감사드립니다.