-
-
diff --git a/light/cv.html b/light/cv.html
new file mode 100644
index 0000000..7f4636d
--- /dev/null
+++ b/light/cv.html
@@ -0,0 +1,469 @@
+
+
+
+
+
Thomas Josso - CV
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
A propos
+
+ Créatif ,
+ autonome et
+ passionné , je conçois et
+ développe des solutions numériques avec une expertise à la
+ fois front-end et back-end. Je m'épanouis dans un
+ environnement de travail collaboratif où je peux partager mes
+ idées, collaborer avec mes pairs et donner vie à des projets
+ tout en assurant une
+ expérience utilisateur optimale .
+
+
+
+
+
Aptitudes
+
+
+
+
+
6+ années
+
+
+
+
+
+
5.5+ années
+
+
+
+
+
+
3.5+ années
+
+
+
+
+
+
2.5+ années
+
+
+
+
+
+
2+ années
+
+
+
+
+
Langues
+
+
+
+
Maternel
+
+
+
+
+
C2 (2024)
+
+
+
+
+
+
Compétence pro.
+
Professionnel
+
+
+
+
+
+
C1 (2024)
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
Expériences
+
+
+
+
+
+
+
+
+
+
Fondateur
+
Q4 2024
+
NC
+
+
+
+
+
+
+ Conception et développement en solo d'une application
+ de suivi sportif avec IA, pour web et iOS.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Ingénieur produit
+
+
+
+
+
+
+
Lead ingénieur logiciel
+
+
+
+
+
+
+
+ Développement et maintenance des logiciels front et
+ back-end. Membre de l'équipe de mise en production et
+ de suivi d'incident. Conception et gestion du produit
+ en 2023.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Conception, développement et déploiement d'un client
+ mobile multiplateforme.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Développement et maintenance du client de pari
+ sportif, gérant une forte charge quotidienne
+ d'utilisateurs.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
Formation
+
+
+
+
+
+
+
+
+
+
Diplôme d'ingénieur
+
+
spé. web
+
+
+
+
+
+
+ Nombreux projets réalisés dans divers langages de
+ programmation, avec un accent sur l'algorithmie.
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/light/cv.pdf b/light/cv.pdf
new file mode 100644
index 0000000..187826a
Binary files /dev/null and b/light/cv.pdf differ
diff --git a/light/resume.html b/light/resume.html
new file mode 100644
index 0000000..8e64e0f
--- /dev/null
+++ b/light/resume.html
@@ -0,0 +1,458 @@
+
+
+
+
+
Thomas Josso - Resume
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
About me
+
+ Creative ,
+ autonomous and
+ passionate , I design and develop
+ comprehensive digital solutions with expertise in both
+ front-end and back-end. I thrive in collaborative work
+ environment where I can share my ideas, collaborate with my
+ peers and bring projects to life while ensuring an
+ optimal user experience .
+
+
+
+
+
Skills
+
+
+
+
+
+
+
5.5+ years
+
+
+
+
+
+
3.5+ years
+
+
+
+
+
+
2.5+ years
+
+
+
+
+
+
2+ years
+
+
+
+
+
Languages
+
+
+
+
+
C2 (2024)
+
+
+
+
+
Full professionnal
+
+
+
+
+
C1 (2024)
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
Experience
+
+
+
+
+
+
+
+
+
+
Founder
+
Q4 2024
+
TBA
+
+
+
+
+
+
+ Solo design and development of an AI fitness tracker
+ app for both web and iOS.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Product Engineer
+
+
+
+
+
+
+
Lead Software Engineer
+
+
+
+
+
+
+
+ Development and maintenance of the front and back-end
+ softwares. Part of the release and monitoring team.
+ Product design and management as of 2023.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Design, development and continuous delivery of a
+ multi-platform mobile client.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Development and maintenance of the betting client,
+ handling heavy daily user load.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
Education
+
+
+
+
+
+
+
+
+
+
Engineering Degree
+
+
web major
+
+
+
+
+
+
+ Large number of projects implemented in many
+ programming languages, heavy emphasis on algorithms
+ and design patterns. 1.5 years of TA.
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/light/resume.pdf b/light/resume.pdf
new file mode 100644
index 0000000..607a20a
Binary files /dev/null and b/light/resume.pdf differ
diff --git a/light/style.css b/light/style.css
new file mode 100644
index 0000000..f030f88
--- /dev/null
+++ b/light/style.css
@@ -0,0 +1,538 @@
+/* VARIABLES */
+@page {
+ size: A4 portrait;
+}
+
+.sneaky-🥷 * {
+ background: var(--background) !important;
+ color: var(--background) !important;
+}
+
+:root {
+ --color: #000000;
+ --background: #f7faff;
+ --alt-color: #a9b7c6;
+ --alt-background: #282c34;
+ --tint: #f78c6c;
+ --complementary-color: #ffffff;
+ --complementary-tint: #34b198;
+
+ --github-color: #6e5494;
+ --linkedin-color: #0077b5;
+ --twitter-color: #1da1f2;
+ --twitter-x-color: #000000;
+
+ --doc-width: 210mm;
+ --doc-height: 297mm;
+ --side-size: 270px;
+ --head-size: 250px;
+}
+
+/* ELEMENTS */
+body {
+ margin: 0;
+ padding: 0;
+ font-family: "Raleway", sans-serif;
+ background-color: var(--background);
+}
+
+h1 {
+ font-weight: 500;
+ text-transform: uppercase;
+ letter-spacing: 2px;
+ margin: 0;
+}
+
+p {
+ font-weight: 300;
+ font-size: 12px;
+ letter-spacing: 1px;
+ color: var(--color);
+}
+
+hr {
+ height: 5px;
+ width: 60%;
+ border: none;
+ background-color: var(--tint);
+}
+
+.hr-row {
+ height: 25px;
+}
+
+a:-webkit-any-link {
+ color: inherit;
+ text-decoration: none;
+}
+
+.mobile {
+ display: none !important;
+}
+
+.uppercase {
+ text-transform: uppercase;
+}
+
+.capitalize {
+ text-transform: capitalize;
+}
+
+/* FONT AWESOME */
+.fa-circle {
+ color: var(--alt-color);
+ font-size: 14px !important;
+}
+
+.tint {
+ color: var(--tint);
+}
+
+.complementary-tint {
+ color: var(--complementary-tint);
+}
+
+.github-color {
+ color: var(--github-color);
+}
+
+.linkedin-color {
+ color: var(--linkedin-color);
+}
+
+.twitter-color {
+ color: var(--twitter-color);
+}
+
+.x-color {
+ color: var(--twitter-x-color);
+}
+
+/* GENERAL */
+.row {
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+}
+
+.flex-end {
+ justify-content: flex-end;
+}
+
+.column {
+ display: flex;
+ flex-direction: column;
+}
+
+.center {
+ align-items: center;
+}
+
+.justify-space-between {
+ justify-content: space-between;
+}
+
+.no-break > div {
+ display: flex;
+ flex-direction: row;
+ column-gap: 6px;
+ flex-wrap: nowrap;
+ white-space: nowrap;
+}
+
+.align-start {
+ align-items: flex-start;
+}
+
+.icon {
+ min-width: 22px;
+}
+
+.button {
+ display: flex;
+ justify-content: center;
+ width: 125px;
+ padding: 10px 5px;
+ color: var(--color);
+ background: var(--tint);
+ border-radius: 5px;
+}
+
+/* LAYOUT */
+.resume-container {
+ padding: 0;
+ overflow: hidden;
+}
+
+.resume {
+ display: flex;
+ flex: 1;
+ flex-direction: row;
+ align-items: flex-start;
+}
+
+.side-container,
+.page-container {
+ position: relative;
+ display: flex;
+ flex: 1;
+ height: 100%;
+ flex-direction: column;
+ overflow: hidden;
+}
+
+.side-container {
+ flex: 1;
+ min-width: var(--side-size);
+ height: var(--doc-height);
+ background-color: var(--alt-background);
+}
+
+.page-container {
+ flex: 10;
+ height: var(--doc-height);
+ background-color: var(--background);
+}
+
+.index-page {
+ height: auto;
+}
+
+.side,
+.page {
+ display: flex;
+ flex: 1;
+ flex-direction: column;
+}
+
+.head {
+ height: var(--head-size);
+}
+
+.profile,
+.details {
+ display: flex;
+ flex: 1;
+ flex-direction: column;
+ justify-content: space-between;
+ padding: 10px 10px 15px 10px;
+}
+
+#homepage {
+ padding: 40px 10px 15px 10px;
+}
+
+.page hr {
+ margin: 0;
+}
+
+.column {
+ padding: 10px 5px;
+ margin: 5px;
+}
+
+/* INDEX */
+.file-entry {
+ gap: 50px;
+}
+
+/* SIDE */
+.side {
+ color: var(--alt-color);
+}
+
+.side h1 {
+ color: var(--complementary-color);
+}
+
+.mugshot-container {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ height: 100%;
+ overflow: hidden;
+ border-radius: 0 0 var(--head-size) var(--head-size);
+ background-color: var(--tint);
+ border: var(--tint) 1px solid;
+}
+
+.anonymous {
+ background: var(--tint);
+ border-radius: initial;
+ box-sizing: border-box;
+ clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 50% 50%, 0% 100%);
+}
+
+.mugshot {
+ height: var(--head-size);
+ width: var(--head-size);
+ background-image: url("./public/me.png");
+ background-size: 100% 100%, cover;
+ background-repeat: no-repeat;
+}
+
+.anonymous .mugshot {
+ display: none;
+ width: 0;
+ height: 0;
+ background-image: none;
+}
+
+.name {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+}
+
+.name h1 {
+ font-size: 40px;
+ font-weight: normal;
+ font-family: arial;
+ letter-spacing: 10px;
+}
+
+.name div {
+ font-size: 32px;
+ text-transform: uppercase;
+ color: var(--color);
+}
+
+.name hr {
+ margin-top: 25px;
+}
+
+.firstname {
+ font-family: "Raleway" !important;
+ padding: 0;
+}
+
+.lastname {
+ margin: 5px;
+}
+
+.job {
+ display: flex;
+ flex-direction: row;
+ justify-content: center;
+ align-items: center;
+ column-gap: 15px;
+ width: 100%;
+ margin: 0;
+}
+
+.job::before,
+.job::after {
+ content: " - ";
+}
+
+.job .row {
+ flex-wrap: wrap;
+ justify-content: center;
+ align-items: center;
+ column-gap: 10px;
+}
+
+.socials {
+ padding: 0 6px;
+}
+
+.socials div {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-size: 28px;
+ width: 48px;
+}
+
+/* DETAILS */
+.section {
+ padding-left: 0;
+}
+
+.section p {
+ line-height: 18px;
+ margin: 0;
+ padding: 10px 0;
+}
+
+.section .column {
+ padding-bottom: 0;
+ margin-bottom: 0;
+}
+
+.section .column .entry:not(:last-child) {
+ padding-bottom: 25px;
+}
+
+.section .column .entry:not(:last-child) .bullet::after {
+ position: absolute;
+ left: 16.5px;
+ width: 2px;
+ height: 100%;
+ content: "";
+ background-color: var(--tint);
+}
+
+#contact {
+ gap: 6px;
+}
+
+#contact a:-webkit-any-link {
+ height: 25px;
+ line-height: 25px;
+}
+
+.entry {
+ position: relative;
+}
+
+.entry .bullet {
+ margin-top: 7px;
+ padding-right: 0;
+}
+
+.entry .description {
+ flex: 1;
+}
+
+.tag {
+ padding: 0 3px;
+ background-color: var(--tint);
+ border-radius: 3px;
+}
+
+.complementary {
+ background-color: var(--complementary-tint);
+}
+
+.row .technology-list {
+ gap: 4px;
+ flex-wrap: wrap;
+}
+
+.technology {
+ display: flex;
+ align-items: center;
+ flex-wrap: nowrap;
+ column-gap: 2px;
+ padding: 2px 4px;
+ font-size: 12px;
+ border: var(--alt-color) 1px solid;
+ border-radius: 3px;
+}
+
+/* SHOWCASE */
+@media screen and (min-width: 801px) {
+ body {
+ display: flex;
+ flex: 1;
+ width: 100vw;
+ justify-content: center;
+ align-items: center;
+ }
+}
+
+@media screen and (min-height: 1101px) {
+ body {
+ display: flex;
+ flex: 1;
+ height: 100vh;
+ justify-content: center;
+ align-items: center;
+ }
+}
+
+@media only screen and (max-width: 800px) {
+ .document-html {
+ background-color: var(--background);
+ background: rgb(247, 250, 255);
+ background: -moz-linear-gradient(
+ 180deg,
+ rgba(247, 250, 255, 1) 50%,
+ rgba(38, 37, 45, 1) 50%
+ );
+ background: -webkit-linear-gradient(
+ 180deg,
+ rgba(247, 250, 255, 1) 50%,
+ rgba(38, 37, 45, 1) 50%
+ );
+ background: linear-gradient(
+ 180deg,
+ rgba(247, 250, 255, 1) 50%,
+ rgba(38, 37, 45, 1) 50%
+ );
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f7faff",endColorstr="#26252d",GradientType=1);
+ }
+
+ body {
+ width: auto;
+ height: auto;
+ }
+
+ .resume {
+ flex-direction: column-reverse;
+ }
+
+ .page-container {
+ width: 100%;
+ }
+
+ .side-container,
+ .page-container {
+ height: auto;
+ }
+
+ .side,
+ .page {
+ height: auto;
+ }
+
+ .side .head {
+ display: none;
+ }
+
+ .profile,
+ .details {
+ padding: 15px 0 10px 0;
+ }
+
+ .profile {
+ flex-direction: row;
+ column-count: 2;
+ flex-wrap: wrap;
+ }
+
+ .profile .column {
+ flex: 1;
+ }
+
+ #aboutme {
+ min-width: 175px;
+ }
+
+ .job .row {
+ flex: 0;
+ }
+
+ .section {
+ padding-left: 0;
+ }
+
+ .section .column {
+ padding-top: 0;
+ margin: 0;
+ }
+
+ .entry .description {
+ padding: 10px 0;
+ }
+
+ .desktop {
+ display: none !important;
+ }
+
+ .mobile {
+ display: inherit !important;
+ }
+}
diff --git a/resume.html b/resume.html
index 8e64e0f..6104d17 100644
--- a/resume.html
+++ b/resume.html
@@ -41,18 +41,15 @@
-
-
-
-
-
+
+
+
-
-
-
-
-
About me
-
- Creative ,
- autonomous and
- passionate , I design and develop
- comprehensive digital solutions with expertise in both
- front-end and back-end. I thrive in collaborative work
- environment where I can share my ideas, collaborate with my
- peers and bring projects to life while ensuring an
- optimal user experience .
-
-
-
-
-
Skills
-
-
-
-
-
-
-
5.5+ years
-
-
-
-
-
-
3.5+ years
-
-
-
-
-
-
2.5+ years
-
-
-
-
-
-
2+ years
-
-
+
+
+
Summary
-
-
Languages
-
-
-
-
-
C2 (2024)
-
-
-
-
-
Full professionnal
-
-
-
-
- IELTS GT
+
+
+
+
+
+ Autonomous and creative, with technical expertise and
+ product experience. Proficient with managing complex
+ end-to-end projects, I combine an innovative mindset
+ and a strong sense of teamwork to bring projects to
+ life that I take pride in. I have a particular
+ appreciation for well-crafted interfaces providing a
+ smooth user experience.
+
+
+
-
C1 (2024)
-
-
-
-
-
-
-
-
-
-
-
-
Experience
+
+
Experience
-
-
-
+
-
- Solo design and development of an AI fitness tracker
- app for both web and iOS.
-
-
+
+
+ Designed and developed responsive isomorphic mobile
+ and web applications.
+
+
+ Architected and developed a scalable GraphQL API
+ with MongoDB.
+
+ Implemented multi-platfrom CI/CD pipelines.
+
+ Collaborated with cross-functional stakeholders,
+ including a fitness coach.
+
+
+ Created a business plan and conducted market
+ analysis.
+
+
+ Defined and drove both short and long-term
+ commercialization strategies.
+
+
+ Collected user feedback on pricing, refining the
+ product-market fit.
+
+
+
+
-
-
-
+
Product Engineer
+ >Product Engineer
(2023)
@@ -263,9 +201,7 @@
Experience
-
Lead Software Engineer
+
Lead Software Engineer
-
- Development and maintenance of the front and back-end
- softwares. Part of the release and monitoring team.
- Product design and management as of 2023.
-
-
+
+ Designed and delivered end-to-end features.
+
+ Developed and maintained automated tests (unit,
+ integration, and regression).
+
+
+ Collaborated with product and commercial teams to
+ define technical specification.
+
+
+ Led feature development from design to deployment.
+
+ Proactively handled incidents and migrations.
+
+ Managed version deployments, monitoring and
+ post-release stability.
+
+ Contributed to development best practices.
+ Actively participated in code reviews.
+
+
+
-
-
-
+
-
Software Engineer
+
Software Engineer
-
- Design, development and continuous delivery of a
- multi-platform mobile client.
-
-
+
+ Chose the client-side tech stack.
+
+ Independently created a cohesive graphic identity to
+ strengthen brand consistency.
+
+
+ Delivered the app with a focus on supporting €5M
+ fundraising goals.
+
+
+ Designed a lightweight web application for a live
+ demo with a major retailer.
+
+
+ Implemented a continuous deployment process for iOS
+ and Android.
+
+
+ Developed mobile-focused tests and recruitment
+ interviews.
+
+
+
+
-
-
-
+
-
Software Engineer
+
Software Engineer
-
- Development and maintenance of the betting client,
- handling heavy daily user load.
-
-
+
+
+ Developed the first bet combinator in the French
+ market.
+
+
+ Implemented the graphical redesign of odds to
+ support expansion into the Spanish market.
+
+
+ Collaborated with UI/UX teams to evolve and refine
+ designs.
+
+
+ Supervised three interns over a semester, providing
+ guidance and mentorship.
+
+
+
+
-
-
Education
+
+
Education
-
-
-
+
-
Engineering Degree
+
Engineering Degree
+
+
+
+
+
-
- Large number of projects implemented in many
- programming languages, heavy emphasis on algorithms
- and design patterns. 1.5 years of TA.
-
+
+
+
Skills
+
+
+
+
+
+
+
+
+
+
+
5.5+ years
+
+
+
+
+
+
3.5+ years
+
+
+
+
+
+
2.5+ years
+
+
+
+
+
+
2+ years
+
+
+
+
+
+
+
+
+
Languages
+
+
+
+
+
+
+
+
+
+
C2 (2024)
+
+
+
+
+
+ Full professionnal
+
+
+
+
+
+
C1 (2024)
+
+
diff --git a/style.css b/style.css
index f030f88..559f6bc 100644
--- a/style.css
+++ b/style.css
@@ -34,6 +34,7 @@ body {
padding: 0;
font-family: "Raleway", sans-serif;
background-color: var(--background);
+ font-size: 9.5pt;
}
h1 {
@@ -41,12 +42,33 @@ h1 {
text-transform: uppercase;
letter-spacing: 2px;
margin: 0;
+ font-size: 16px;
+ font-weight: bold;
+}
+
+h2 {
+ font-weight: 500;
+ text-transform: uppercase;
+ letter-spacing: 2px;
+ padding-left: 3px;
+ margin: 0;
+ font-size: 14px;
+ font-weight: bold;
+ background: var(--tint);
+}
+
+ul {
+ margin-block-start: 10px;
+ padding-inline-start: 20px;
+}
+
+li::marker {
+ color: var(--tint);
}
p {
font-weight: 300;
- font-size: 12px;
- letter-spacing: 1px;
+ /* letter-spacing: 1px; */
color: var(--color);
}
@@ -145,7 +167,7 @@ a:-webkit-any-link {
}
.icon {
- min-width: 22px;
+ min-width: 15px;
}
.button {
@@ -205,6 +227,10 @@ a:-webkit-any-link {
flex-direction: column;
}
+.page {
+ padding: 1.4cm;
+}
+
.head {
height: var(--head-size);
}
@@ -214,8 +240,10 @@ a:-webkit-any-link {
display: flex;
flex: 1;
flex-direction: column;
- justify-content: space-between;
+ /* justify-content: space-between; */
padding: 10px 10px 15px 10px;
+ /* padding: 15px 0 10px 0; */
+ gap: 15px;
}
#homepage {
@@ -280,13 +308,13 @@ a:-webkit-any-link {
.name {
display: flex;
- flex-direction: column;
+ /* flex-direction: column; */
align-items: center;
justify-content: center;
}
.name h1 {
- font-size: 40px;
+ font-size: 20px;
font-weight: normal;
font-family: arial;
letter-spacing: 10px;
@@ -334,15 +362,10 @@ a:-webkit-any-link {
}
.socials {
- padding: 0 6px;
-}
-
-.socials div {
display: flex;
align-items: center;
justify-content: center;
- font-size: 28px;
- width: 48px;
+ gap: 10px;
}
/* DETAILS */
@@ -351,19 +374,19 @@ a:-webkit-any-link {
}
.section p {
- line-height: 18px;
+ /* line-height: 18px; */
margin: 0;
- padding: 10px 0;
+ /* padding: 10px 0; */
}
.section .column {
- padding-bottom: 0;
- margin-bottom: 0;
+ padding: 0 0 5px 0;
+ margin: 5px 0;
}
-.section .column .entry:not(:last-child) {
+/* .section .column .entry:not(:last-child) {
padding-bottom: 25px;
-}
+} */
.section .column .entry:not(:last-child) .bullet::after {
position: absolute;
@@ -492,11 +515,6 @@ a:-webkit-any-link {
display: none;
}
- .profile,
- .details {
- padding: 15px 0 10px 0;
- }
-
.profile {
flex-direction: row;
column-count: 2;
@@ -519,15 +537,6 @@ a:-webkit-any-link {
padding-left: 0;
}
- .section .column {
- padding-top: 0;
- margin: 0;
- }
-
- .entry .description {
- padding: 10px 0;
- }
-
.desktop {
display: none !important;
}