Erstellen Sie eine einseitige App mit Go and Vue

Dieser Artikel, der ursprünglich im Okta Developer-Blog veröffentlicht wurde, zeigt, dass das Erstellen einer sicheren, einseitigen Anwendung (SPA) mit Vue.js und einem Go Backend erstellt wird. Es nutzt Okta für Authentifizierung und MongoDB für Datenpersistenz. Mit dem Spa können Benutzer GitHub nach Open-Source-Projekten durchsuchen, sie bevorzugen und Notizen hinzufügen.

Spas bieten verbesserte Benutzererfahrungen mit umfangreichen Interaktionen und schnellem Feedback. Sie stellen jedoch Frontend -Herausforderungen in Bereichen wie Authentifizierung und Staatsmanagement vor. Vue.js vereinfacht diesen Prozess.

vue.js highlights:

• Einfache Lernkurve und inkrementelle Einführung.
• vue-cli Stromlinien -Projekt -Setup.
• starke Unterstützung der Gemeinschaft.
• Flexible Komponentenbasierte Architektur.

Anwendungsarchitektur:

Das Tutorial erstellt ein Vue.js -Frontend mit Vuex für die staatliche Verwaltung, Vuetify für Materialdesignkomponenten und Vue -Router für die Navigation. Der Go Backend bietet eine REST -API und verwendet Oktas Go JWT -Verifier für sichere Authentifizierung über JSON Web Tokens (JWTS) und OpenID Connect (OIDC). MongoDB speichert die Anwendungsdaten.

Projekt -Setup:

1. Verzeichnisstruktur: Das Projekt ist mit dem GO Backend und Vue.js Frontend im selben Projektverzeichnis organisiert. vue-cli Gerüste die VUE.JS -Anwendung.
2. Vuetify -Integration: vuetify wird hinzugefügt, um die Benutzeroberfläche mit Materialdesignkomponenten zu verbessern.
3. OKTA -Authentifizierung: Ein kostenloses Okta -Entwicklerkonto wird zum Erstellen einer OIDC -Anwendung verwendet, die eine sichere Benutzerauthentifizierung und -verwaltung bereitstellt. Das Okta Vue SDK vereinfacht die Integration.

Routing und Komponenten:

Die Anwendung definiert Routen für Anmeldung, ein Haupt -Dashboard (/me) und einzelne Projektdetails (/repo/:id). Die Authentifizierung wird mithilfe von Oktas authRedirectGuard erzwungen. Komponenten verwalten Benutzerinteraktion, Datenanzeige und Kommunikation mit dem Go Backend.

Gehen Sie Backend:

Der Go Backend verwendet MongoDB für die Datenpersistenz. Eine kudo struktur repräsentiert favorisierte Projekte. Die Service -Schicht behandelt die Geschäftslogik und interagiert mit dem Repository. HTTP -Handler verwalten API -Anfragen mit JWT Verifier Middleware von Okta zur Authentifizierung.

Ausführen der Anwendung:

a Makefile vereinfacht den Build- und Laufprozess und verwendet Docker Compose für die Verwaltung von MongoDB.

Weiteres Lernen:

Der Artikel endet mit Links zu zusätzlichen Ressourcen auf Vue.js und Go, einschließlich der Tutorials von OKTA zu PWAs und Authentifizierung.

Diese umgeschriebene Version behält die Bedeutung des ursprünglichen Inhalts bei gleicher Verbesserung der Lesbarkeit und des Flusses unter Verwendung einer prägnanteren Sprache und klareren Abschnittsüberschriften. Die Bilder bleiben in ihrem ursprünglichen Format und ihrer Positionen.

Das obige ist der detaillierte Inhalt vonErstellen Sie eine einseitige App mit Go and Vue. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!