vue admin blog

W-Blog

beschreiben

Ein persönlicher Blog, der Spring Boot 2.x im Backend, NuxtJs im Frontend und Vue im Backend verwendet

Einführung

1. Link

• Gitee-Link:

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

  • Rezeption: https://gitee.com/windsnowli/vue-ssr-blog

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

• GitHub-Link:

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

  • Rezeption: https://github.com/WindSnowLi/vue-ssr-blog

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

2. Ein einfaches persönliches Blog-Projekt ist in drei Teile unterteilt:前台,后台und api .

3. Das API-Backend basiert auf SpringBoot . Verlässt sich hauptsächlich auf mybatis , fastjson , DruidDataSource , Lombok , java-jwt , aliyun-sdk-oss , knife4j usw. Die Datenbank verwendet MySQL8.0+

4. Der Hauptstil des Front Desks stammt aus einer BizBlog Vorlage im Internet. Ich weiß nicht, woher er ursprünglich stammt. Er wurde auf der Grundlage des Originals in ein nuxtJs -Projekt umgeschrieben.

5. Der in der Hintergrund-Benutzeroberfläche verwendete vue-element-admin wird grundsätzlich direkt verwendet. Wenn Sie ihn selbst anpassen möchten, lässt Ihre Stärke dies nicht zu.

6. Beispiel: Grünes Futter – Cai Dog

Beginnen Sie lokal

API: Die vom Front- und Backend angeforderte API verwendet dasselbe Projekt

1. git clone https://gitee.com/WindSnowLi/w-blog-api.git oder git clone https://github.com/WindSnowLi/w-blog-api.git um das Projekt lokal zu klonen
2. mvn clean install dependency:tree
3. Ändern Sie die Datenbankkonfigurationsinformationen in der Entwicklungsumgebung application-dev.yml und in der Produktionsumgebung application-prod.yml . knife4j ist nur in der Entwicklungsumgebung aktiviert.
4. Erstellen Sie eine leere Datenbank mit dem in der Datenbankkonfiguration angegebenen Namen und UTF8 -Kodierung
5. mvn clean package -Dmaven.test.skip=true überspringt Tests und generiert jar Pakete
6. java -jar 生成的包名.jar wird zum Ausführen der Entwicklungskonfigurationsumgebung verwendet. Die Datenbank wird beim ersten Start automatisch initialisiert.
7. Besuchen Sie http://127.0.0.1:8888/doc.html um die api -Dokumentation anzuzeigen
8. Es wird empfohlen, IDEA zum Öffnen des Projektordners zu verwenden, um Abhängigkeiten automatisch zu verarbeiten und den Betrieb zu erleichtern.

Rezeption

1. git clone https://gitee.com/WindSnowLi/vue-ssr-blog.git oder git clone https://github.com/WindSnowLi/vue-ssr-blog.git klonen das Projekt auf lokal
2. npm install Installationsabhängigkeiten
3. Die host in der Datei config/sitemap.xml kann geändert werden, um eine Zugriffskarte zu generieren.
4. Die Portnummer in nuxt.config.js kann geändert werden
5. Sie können BASE_URL im script in der Datei package.json ändern, um die Backend- api -Adresse anzugeben.
6. npm run build
7. npm start lokal ausführen

Hinter der Bühne

1. git clone https://gitee.com/WindSnowLi/vue-admin-blog.git oder git clone https://github.com/WindSnowLi/vue-admin-blog.git klonen das Projekt auf lokal
2. npm install Installationsabhängigkeiten
3. npm run dev verwendet eine simulierte Datenvorschauschnittstelle
4. Ändern Sie die VUE_APP_BASE_API -Adresse in der Datei .env.production in die Adresse der Backend api
5. npm run build:prod kompilieren
6. Die kompilierten Dateien im dist Ordner können für den Zugriff unter dem http -Server abgelegt werden (Sie können npm verwenden, um http-server zu installieren).
7. Standardkonto: [email protected] , Passwort: 123456

Schnittstellenanzeige

Rezeption

Hinter der Bühne

Lizenz

MIT

Copyright (c) 2021 WindSnowLi