Ein Toolkit zum Erstellen Ihres Lebenslaufs mit JSON und zum Erstellen stilvoller HTML/PDF -Dateien.
JSONCV umfasst die folgenden Komponenten:
Ausführliche Erklärungen und Nutzungsrichtlinien finden Sie in der folgenden Dokumentation.
JSONCV Verwenden Sie JSON-Schema, um JSON-basierte Standard für CVS zu erstellen.
Das in JSONCV verwendete Schema ist eine Gabel des JSON -Lebenslaufschemas mit den folgenden Unterschieden:
JSON -Schema -Version
JSON Resume verwendet die veraltete Draft-04-Version, während JSONCV den aktuellen Draft-07 verwendet. Um die Kompatibilität mit Draft-07 zu gewährleisten, wurden alle Fälle von additionalItems entfernt.
Zusätzlicher Abschnitt sideProjects
JSONCV enthält einen zusätzlichen Abschnitt mit dem Namen sideProjects , der die Unterscheidung zwischen Nebenprojekten und Karriereprojekten ermöglicht
Zusätzliche name in meta -Abschnitt
JSONCV enthält eine name im meta -Abschnitt, mit dem der Benutzer den gewünschten Namen für exportierte HTML/PDF -Dateien angeben kann.
Diese Unterschiede haben keinen Einfluss auf die Kompatibilität zwischen JSONCV und JSON -Lebenslauf. Dies bedeutet, dass Sie JSON -Lebenslauf -Daten problemlos in JSONCV und umgekehrt importieren können, da JSONCV -Daten die Validierung des JSON -Lebenslaufschemas bestehen.
Der vollständige Unterschied zwischen dem JSON -Lebenslaufschema und dem JSONCV -Schema kann hier angezeigt werden

JSONCV verfügt über einen Online -Editor, der eine grafische Benutzeroberfläche zum Erstellen und Bearbeiten Ihrer JSONCV -Daten bietet. Besuchen Sie es unter https://jsoncv.reorx.com/editor/.
Der Herausgeber besteht aus drei Panes von links nach rechts:
Seitenleiste
Ermöglicht die Navigation zu verschiedenen Abschnitten im Schemaformular und bietet Vorgänge wie "Download HTML" und "Daten hochladen"
Schemaform
Mit den Eigenschaften Ihrer Lebenslaufdaten bearbeiten Sie. Sie können auch auswählen, welche Eigenschaften angezeigt oder ausgeblendet werden sollen.
Vorschau
Zeigt den gerenderten CV -HTML an, wenn Änderungen im Schemaformular vorgenommen werden.
Das Kernprodukt von JSONCV ist CV HTML, die HTML -Darstellung Ihrer JSONCV -Daten. Es handelt sich um ein kompaktes HTML-Dokument mit einem Datei, das in PDF konvertiert oder online gehostet werden kann, um eine statische CV-Website zu erstellen.
CV HTML wurde mit einem bestimmten Layout entwickelt, um einen Lebenslauf auf einem A4 -Blatt Papier anzuzeigen. Das CSS wurde auf die Optimierung des Druckens zugeschnitten und die beste Typografie sichergestellt, ob auf Papier gedruckt oder als PDF gespeichert wird. Daher eignet sich CV HTML am besten für die Erstellung professioneller oder akademischer Lebensläufe und nicht für kreative oder interaktive Portfolio -Websites.
CV HTML unterstützt Themen, die im src/themes -Verzeichnis zu finden sind.
Um CV HTML zu erhalten
Konverter sind Skripte, mit denen Benutzer JSONCV -Daten aus/in andere Quellen konvertieren können.
Derzeit ist nur ein Konverter verfügbar: rxresume-to-jsoncv.js , das Daten aus RxResume in das JSONCV-Format umwandelt.
Wenn Sie zusätzliche Anforderungen haben, können Sie bitte ein Problem einreichen. Pull -Anfragen werden ebenfalls sehr geschätzt.
Es wird empfohlen, Ihren Lebenslauf mit dem Online -Editor zu schreiben. Wenn Sie jedoch mit JSON vertraut sind, können Sie die Datendatei mit einem Texteditor auf Ihrem lokalen Computer verwalten.
Wenn Sie den Editor zum ersten Mal öffnen, wird ein Beispieldaten geladen. Sie können es entweder bearbeiten oder auf die Schaltfläche "Neue Daten" klicken, um mit einem leeren Formular zu beginnen. Ihre Lebenslaufdaten werden jedes Mal in Ihrem Browser gespeichert, wenn Sie eine Änderung vornehmen, sodass Sie sich keine Sorgen machen müssen, dass Sie Ihre Arbeit verlieren.
Wenn Sie bereits eine lokale Kopie Ihrer CV -Daten haben, können Sie auf die Schaltfläche "Daten hochladen" klicken, um sie in den Editor zu laden.
Sobald Sie bearbeitet haben, können Sie auf die Schaltfläche JSON herunterladen , um Ihre CV -Daten im JSON -Format zu exportieren.
Wenn Sie das gerenderte HTML im Vorschaufel -Bereich exportieren möchten, klicken Sie einfach auf die Schaltfläche HTML herunterladen .
Bitte beachten Sie, dass Sie die exportierten Dateien benennen können, indem Sie die Eigenschaft meta.name hinzufügen. Wenn es nicht angegeben ist, wird der Dateiname unter Verwendung einer Kombination aus basics.name und meta.version konstruiert.
Um die Dinge einfach zu halten, beinhaltet JSONCV keine externen Tools, um PDFs zu generieren. Stattdessen sollten Sie die generierte HTML -Datei verwenden, um sie in ein PDF -Dokument umzuwandeln. Die einzige Anforderung ist ein moderner Browser; Die folgenden Schritte verwenden Google Chrome als Beispiel:
Öffnen Sie die generierte HTML -Datei in Chrome.
Drücken Sie ⌘ P (oder ⌃ P in Windows), und das Dialogfeld Drucken wird geöffnet.
Wählen Sie im Dialogfeld "Ziel" als "Speichern als PDF" aus und stellen Sie sicher, dass alle Elemente in "Optionen" deaktiviert sind.

Klicken Sie auf "Speichern", um die PDF -Datei in Ihrem Dateisystem zu speichern.
Bitte beachten Sie, dass die aus Chrome exportierte PDF möglicherweise einige Probleme beim Kopieren von Text aufweist. Weitere Informationen finden Sie im FAQ -Abschnitt.
JSONCV verwendet Vite als statisches Gebäudewerkzeug. Die index.html Datei im Stammerwesen des Projekts ist der Einstiegspunkt für den Aufbau eines Einzelfilm-CV-HTML.
Hier sind die Schritte zum Erstellen eines CV -HTML mit eigenen Daten:
Stellen Sie sicher, dass Sie NodeJS Version 18 oder höher verwenden.
Installieren Sie die Abhängigkeiten durch Ausführen: npm run install
Erstellen Sie Ihren Lebenslauf -HTML, indem Sie die Umgebungsvariablen DATA_FILENAME und OUT_DIR angeben:
DATA_FILENAME="$HOME/Downloads/mycv/cv.json" OUT_DIR="$HOME/Downloads/mycv" npm run build
Dadurch wird Ihr CV -HTML mit der Datendatei unter $HOME/Downloads/mycv/cv.json erstellt. Das generierte HTML befindet sich im Verzeichnis $HOME/Downloads/mycv .
Die folgenden Umgebungsvariablen werden im Build -Prozess unterstützt:
DATA_FILENAME : Die zu verwendenden Lebenslaufdaten können ein relativer oder absoluter Pfad sein.OUT_DIR : Das Ausgabesverzeichnis für die generierte HTML -Datei.THEME : Das zu verwendende Thema muss eines der Verzeichnisnamen in src/themes/ sein.Um die primäre Farbe des Themas anzupassen, ändern Sie die CSS-Variable-Primary-Color CSS in INDEX.SCSS. Beachten Sie, dass vorgenommen wird, dass diese Änderung zu unstimmigen Änderungen des Git führt. Wenn Sie das HTML selbst erstellen möchten, wird empfohlen, ein neues Projekt zu erstellen, anstatt den Quellcode in JSONCV zu bearbeiten. Anweisungen dazu finden Sie im Abschnitt "Erstellung eines statischen Lebenslauforts".
Die generierte index.html -Datei kann überall und auf jeder Hosting -Plattform verwendet werden. Laden Sie es einfach auf einen Webserver hoch, und Sie haben Ihre eigene Online -CV -Website. Das integrierte Thema "Reorx" enthält auch reaktionsschnelle Unterstützung für mobile Geräte.
Wenn Sie jedoch zusätzliche Anpassungen wünschen, wie die CV -Site unter https://cv.reorx.com/, die eine Fußzeile mit Links zur PDF -Datei und zur Startseite des Autors hat, können Sie folgende Schritte befolgen:
Erstellen Sie ein leeres Repository
Fügen Sie JSONCV als Submodule hinzu
git submodule add https://github.com/reorx/jsoncv.git
Fügen Sie Ihre CV -Datendatei, z. B. cv.json , in das Projekt ein.
Initialisieren Sie package.json , indem Sie npm init ausführen.
Installieren Sie JSONCV als Abhängigkeit, indem Sie npm i ./jsoncv ausführen.
Kopieren Sie die scripts und devDependencies von ./jsoncv/package.json an package.json und führen Sie dann npm i aus, um sie zu installieren.
Kopieren ./jsoncv/vite.json.js an vite.json.js und vornehmen Sie die folgenden Änderungen:
./src auf ./jsoncv/src .dataFilename in Ihre CV -Datendatei, z. B. cv.json .renderData.theme in das Thema, das Sie verwenden möchten. Kopieren ./jsoncv/index.html zu index.html und ändern Sie alle Instanzen von ./src auf ./jsoncv/src . Dann kopieren Sie ./jsoncv/index.scss zu index.scss .
Führen Sie npm run build , um zu testen, ob alles funktioniert.
Nachdem Sie diese Schritte ausgeschlossen haben, können Sie jetzt Ihre eigenen Elemente und Stile zu index.html und index.scss hinzufügen, um Ihre CV -Website weiter anzupassen. Sie können HTML, CSS und JavaScript verwenden, um der Website Ihr eigenes Branding, Layout und Funktionen hinzuzufügen.
JSONCV enthält mehrere integrierte Themen, die Sie entweder direkt im Editor oder beim Erstellen der statischen Lebenslaufstelle verwenden können. Wenn Sie Ihr eigenes benutzerdefiniertes Thema erstellen möchten, wie folgt:
Die Dateisystemhierarchie für Themen lautet wie folgt:
src/themes
└── reorx
├── index.ejs
└── index.scss
Sie können Ihr eigenes Thema hinzufügen, indem Sie einen neuen Ordner unter src/themes mit index.ejs und index.scss -Dateien erstellen.
index.ejs ist eine EJS -Vorlage, die zum Erstellen des CV -Inhalts verwendet wird. Die Daten, die an die Vorlage übergeben werden, sind wie folgt strukturiert:
cv : Die gesamten JSONCV -Daten, die dem JSONCV -Schema entsprechenfn : Eine Reihe von DienstprogrammfunktionengetCVTitle : Holt den Lebenslauf -Titel aus cv -DatenreformatDate : Verwandelt eine Datumszeichenfolge in ein bestimmtes FormatgetIconSVG : Ruft das Symbol SVG -String oder DOM -Element aus dem Symbolnamen abnoSchemaURL : Entfernen Sie das Schema ( https:// ) Präfix der URLWeitere Informationen finden Sie in der vollständigen Definition in SRC/Themen/Data.js.
Sobald Sie ein neues Thema erstellt haben (nutzen wir yourtheme als Beispiel), können Sie es mit der Entwicklung und Vorschau beginnen, indem Sie den folgenden Code ausführen:
THEME=yourtheme npm run dev-site
Anfragen zum Hinzufügen neuer Themen sind immer begrüßt.
Sie können das Thema einfach nach Ihrem eigenen Namen benennen, das habe ich für das Thema "Reorx" getan. Weil ich denke, dass das Thema eng an den ästhetischen und persönlichen Geschmack des Entwicklers gebunden ist und gemeinsame Wörter das Thema möglicherweise nicht genau darstellen.
Ja, dies ist ein bekanntes Problem mit Chromes "Save As PDF" -Funktion. Die resultierenden PDFs können einen Text haben, der bei der kopierenden in macOS kopiert wird.

Dieses Problem wurde von mehreren Benutzern gemeldet und ist nicht spezifisch für JSONCV. Wie zu sehen: "Save As PDF" erzeugt Dokumente mit rückwärts gerichteter Text. - Google Chrome Community
Lösung: Verwenden Sie Firefox oder Safari, um die PDF zu erhalten
Siehe JavaScript garantiert die Objekt -Eigenschaftseigenschaftsreihenfolge? - Stapelüberlauf
summary und description Eigenschaften JSONCV konnte ohne diese fantastischen Projekte unten nicht ermöglicht werden:
Wenn Sie der Meinung sind, dass dieses Projekt angenehm zu verwenden ist oder einige Zeit spart, sollten Sie mir eine Tasse Kaffee geben :)