HyrKGsWebsite

Einführung Totroducu

Mein persönliches Front -End Zero Basic Learning Project, Task -Sendern -Lernen! Von Zeit zu Zeit aktualisiert, in der Regel arbeiten und studieren.

Ich Vorschau (Vorschau): http://hyrkg.cn

Willkommen in der oberen rechten Ecke ↗️ Sterne mein Projekt, lass uns gemeinsam Fortschritte lernen!

?

• Rückendeende
• Anmeldesystem (erwartet von OAuth2)
  • LocalStorage & SessionStorage
• Einbetten Sie Vitpress in meine Website ein (scheinbar schwierig)
• Großer Plan! ?
  • Front -End -Schnittstelle
  • Langes Vernichten, vielleicht ist es Websocket?
• Vuex, ich muss noch zuerst lernen

• Vollendet! Überprüfte Liste:

• (CSS) Machen Sie die Schnittstelle perfekt mit dem Nachtmodus kompatibel
• (Vue-Transtengroup) Lassen Sie mich machen?
• (Vue, JS) ermöglicht es Komponenten, auf unbestimmte Zeit zu erhöhen oder sich selbst zu löschen. Listen Sie Ladekomponenten auf, anstatt direkt in HTML zu schreiben!
• (Vue, CSS) Meine eigene Flex -Container -Komponente!
• • Wie gut gibt es eine Seite zum Lernen und Spielen speziell. ?
• (Vue-Router) Persönliche Homepage benötigt keine Navigationsleiste und möchte einen einzelnen Seiteneffekt. Verwenden von Kindern in Routen zur Implementierung einer Seite (Singleton) und gemeinsamen Seitenfunktionen
• (Vue-Router) Implementieren Sie die Navigationsfunktion, damit die Navigationsleiste etwas echt ist!
• (VUE, JS) Versuchen Sie, auf die Schaltfläche zu klicken, um das Element zu erhöhen (Antwortliste, Berechnungsattribut, Überwachungskomponentenimplementierung). Jetzt umgesiedelt?
• (Vue) Meine Karten -Vue -Komponentierung!
• (CSS) Optimieren Sie den Kartenanimationseffekt, die Maus wird suspendiert!
• (CSS) Die Navigationsleiste von Element-Plus in seine eigene!
• (CSS) Machen gehört meinem eigenen Biegen (In den frühen Tagen war es Grid und es wurde in der späteren Zeit entdeckt.) Stilstil
• (Vue) kompatibel aus dem Logo des Nachtmodus
• (Nginx) auf meinen Server!
• Verwenden Sie Vite+Vue+Element-UI (Element-Plus-Vite-Starter), um ein eigenes Vue-Projekt zu erstellen

?

Ich habe keine Erfahrung mit der Entwicklung von Front. Im Folgenden gibt es in meiner Website.

Vue

Ich bin eine kombinierte API, die ich direkt lerne. Ali-Element-Plus, die von der Komponentenbibliothek verwendet wird

• [Antwortbasis] reaktiv
• [Grammatikfundament] V-IF (häufig verwendet), V-für (häufig verwendet), v-on (häufig verwendet), V-Model
• 【Berechnungseigenschaften】 Berechnet
• [Komponentierungen] Requisiten (häufig verwendet), Slot (Name, Tempel. Allgemein verwendet), Ereignisrendite [$ emit], übertragene Attribute
• [Routing-Management] Grundkonfiguration von Vue-Router (Pfad, Umleitung, Alias, Kinder, Komponente)
• [Animation] Übergang, Übergangsgruppe
• [Nachtmodus] Das Prinzip besteht darin, HTML eine Klasse (dunkel) hinzuzufügen
• [Antwortüberwachung] Uhr

JavaScript / TypeScript

• [Variablen] var, let, const (häufig verwendet)
• [Object Foundation] Array [], Objekt {} (Ich verwende Karte), alles ist Objekt (hier zu verstehen, warum der Schiedsrichter aus dem Wert kommt
• [Methoden, Passieren, Wiederverwenden] Import, Funktion (Sie können das Prinzip des Berechnung verstehen)

CSS / SCSS:

• 【Style Foundation】
• "Schriftstil: Farbe, Schriftgröße, Schriftfamilie (Schriftart, ich kopiere direkt andere)
• "" Containerstil: Hintergrundfarbe, Border-Radius (abgerundet), Box-Shadow (Border Shadow), Rand (Grenzzeichnung, ich öffne es normalerweise beim Entwerfen und Layout).
• [Fundament der Layout] Polsterung (innere Entfernungsanpassung), Marge (Außenentfernungseinstellung), Breite/Höhe (100%können automatisch gefüllt werden, ansonsten hässlich), max-Breiten-/Maxi-Höhe
• [Flex-Layout, das Seiten mit Mobiltelefonen kompatibel machen kann.
• [Animation Foundation] Übergang, Transformation, Pseudo -Kategorie (wie: Schwebe)
• [Stilpriorität]!

Html

Es scheint, dass es keinen besonderen Wissenspunkt gibt, dh alle Arten von Etiketten müssen im Grunde genommen Baidu sein.

• Teilen Sie es einfach mit DIV und dem Div -Anzug -Etikett und setzen Sie die Syntax im Grunde genommen die meisten Dinge.
• Tipps! Vues Tempel -Tag hat keinen Einfluss auf den Stil!