Skip to content

Commit b0fa25e

Browse files
author
Paulo Henrique Cuchi
committed
feat: finish carreer timeline 🎉
1 parent 14da35c commit b0fa25e

File tree

5 files changed

+176
-9
lines changed

5 files changed

+176
-9
lines changed

api/career.js

Lines changed: 14 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -51,7 +51,7 @@ export default async function(req, res) {
5151
},
5252
{
5353
id: "48a2723a-2c67-4794-8503-15de57349f41",
54-
title: "R&D Software Developer",
54+
title: "Software Developer (R&D)",
5555
where: "NG Informática",
5656
type: "Full-time job",
5757
activities: [
@@ -72,7 +72,19 @@ export default async function(req, res) {
7272
where: "Magrathea Labs",
7373
title: "Software Developer",
7474
type: "Full-time job",
75-
activities: [],
75+
activities: [
76+
`Worked on a data intensive web application that collects and displays
77+
reports for animal production corporations. The main technologies used
78+
were Python, Django, PostgreSQL, Redis, ElasticSearch and Angular.`,
79+
`Worked as a tech lead of a forked subset of the project above. This
80+
new project had international stakeholders who shared regular
81+
follow-ups with our development team.`,
82+
`Provided technical mentorship to employees on the projects we had in
83+
common.`,
84+
`Worked on a internal project of the company that employees used to
85+
make appointments to managed by the HR. The stack of this project was
86+
Node.Js, TypeScript, React and PostgreSQL.`
87+
],
7688
logoUrl: "/career-logos/magrathea.jpeg",
7789
period: { begin: "2020-03-10" },
7890
},

components/Timeline.stories.js

Lines changed: 114 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,114 @@
1+
import { format } from 'date-fns'
2+
import TimelineComponent from "./Timeline";
3+
4+
export default {
5+
title: "Timeline",
6+
component: TimelineComponent,
7+
argTypes: {
8+
currentDate: {
9+
defaultValue: format(new Date(), "yyyy-MM-dd"),
10+
},
11+
events: {
12+
defaultValue: [
13+
{
14+
id: "02107002-33e1-4187-a71d-b74a6179882f",
15+
level: 1,
16+
where: "UDESC",
17+
title: "Computer Science (incomplete)",
18+
type: "Bachelor Degree",
19+
logoUrl: "/career-logos/udesc.png",
20+
period: { begin: "2012-02", end: "2015-12-30" },
21+
},
22+
{
23+
id: "e30c66c1-d594-48fb-a6fa-d9e6219e1b8d",
24+
level: 1,
25+
where: "UDESC",
26+
title: "Systems Analysis",
27+
type: "Technology Degree",
28+
logoUrl: "/career-logos/udesc.png",
29+
period: { begin: "2016-01-10", end: "2018" },
30+
},
31+
{
32+
id: "ffa66fc8-3164-4a7c-83a0-afedf6b832d6",
33+
level: 1,
34+
where: "SENAI",
35+
title: "Web Development",
36+
type: "Technical Degree",
37+
logoUrl: "/career-logos/senai.png",
38+
period: { begin: "2010-02", end: "2011-12" },
39+
},
40+
{
41+
id: "104298ca-c805-45ff-a13d-4d1063f24f2d",
42+
where: "UDESC",
43+
title: "Technical Support",
44+
type: "Scholarship job",
45+
logoUrl: "/career-logos/udesc.png",
46+
period: { begin: "2012-07", end: "2013-07" },
47+
},
48+
{
49+
id: "680a1bd1-19ea-466e-9e69-8499269f9a35",
50+
title: "Software Developer",
51+
where: "ContaAzul",
52+
type: "Full-time job",
53+
activities: [
54+
`Worked on a web service for accounting routines & integration using
55+
Java EE 7, Hibernate, JBoss & PostgreSQL.`,
56+
],
57+
logoUrl: "/career-logos/contaazul.jpeg",
58+
period: { begin: "2015-10", end: "2016-03-15" },
59+
},
60+
{
61+
id: "48a2723a-2c67-4794-8503-15de57349f41",
62+
title: "R&D Software Developer",
63+
where: "NG Informática",
64+
type: "Full-time job",
65+
activities: [
66+
`Worked on the development of a Android application for asset
67+
maintenance execution & management.`,
68+
`Worked on an experimental web application for notifications & alerts
69+
written in Node.Js & MongoDB.`,
70+
`Worked as a back-end tech lead for a SaaS web application using
71+
Node.Js, TypeScript, GraphQL & PostgreSQL.`,
72+
`Worked on the research of new tools and methods to improve the DevOps
73+
cycle of the organization SaaS products.`,
74+
],
75+
logoUrl: "/career-logos/ng-informatica.jpeg",
76+
period: { begin: "2016-05-06", end: "2020-03" },
77+
},
78+
{
79+
id: "3b06277a-edf2-4c4a-979d-359480c15f9b",
80+
where: "Magrathea Labs",
81+
title: "Software Developer",
82+
type: "Full-time job",
83+
activities: [],
84+
logoUrl: "/career-logos/magrathea.jpeg",
85+
period: { begin: "2020-03-10" },
86+
},
87+
{
88+
id: "a3d62c73-8fb7-41f2-9fa4-51e481ac2bf5",
89+
level: 2,
90+
title: "Programming Contest Staff",
91+
where: "UDESC",
92+
type: "Volunteership",
93+
logoUrl: "/career-logos/udesc.png",
94+
period: { begin: "2014-02", end: "2015-12" },
95+
},
96+
{
97+
id: "9dcaa7cb-67f3-4533-846a-8d08b4c89e88",
98+
level: 2,
99+
type: "Volunteership",
100+
where: "COLMEIA (UDESC)",
101+
title: "Volunteer",
102+
logoUrl: "/career-logos/udesc.png",
103+
period: { begin: "2012-07", end: "2013-12" },
104+
},
105+
],
106+
},
107+
},
108+
};
109+
110+
export const Timeline = (_, { argTypes }) => ({
111+
components: { TimelineComponent },
112+
props: Object.keys(argTypes),
113+
template: '<TimelineComponent :current-date="currentDate" :events="events" :year-size-in-px="yearSizeInPx" />',
114+
});

components/TimelineTooltip.vue

Lines changed: 43 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,21 +2,54 @@
22
<div v-if="this.contents" id="tooltip">
33
<header>
44
<div class="header-description">
5-
<div><strong>{{ this.contents.where }}</strong></div>
5+
<div>
6+
<strong>{{ this.contents.where }}</strong>
7+
</div>
68
<div>{{ this.contents.title }} - {{ this.contents.type }}</div>
9+
<div class="time-period">
10+
{{ this.getFormattedPeriod() }}
11+
<span class="time-duration">({{ this.getDuration() }})</span>
12+
</div>
713
</div>
814
<img v-if="this.contents.logoUrl" :src="this.contents.logoUrl" />
915
</header>
10-
<hr />
16+
<hr v-if="this.hasActivities()" />
1117
<ul v-for="activity in this.contents.activities" :key="activity">
1218
<li>{{ activity }}</li>
1319
</ul>
1420
</div>
1521
</template>
1622

1723
<script>
24+
import { intervalToDuration, formatDuration } from "date-fns";
25+
1826
export default {
1927
props: ["contents"],
28+
29+
methods: {
30+
hasActivities() {
31+
return this.contents.activities && this.contents.activities.length;
32+
},
33+
34+
formatDate(dateString) {
35+
return dateString.replace(/-/g, "/");
36+
},
37+
38+
getFormattedPeriod() {
39+
const { begin, end } = this.contents.period;
40+
41+
return `${this.formatDate(begin)} - ${this.formatDate(end || "Ongoing")}`;
42+
},
43+
44+
getDuration() {
45+
const { begin, end } = this.contents.period;
46+
const duration = intervalToDuration({
47+
start: new Date(begin),
48+
end: end ? new Date(end) : new Date(),
49+
});
50+
return formatDuration(duration, { format: ['years', 'months'] });
51+
},
52+
},
2053
};
2154
</script>
2255

@@ -46,6 +79,14 @@ header:after {
4679
float: left;
4780
}
4881
82+
.time-period {
83+
font-size: 12px;
84+
}
85+
86+
.time-duration {
87+
opacity: 0.6;
88+
}
89+
4990
#tooltip {
5091
border-left: 5px solid indigo;
5192
background-color: #fff;

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@
1414
"dependencies": {
1515
"axios": "^0.21.0",
1616
"chart.js": "^2.9.4",
17-
"date-fns": "2.9.0",
17+
"date-fns": "2.23.0",
1818
"highlight.js": "^10.1.1",
1919
"markdown-it": "^12.0.2",
2020
"material-icons": "0.3.1",

yarn.lock

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4977,10 +4977,10 @@ dashdash@^1.12.0:
49774977
dependencies:
49784978
assert-plus "^1.0.0"
49794979

4980-
date-fns@2.9.0:
4981-
version "2.9.0"
4982-
resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-2.9.0.tgz#d0b175a5c37ed5f17b97e2272bbc1fa5aec677d2"
4983-
integrity sha512-khbFLu/MlzLjEzy9Gh8oY1hNt/Dvxw3J6Rbc28cVoYWQaC1S3YI4xwkF9ZWcjDLscbZlY9hISMr66RFzZagLsA==
4980+
date-fns@2.23.0:
4981+
version "2.23.0"
4982+
resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-2.23.0.tgz#4e886c941659af0cf7b30fafdd1eaa37e88788a9"
4983+
integrity sha512-5ycpauovVyAk0kXNZz6ZoB9AYMZB4DObse7P3BPWmyEjXNORTI8EJ6X0uaSAq4sCHzM1uajzrkr6HnsLQpxGXA==
49844984

49854985
de-indent@^1.0.2:
49864986
version "1.0.2"

0 commit comments

Comments
 (0)