From 47af546637f0423a629df41baa0b02ff29686299 Mon Sep 17 00:00:00 2001 From: Guus van Meerveld Date: Sun, 10 Mar 2024 23:30:32 +0100 Subject: [PATCH] improved mobile view of cv + added experience section --- data/cv.json | 11 +++++-- src/app/cv/Cv.tsx | 79 +++++++++++++++++++++++++++++++++++++---------- src/models/cv.ts | 2 ++ src/utils/cv.ts | 1 - 4 files changed, 73 insertions(+), 20 deletions(-) diff --git a/data/cv.json b/data/cv.json index 7fbefdb..f9291ec 100644 --- a/data/cv.json +++ b/data/cv.json @@ -45,12 +45,19 @@ "skills": ["Mathematics", "Neuroscience", "Computer science"] }, { - "title": "VWO (NT&G)", + "title": "Highschool VWO (NT&G)", "timeFrame": "2016 - 2022", "institution": "RSG Pantarijn MHV Wageningen", "location": "Wageningen, Netherlands", "skills": ["Biology", "Physics", "Mathematics"] } ], - "experience": [] + "experience": [ + { + "title": "Albert Heijn", + "timeFrame": "2020 - 2023", + "role": "Store employee", + "description": "" + } + ] } diff --git a/src/app/cv/Cv.tsx b/src/app/cv/Cv.tsx index 4e03ff7..b2b4cc1 100644 --- a/src/app/cv/Cv.tsx +++ b/src/app/cv/Cv.tsx @@ -14,6 +14,7 @@ import { Fragment } from "react"; import CvProps, { Education as EducationProps, + Experience as ExperienceProps, Skill as SkillProps } from "@models/cv"; @@ -69,22 +70,49 @@ const Education: Component<{ education: EducationProps }> = ({ education }) => { ); }; +const Experience: Component<{ experience: ExperienceProps }> = ({ + experience +}) => { + return ( + + +
+
+

+ {experience.role} at{" "} + {experience.title} +

+

+ {experience.timeFrame} +

+
+
+ + +
+
+ ); +}; + export const Cv: Component<{ data: CvProps }> = ({ data }) => { return ( -
-
- {`Professional +
+
+
+ {`Professional +
-
-
+
+

{data.fullName}

{data.role}

@@ -103,22 +131,39 @@ export const Cv: Component<{ data: CvProps }> = ({ data }) => {

Skills

- {data.skills.map((skill) => ( - - ))} + {data.skills + .sort((a, b) => b.value - a.value) + .map((skill) => ( + + ))}

Programming Languages

- {data.programmingLanguages.map((skill) => ( - - ))} + {data.programmingLanguages + .sort((a, b) => b.value - a.value) + .map((skill) => ( + + ))}
+

Experience

+ + {data.experience.map((experience) => { + return ( + + + + + ); + })} + + +

Education

{data.education.map((education) => { diff --git a/src/models/cv.ts b/src/models/cv.ts index a7d05a3..db86b0e 100644 --- a/src/models/cv.ts +++ b/src/models/cv.ts @@ -25,6 +25,8 @@ const ExperienceModel = z.object({ description: z.string() }); +export type Experience = z.infer; + export const CvPropsModel = z.object({ fullName: z.string(), role: z.string(), diff --git a/src/utils/cv.ts b/src/utils/cv.ts index 266bc5a..58de519 100644 --- a/src/utils/cv.ts +++ b/src/utils/cv.ts @@ -1,4 +1,3 @@ -import { readJson } from "fs-extra"; import path from "path"; import { readAndParseJsonFile } from "./json";