Einführen
- Jeder kann problemlos einen hübschen Web -Lebenslauf erstellen (mit einiger Codierung ..)
- Weiter.js, Bootstrap CSS wird verwendet.
- Tatsächlich haben https://github.com/uyu423/Resume- Legacy es mit Next.js.
- Beispiel: https://uyu423.github.io/resume-nextjs
- Weitere Beispiele finden Sie unter Beispiel.md.
Mitwirkende
- Yowu (uyu423)
- Dal-ya
- Taeyeong Kim (Eidechse-Kim)
- Taeyang Jin (Heli-Os)
- Hyoguun oh (ZeroHertz)
Anforderungen
- Node.js> 18
- Node.js 18 Die
ERR_OSSL_EVP_UNSUPPORTED das aus der Version 18 oder höher entsteht, um zu vermeiden, NODE_OPTIONS=--openssl-legacy-provider Option angewendet wird. - Es wird empfohlen, es in der Node.js -Version von 18 oder später zu testen und die Verwendung der in
.nvmrc aufgeführten Node.js -Version zu empfehlen.
Installieren
# fork to your github account & git cloning your forked repository
npm install
Entwicklungsmodus ausführen
Struktur
- Vermögenswert/
- Komponente/
- Seiten/
- Es ist nur eine Seite zum Rendern von
index.html .
- Nutzlast/
- Sie können Ihren persönlichen Web -Lebenslauf ausziehen, indem Sie Ihre Nutzlastdaten ändern.
- Es enthält die Daten, die für die Wiedergabe des Lebenslaufs erforderlich sind.
- Nutzlastdetail unten
- Docs/
- Wenn
npm run export (next export) ausgeführt wird, wird das statische HTML am Ende docs -Verzeichnisses gerendert und generiert. - GitHub Pages '
docs/ Verzeichnis von Github -Seiten können auf Github -Seiten durchgeführt werden. -
docs/typedoc/ enthält typeDoc html, erzeugt jedoch nicht als npm run export . Sie können eine TypeDoc mit npm run typedoc erstellen.
Nutzlastbeschreibung
- TypeDoc: https://uyu423.github.io/resume-nextjs/typedoc
- Der Rendering -Beispiel -Screenshot für alle Nutzlasten innerhalb der TypeDoc.
- Alle Nutzlasten außer
_global und footer -NUTSLADS haben disable?: boolean Feld. Wenn das Feld true ist, macht es den Abschnitt dieser Nutzlast nicht.
Profil
- Profilbild, Name, Kontaktmittel, einige Hinweisebereiche
- TypeDoc: iProfile.Payload
- TS -Beispiel: Payload/Profil.ts
Einführen
- Self -Einführung
- TypeDoc: iinTroduce.paylod
- TS -Beispiel: Nutzlast/Einführung.ts
Fähigkeit
- Einführungsbereich für Ihre eigene Technologie
- TypeDoc: iskill.payload
- TS -Beispiel: Nutzlast/Fähigkeiten.TS
Erfahrung
- (Arbeitsplatz) Einführungsbereich für Erfahrung
- TypeDoc: iexperience.paylod
- TS -Beispiel: Nutzlast/Erfahrung.ts
Projekt
- Einführungsbereich für Implementierungsprojekte
- TypeDoc: iProject.payload
- TS -Beispiel: Payload/Project.ts
Open Source
- Einführung von Open Source -Aktivitäten
- Typedoc: Iopensource.paylod
- TS -Beispiel: Nutzlast/OpenSource.ts
Präsentation
- Einführung von Präsentationsaktivitäten
- TypeDoc: iPresentation.payload
- TS -Beispiel: Nutzlast/Präsentation.ts
Artikel
- Blog/SNS -Beitrag, Einführungsbereich für Artikel
- TypeDoc: iarticle.paylod
- TS -Beispiel: Nutzlast/Artikel.TS
Ausbildung
- Einführung in den Akademiker
- TypeDoc: ieducation.payload
- TS -Probe: Nutzlast/Bildung.ts
USW
- Einführung in andere Elemente (Wettbewerbe, Zertifizierungen, Service usw.)
- TypeDoc: ietc.paylod
- TS -Beispiel: Nutzlast/etc.ts
_Global
- Einstellungsbereich für globale Einstellungen (Webtitel, SEO, Favicon usw.)
- Typedoc: iglobal.payload
- TS -Beispiel: Payload/_global.ts
Export
- Am Ende von
/docs werden statische HTML -Ressourcen generiert. - Sub -Pfad -Verzweigungen ändern die Domänenstruktur (z. B. https://uyu423.github.io/Resume). Ändert
homepage -Feldes in package.json in eine Domain, die Sie hosten möchten.- Wenn es im Feld
homepage pathname gibt, gibt es eine Logik, die assetPrefix von next.config.js hinzufügt
Export auf Github -Seiten
Repository -Einstellung
- Optionen -github Seiten -Säure -Select Master Branch /DOCS -Ordner
- Weitere Informationen zu GitHub Pages Quelle finden Sie unter help.github.com.
- Führen Sie
npm run export , um die statische HTML in docs zu aktualisieren. - Wenn Sie eine externe Domain haben, füllen Sie bitte das benutzerdefinierte Domain -Element aus.
-
docs/CNAME -Datei wird während npm run export automatisch erstellt. - Siehe
package.json homepage -Feld für die Erstellung docs/CNAME -Dateien. Ändern Sie den Homepage -Wert, wenn Sie benutzerdefinierte Domäne verwenden. - Wenn
homepage im package.json als *.github.io/* wird es als nicht die benutzerdefinierte Domäne angesehen und generiert keine docs/CNAME . - Weitere Informationen zu externen Domänen finden Sie unter help.github.com.
-
*.github.io Wenn Sie die Domäne so verwenden http://{username}.github.io/{repository_name} Wenn Sie eine Verbindung herstellen, sehen Sie einen Web -Lebenslauf.
Beitrag
- Wenn Sie zusätzliche Funktionen wünschen, schauen Sie bitte. Immer offen.
Frage?
- Wenn das Bild in der Produktion gebrochen wird
- Wie passen Sie die Reihenfolge des Abschnitts an?
- Derzeit haben Sie keine andere Wahl, als die Rendering -Reihenfolge direkt von
pages/index.tsx zu ändern. - Ich denke darüber nach, wie ich mit Daten oder
_global -Nutzlast damit umgehen kann.
- Im Falle eines Bildes CSS 404 in Index.html