vue admin blog

w-blog

describir

Un blog personal que utiliza Spring Boot 2.x en el backend, nuxtJs en el frontend y vue en el backend.

Introducción

1. Enlace

• Enlace de la casa rural:

  • API: https://gitee.com/windsnowli/w-blog-api

  • Recepción: https://gitee.com/windsnowli/vue-ssr-blog

  • Servidor: https://gitee.com/windsnowli/vue-admin-blog

• Enlace de GitHub:

  • API: https://github.com/WindSnowLi/w-blog-api

  • Recepción: https://github.com/WindSnowLi/vue-ssr-blog

  • Servidor: https://github.com/WindSnowLi/vue-admin-blog

2. Un proyecto de blog personal simple se divide en tres partes:前台,后台y api .

3. El backend de la API se basa en SpringBoot . Se basa principalmente en mybatis , fastjson , DruidDataSource , Lombok , java-jwt , aliyun-sdk-oss , knife4j , etc. La base de datos utiliza MySQL8.0+

4. El estilo principal de la recepción proviene de una plantilla BizBlog en Internet. No sé de dónde vino originalmente. Fue reescrito en un proyecto nuxtJs basado en el original.

5. El vue-element-admin utilizado en la interfaz de usuario en segundo plano se usa básicamente directamente. Si desea personalizarlo usted mismo, su fuerza no lo permite.

6. Ejemplo: comida verde - Cai Dog

Empezar localmente

api: la API solicitada por el front-end y el backend utiliza el mismo proyecto

1. git clone https://gitee.com/WindSnowLi/w-blog-api.git o git clone https://github.com/WindSnowLi/w-blog-api.git para clonar el proyecto localmente
2. mvn clean install dependency:tree
3. Modifique la información de configuración de la base de datos en el entorno de desarrollo application-dev.yml y el entorno de producción application-prod.yml . knife4j solo se activa en el entorno de desarrollo.
4. Cree una base de datos vacía con el nombre especificado en la configuración de la base de datos, codificación UTF8
5. mvn clean package -Dmaven.test.skip=true omite pruebas y genera paquetes jar
6. java -jar 生成的包名.jar se utiliza para ejecutar el entorno de configuración de desarrollo. La base de datos se inicializará automáticamente durante la primera ejecución.
7. Visite http://127.0.0.1:8888/doc.html para ver la documentación api
8. Se recomienda utilizar IDEA para abrir la carpeta del proyecto para manejar automáticamente las dependencias y facilitar la operación.

recepción

1. git clone https://gitee.com/WindSnowLi/vue-ssr-blog.git o git clone https://github.com/WindSnowLi/vue-ssr-blog.git clona el proyecto a local
2. npm install dependencias de instalación
3. La dirección host en el archivo config/sitemap.xml se puede modificar para generar un mapa de acceso.
4. El número de puerto en nuxt.config.js se puede modificar
5. Puede modificar BASE_URL en script del archivo package.json para especificar la dirección api de backend.
6. npm run build
7. npm start a ejecutarse localmente

Entre bastidores

1. git clone https://gitee.com/WindSnowLi/vue-admin-blog.git o git clone https://github.com/WindSnowLi/vue-admin-blog.git clona el proyecto a local
2. npm install dependencias de instalación
3. npm run dev utiliza una interfaz de vista previa de datos simulada
4. Modifique la dirección VUE_APP_BASE_API en el archivo .env.production a la dirección de la api de backend
5. npm run build:prod
6. Los archivos compilados en la carpeta dist se pueden colocar en el servidor http (puede usar npm para instalar http-server ) para acceder.
7. Cuenta predeterminada: [email protected] , contraseña: 123456

Pantalla de interfaz

recepción

Entre bastidores

Licencia

MIT

Copyright (c) 2021 WindSnowLi