Skip to content

Commit

Permalink
Add experiences
Browse files Browse the repository at this point in the history
  • Loading branch information
cesalberca committed Aug 12, 2024
1 parent 2c6857b commit 148c812
Show file tree
Hide file tree
Showing 3 changed files with 118 additions and 0 deletions.
39 changes: 39 additions & 0 deletions src/core/i18n/translations/en.json
Original file line number Diff line number Diff line change
Expand Up @@ -43,6 +43,45 @@
"archimedesJs": "ArchimedesJS",
"archimedesJsDescription": "Archimedes is a series of architectural concepts that are implemented in different languages. Using a given Archimedes implementation provides a set of solid and flexible architectural pieces."
},
"experience": {
"title": "Software Development Journey",
"cv": "Download full resume.",
"freelancer": {
"title": "Freelancer",
"dates": "2024 - Currently",
"description": "Branding, client outreach, project management, and development of frontend applications for multiple clients."
},
"autentia": {
"title": "Autentia",
"dates": "2017 - 2024",
"description": "* __Front-end Architect Lead__. I designed and implemented Design Systems in different frameworks, modular architectures following Hexagonal and Domain Driven Design principles and created robust Testing Strategies.\n* Software developer of different stacks, including JavaScript, TypeScript, Angular, Vue and React.\n* Open Source developer: Created an [architectural framework](https://www.archimedesfw.io/docs/js/) in TypeScript that makes your application more robust.\n* Trainer in different technologies, such as: JavaScript, TypeScript, Vue, Angular, React, testing, CSS, architecture, good practices and more.\n* Onboarding: I was part of designing the frontend onboarding process in the company\n* Mentor: I’ve been a mentor for the most junior members of the company and had 1:1 where we would set goals and track them.\n* Interviewer: I interviewed prominent tech people for the [company’s YouTube channel](https://www.youtube.com/watch?v=iThFgLmD96E&list=PLKxa4AIfm4pVyeMpU0QkV4gzaFDaa_RFW&index=10)"
},
"codemotion": {
"title": "Codemotion Committee Member",
"dates": "2019 - Currently",
"description": "Help contact speakers and design the event agenda. Participate in different webinars about different technologies."
},
"cice": {
"title": "Full Stack Development Masters Teacher at CICE",
"dates": "2020 - 2021",
"description": "Designed the curriculum, teach the students, and evaluate their progress. I taught HTML, CSS, JavaScript, TypeScript, React, NextJS, testing, architecture, good practices, and more. Here you can check the [open curriculum](https://github.com/cice-classroom/cice-playground)."
},
"escuelaIt": {
"title": "Frontend Development Teacher at EscuelaIT",
"dates": "Sporadic",
"description": "Trainer for the following courses: [Deno](https://escuela.it/cursos/curso-de-deno), [TypeScript](https://escuela.it/cursos/curso-typescript), [React](https://escuela.it/cursos/curso-desarrollo-aplicaciones-spa-react) and [Advanced JavaScript](https://escuela.it/cursos/curso-avanzado-javascript)."
},
"pensemos": {
"title": "Pensemos",
"dates": "2016 - 2017",
"description": "Web developer with Wordpress and React."
},
"comercialTalk": {
"title": "Comercial Talk",
"dates": "2013 - 2015",
"description": "Graphic designer and web developer. Poster, flyers, business cards and visual identity."
}
},
"services": {
"title": "Services",
"description": "I have <strong>10 years</strong> of experience in Frontend Development.\n\nI've deployed to production full-fledged enterprise applications using <strong>React</strong>, <strong>Angular</strong> and <strong>Vue</strong>.",
Expand Down
72 changes: 72 additions & 0 deletions src/features/home/ui/experience.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,72 @@
import { type FC } from 'react'
import { useTranslations } from 'next-intl'
import { Markdown } from '@/core/components/markdown/markdown'
import { Link } from '@/core/components/link/link'

export const Experience: FC = () => {
const t = useTranslations()
const experiences = [
{
title: t('home.experience.freelancer.title'),
dates: t('home.experience.freelancer.dates'),
description: t('home.experience.freelancer.description'),
},
{
title: t('home.experience.autentia.title'),
dates: t('home.experience.autentia.dates'),
description: t('home.experience.autentia.description'),
},
{
title: t('home.experience.codemotion.title'),
dates: t('home.experience.codemotion.dates'),
description: t('home.experience.codemotion.description'),
},
{
title: t('home.experience.cice.title'),
dates: t('home.experience.cice.dates'),
description: t('home.experience.cice.description'),
},
{
title: t('home.experience.escuelaIt.title'),
dates: t('home.experience.escuelaIt.dates'),
description: t('home.experience.escuelaIt.description'),
},
{
title: t('home.experience.pensemos.title'),
dates: t('home.experience.pensemos.dates'),
description: t('home.experience.pensemos.description'),
},
{
title: t('home.experience.comercialTalk.title'),
dates: t('home.experience.comercialTalk.dates'),
description: t('home.experience.comercialTalk.description'),
},
]

return (
<div className="p-6 sm:p-10">
<div className="max-w-3xl mx-auto">
<div className="relative pl-6 after:absolute after:inset-y-0 after:w-px after:bg-muted-foreground/20 after:left-0 grid gap-10">
{experiences.map((x, i) => (
<div key={i} className="grid gap-1 text-sm relative">
<div className="aspect-square w-3 bg-primary rounded-full absolute left-0 translate-x-[-29.5px] z-10 top-1" />
<div className="font-medium">{x.title}</div>
<div className="text-muted-foreground">
{x.dates}
<br />
<Markdown value={x.description} />
</div>
</div>
))}
</div>
<div className="mt-m">
<small>
<Link to="https://drive.google.com/file/d/1t92bJEKGwYaepUlZT7JrJd7zIWly6XqK/view?usp=drive_link">
{t('home.experience.cv')}
</Link>
</small>
</div>
</div>
</div>
)
}
7 changes: 7 additions & 0 deletions src/features/home/ui/home.page.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@ import { ScrambleText } from '@/core/components/scramble-text/scramble-text'
import { Button } from '@/components/ui/button'
import { ContactForm } from '@/features/home/ui/contact'
import { OpenToWork } from '@/core/components/open-to-work/open-to-work'
import { Experience } from '@/features/home/ui/experience'

export const Section: FC<
PropsWithChildren<{
Expand Down Expand Up @@ -65,6 +66,12 @@ export const HomePage: FC<{ articles: Article[] }> = ({ articles }) => {
</div>
</Section>

<Section title={t('home.experience.title')}>
<div className="wrapper">
<Experience />
</div>
</Section>

<Section title={t('home.services.title')}>
<Services />
</Section>
Expand Down

0 comments on commit 148c812

Please sign in to comment.