unifed portfolio and jobs

This commit is contained in:
2021-10-19 11:17:25 +02:00
parent 288389c886
commit cb6b2b468e
13 changed files with 72 additions and 383 deletions

View File

@@ -1,15 +1,15 @@
<script lang="ts">
let currentLanguage = 'it';
export let currentLanguage = 'it';
const whoIt='Ciao! Sono Gianmarco Pettinato mi sono laureato in scienze informatiche e sono uno sviluppatore full-stack.\
Ho famigliarità con diversi linguaggi e framework, sia front-end che back-end.\
In particolare ho famigliarità con C++ con Qt e TypeScript con Angular, Vue.js e Svelte.\
In particolare con C++ con Qt e TypeScript con Express, serverless, Angular, Vue.js e Svelte.\
Tra le mie competenze, oltre allo sviluppo software e alla manutenzione di sistemi linux, spicca la gestione di ambienti CI/CD, con pipeline automatiche e container come Docker.\
Sono interessato in particolar modo all\'ambiente dei dispositivi IoT e del wearble tech.\
Nel tempo libero mi dedico alla gestione del mio home sever e alla costruzione e manutenzione di computer.\
Per maggiori informazioni non esitate a contattarmi.';
const whoEn='Hi! I\'m Gianmarco Pettinato. I have a bachelor degree in computer science, and I\'m a full-stack developer.\
I know several languages and frameworks, either front-end and back-end.\
In particular, I have experience in C++ with Qt and TypeScript with Angular, Vue.js and Svelte.\
In particular, I have experience in C++ with Qt and TypeScript with Express, serverless, Angular, Vue.js and Svelte.\
Among my skill-set, there is the administration of the CI/CD environment with Docker.\
I\'m interested in the IoT world and Wearable tech. In my free time, I like to manage my GNU/Linux home server and build PCs.';
@@ -17,9 +17,9 @@
it:whoIt,
en:whoEn
}
export function changeLanguage(language = 'it'){
currentLanguage = language
}
// export function changeLanguage(language = 'it'){
// currentLanguage = language
// }
</script>
<div class="aboutMe">
<div class="header"><img src="/profile_pic.jpg" alt="profile" class="profile" />

View File

@@ -4,19 +4,15 @@
html:true,
xhtmlOut:true,
typographer: true,
breaks: true
breaks: true,
linkify: true
});
import data from '../model/jobs.json'
import type { Schema } from 'src/model/job';
export let currentLanguage = 'it'
const jobs:Schema[] = data as Schema[];
export function changeLanguage(language = 'it'){
currentLanguage = language
}
export let currentLanguage = '';
export let jobs:Schema[] = [];
</script>
<div class="jobsContainer">
{#each jobs as job, index }
{#each jobs as job }
<div class="job container">
<h3>{job.title[currentLanguage]}</h3>
<div class="job-content">
@@ -25,28 +21,37 @@
<img src="{image}" alt="realtive to the article"/>
{/each}
</div>
<div class="text-content" id="{index.toString()}">
<div class="text-content">
{@html md.render(job.content[currentLanguage])}
</div>
</div>
<div class="added-info">
<div class="added-info">
{job.year.start} - {job.year.end}
{#if job.year.lenght!=0}
Date: {job.year.start}{#if job.year.end.length!=0}; {job.year.end} {/if}
{/if}
<div>
{#if job.collaborators.length!=0}
Collab:
{/if}
{#each job.collaborators as collaborator, index }
<a href="{collaborator.ref}">{collaborator.name} {collaborator.surname}</a>{index!=job.collaborators.length-1?', ':''}
{/each}
</div>
<div>
{#each job.collaborators as collaborator}
<a href={collaborator.ref}>{collaborator.name}{collaborator.surname}</a>
{/each}
{#if job.languages.length!=0}
Lang:
{/if}
{#each job.languages as language,index }
{language}{index!=job.languages.length-1?', ':''}
{/each}
</div>
<div>
{#each job.languages as language}
{language+" "}
{/each}
</div>
<div>
{#each job.tecnologies as tecnology}
{tecnology+" "}
{/each}
{#if job.tecnologies.length!=0}
Tech:
{/if}
{#each job.tecnologies as tecnology, index }
{tecnology}{index!=job.tecnologies.length-1?', ':''}
{/each}
</div>
</div>
</div>
@@ -88,6 +93,7 @@
.added-info{
font-size: 13px;
text-align: left;
}
.text-content{
@@ -99,8 +105,9 @@
img{
max-width: 200px;
max-height: 500px;
width: auto;
max-width: 80%;
max-height: 20%;
background-color: $rich-black-fogra-29;
text-align: center;
}

View File

@@ -1,8 +1,5 @@
<script lang="ts">
let currentLanguage = 'it'
export function changeLanguage(language = 'it'){
currentLanguage = language
}
export let currentLanguage = 'it'
export const menu = {home:{it:"Home",en:"Home"},
job:{it:"Esperienze",en:"Experiences"},
school:{it:"Formazione",en:"Training"},

View File

@@ -9,9 +9,6 @@
import type { Schema } from 'src/model/job';
export let currentLanguage = 'it'
const training:Schema[] = data as Schema[];
export function changeLanguage(language = 'it'){
currentLanguage = language
}
</script>
<div class="trainingContainer">
{#each training as school }

View File

@@ -2,7 +2,7 @@
{
"year": {
"start": "2021-01-10",
"end": "..."
"end": ""
},
"title": {"en":"Jatus.tech my start-up","it":"La mia start-up Jatus.tech"},
"content": {
@@ -63,14 +63,14 @@
},
"collaborators": [],
"languages": [
"Php"
"PHP"
],
"tecnologies": [
"Telegram",
"Composer",
"Docker"
],
"images":["https://www.alternativestudio.it/images/logo/logo-light.png"]
"images":["/alternative-studio.png"]
},
{
"year": {
@@ -85,6 +85,6 @@
"collaborators": [],
"languages": [],
"tecnologies": [],
"images":["https://www.saxonhillacademy.org.uk/images/saxonhilllogo.jpg"]
"images":["/saxonhilllogo.jpg"]
}
]

View File

@@ -41,7 +41,7 @@
"title": {"en":"Keyboard","it":"Tastiera"},
"content": {
"en":"I spend a lot of time at my desk writing on the PC with not the best posture. This kind of behaviour was going to take a toll on my well-being, so I decided to start looking for a split design keyboard.\n The first keyboard that I found was the [Ergodox-EZ](https://ergodox-ez.com), but the steep price of more than 300 euros put me off. Then I found the subreddit [r/ErgoMechBoards](https://www.reddit.com/r/ErgoMechKeyboards) and saw a lot of different concepts, the one that stuck with me was the [lily58](https://github.com/kata0510/Lily58).\n So, I ordered all the pieces from various online stores. I took the kit from the [Keyhive](https://keyhive.xyz) shop for the base parts, like PCB and guide for the switches, bought the switches from [CandyKeys](https://candykeys.com) and a cheap keycap set from amazon.\n When all the pieces showed up at my place, I soldered all the components and assembled the keyboard. To add some flare, I printed with my 3d printer a custom case that I found on Thingiverse.\n In the future, I'd like to add a system to tilt the keyboard to fix the pronation issue.",
"it":"Io passo molto tempo al PC e spesso non ho una corretta postura. Sperando di mitigare il problema, iniziai a cercare delle tastiere ergonomiche come quelle con il design *split*.\n La prima che trovai fu [Ergodox-EZ](https://ergodox-ez.com), ma il prezzo di più 300 euro mi fece desistere. Successivamente trovai il *subreddit* [r/ErgoMechBoards](https://www.reddit.com/r/ErgoMechKeyboards) e vidi molti modelli diversi, quello che mi piacque di più fu [lily58](https://github.com/kata0510/Lily58).\n Quindi, ordinai i pezzi da diversi negozi online. Presi da [Keyhive](https://keyhive.xyz) le parti base come il PCB e la guida per i tasti e da [CandyKeys](https://candykeys.com) gli switch, per quanto riguarda i keycaps li presi da Amazon ordinando dal meno caro.\n Quanto tutti i pezzi arrivarono, con pazienza e dedizione saldai tutti componenti e assemblai la tastiera. Per aggiungere un tocco personale, stampai con la mia stampante 3d la scocca che trovai su Thingverse.\n Come miglioramenti futuri, mi piacerebbe aggiungere un sistema per angolare la tastiera e risolvere il problema di pronazione dei polsi."
"it":"Io passo molto tempo al PC e spesso non ho una corretta postura. Sperando di mitigare il problema, iniziai a cercare delle tastiere ergonomiche come quelle con il design *split*.\n La prima che trovai fu [Ergodox-EZ](https://ergodox-ez.com), ma il prezzo di più 300 euro mi fece desistere. Successivamente trovai il *subreddit* [r/ErgoMechBoards](https://www.reddit.com/r/ErgoMechKeyboards) e vidi molti modelli diversi, quello che mi piacque di più fu [lily58](https://github.com/kata0510/Lily58).\n Quindi, ordinai i pezzi da diversi negozi online. Presi da [Keyhive](https://keyhive.xyz) le parti base come il PCB e la guida per i tasti e da [CandyKeys](https://candykeys.com) gli switch, per quanto riguarda i keycaps li presi da Amazon ordinando dal meno caro.\n Quanto tutti i pezzi arrivarono, con pazienza e dedizione saldai tutti i componenti e assemblai la tastiera. Per aggiungere un tocco personale, stampai con la mia stampante 3d la scocca che trovai su Thingverse.\n Come miglioramenti futuri, mi piacerebbe aggiungere un sistema per angolare la tastiera e risolvere il problema di pronazione dei polsi."
},
"collaborators": [],
"languages": [
@@ -81,8 +81,8 @@
},
{
"year":{
"start":"2021-09-15",
"end":"2021-09-30"},
"start":"2019-04-15",
"end":""},
"title":{"en":"Workstation","it":"Postazione di lavoro"},
"content":{
"en":"My workstation is build upon my custom desk made on request and can accommodate my PC and laptop, I use both of them to work and develop my projects. The monitors are an 34\" 21:9 with a resoluztion of 3440x1440 and a 27\" 16:9 with a resolution of 2560x1440. ",
@@ -95,12 +95,12 @@
},
{
"year":{
"start":"2021-09-15",
"end":"2021-09-30"},
"start":"2019-11-17",
"end":"2020-05-18"},
"title":{"en":"Software Engineering Project","it":"Progetto di Ingegneria del Software"},
"content":{
"en":"While in university, I worked on a project for the software engineering course. The group decided to develop the project Etherless, a FAAS based on Etherium and AWS lambda. The system worked like this, a user writes a function and uploads it to the service that assigns a cost of execution. Then, when a user wants to execute the function, must issue the request and pay the execution through the Ethereum network. We released all the software in MIT licence here [Tenners Unipd](https://github.com/TennersUnipd).",
"it":"Per il corso di ingegneria del software sono stato assegnato ad un gruppo di colleghi di corso universitario e di sviluppare uno dei progetti proposti. Scegliemmo di sviluppare il progetto Etherless un **FAAS** usando la piattaforma AWS lambda per l'esecuzione delle funzioni. Gli utenti possono scrivere e pubblicare funzioni sul servizio, determinandone il costo di esecuzione. Quindi, altri utenti possono eseguire le funzioni pubblicate richiedendone l'esecuzione, pagando il corrispettivo compenso, attraverso la rete Ethereum. Abbiamo rilasciato il software in licenza MIT [Tenners Unipd](https://github.com/TennersUnipd)"
"it":"Per il corso di ingegneria del software sono stato assegnato ad un gruppo di colleghi di corso universitario per sviluppare uno dei progetti proposti. Scegliemmo Etherless ovvero un **FAAS** usando la piattaforma AWS lambda per l'esecuzione delle funzioni. Gli utenti possono scrivere e pubblicare funzioni sul servizio, determinandone il costo di esecuzione. Quindi, altri utenti possono richiedere l'esecuzione, pagando il corrispettivo compenso, attraverso la rete Ethereum. Abbiamo rilasciato il software in licenza MIT [Tenners Unipd](https://github.com/TennersUnipd)"
},
"collaborators":[{"name":"Gezim","surname":"Cikaqi","ref":"https://www.linkedin.com/in/gezimcikaqi/"},{"name":"Gabriel","surname":"Ciulei","ref":"https://www.linkedin.com/in/gabriel-ciulei/"},{"name":"Simone","surname":"Franconetti","ref":"https://www.linkedin.com/in/simone-franconetti-2b48b4147/"},{"name":"Giovanni","surname":"Incalza","ref":"https://www.linkedin.com/in/giovanni-incalza/"},{"name":"Nicola","surname":"Salvadore","ref":"https://www.linkedin.com/in/nicola-salvadore-02b015210/"},{"name":"Paola","surname":"Trevisan","ref":"https://www.linkedin.com/in/paola-trevisan-166891113/"}],
"languages":["TypeScript","Solidity","YAML"],
@@ -109,8 +109,8 @@
},
{
"year":{
"start":"2021-09-15",
"end":"2021-09-30"},
"start":"2019-11-27",
"end":"2019-12-15"},
"title":{"en":"Latex-multicompiler","it":"Latex-multicompiler"},
"content":{
"en":"I developed a GitHub Action to compile Latex documents from a git repository. I did this to produce the PDFs as artefacts and to practice the **CI/CD** practices. I released the project with an MIT license [here](https://github.com/Jatus93/Latex-multicompiler).",
@@ -123,8 +123,8 @@
},
{
"year":{
"start":"2021-09-15",
"end":"2021-09-30"},
"start":"2019-12-18",
"end":"2020-05-08"},
"title":{"en":"Spell checker, aspell GitHub Action","it":"Controllo ortografico, aspell GitHub Action"},
"content":{
"en":"I developed a GitHub Action to perform a spell check on PDF documents from a git repository, the software transform the PDF file to a plain txt and checks the spelling of words using aspell. I released the project with an LGPL-2.1 license [here](https://github.com/Jatus93/spellCheck).",
@@ -137,8 +137,8 @@
},
{
"year":{
"start":"2021-09-15",
"end":"2021-09-30"},
"start":"2019-04-14",
"end":"2019-06-10"},
"title":{"en":"Project for object oriented programming course","it":"Progetto per il corso di programmazione ad oggetti"},
"content":{
"en":"I delevoped a IoT object container for the object oriented programming course with the possiblity to edit the devices' configuration. <a rel=\"external\" href=\"/QContainer.pdf\">I wrote a report about it (italian)</a> and [released the software](https://github.com/Jatus93/QONTAINER) in LGPL-3.0 License ",
@@ -151,25 +151,25 @@
},
{
"year":{
"start":"2021-09-15",
"end":"2021-09-30"},
"start":"2018-12-03",
"end":"2019-02-13"},
"title":{"en":"Tech web","it":"Tecnologie Web"},
"content":{
"en":"For the tech web course, my colleagues and I develop a portfolio website for an artist where the user could upload and manage all their images and also included a blog with a comments section.",
"it":"Per il corso di tecnologie web io e i miei colleghi abbiamo sviluppato un sito web vetrina per artisti con un sistema per la gestione dei contenuti."},
"collaborators":[{"name":"Giuseppe Vito","surname":"Bitetti","ref":"https://www.linkedin.com/in/giuseppe-vito-bitetti-587751200"}, {"name":"Enrico","surname":"Buratto","ref":"https://www.linkedin.com/in/enrico-buratto-04104b151"},{"name":"Mariano","surname":"Sciacco","ref":"https://www.linkedin.com/in/marianosciacco/"}],
"languages":["php","SQL"],
"languages":["PHP","SQL"],
"tecnologies":["Apache","MariaDB"],
"images":["/techweb.png"]
},
{
"year":{
"start":"2021-09-15",
"end":"2021-09-30"},
"start":"2018-05-16",
"end":"2018-05-22"},
"title":{"en":"ANTRL parser Swl","it":"ANTRL parser Swl"},
"content":{
"en":"For the course about Automata and Formal, my colleague and I developed a translator from a made-up language SWL to a more common C++. For this project, the professors required the use of \"antlr\" a framework used to recognise a regular expression and apply logic for every rule. For more information https://swl.debug.ovh/ (italian)",
"it":"Per il corso di Automi e linguaggi formali, il mio collega ed io sviluppammo un traduttore da un linguaggio inventato, SWL, a uno più comune C++. Per questo compito i professori richiesero l'uso di un framework chiamato \"ANTRL\" che è in grado di riconoscere le epressioni regolare che gli vengono proposte di applicare delle logiche al riguardo. Per maggiori info https://swl.debug.ovh/"
"it":"Per il corso di Automi e linguaggi formali, il mio collega ed io sviluppammo un traduttore da un linguaggio inventato, SWL, a uno più comune C++. Per questo compito i professori richiesero l'uso di un framework chiamato \"ANTRL\" che è in grado di riconoscere le epressioni regolari che gli vengono proposte e di applicare delle logiche al riguardo. Per maggiori info https://swl.debug.ovh/"
},
"collaborators":[{"name":"Mariano","surname":"Sciacco","ref":"https://www.linkedin.com/in/marianosciacco/"}],
"languages":["C++","SWL","ANTLR grammar"],

View File

@@ -5,20 +5,12 @@
import Portfolio from '$elem/Portfolio.svelte';
import Training from '$elem/Training.svelte'
import Contacts from '$elem/Contacts.svelte'
let jobsHandler: Jobs;
let menuHandler: Menu;
let aboutMe:AboutMe;
let trainingHandler: Training;
let portfolioHandler: Portfolio;
import Data_jobs from '../model/jobs.json';
import Data_portfolio from '../model/portfolio.json';
import type { Schema } from "src/model/job";
let jobs:Schema[] = Data_jobs as Schema[];
let portfolio:Schema[] = Data_portfolio as Schema[];
let currentLanguage: string ='it';
function changeLanguage(language:string){
console.log(language);
jobsHandler.changeLanguage(language);
menuHandler.changeLanguage(language);
aboutMe.changeLanguage(language);
trainingHandler.changeLanguage(language);
portfolioHandler.changeLanguage(language);
}
let titles = {home:{it:"Home",en:"Home"},
job:{it:"Esperienze",en:"Experiences"},
school:{it:"Formazione",en:"Training"},
@@ -27,24 +19,24 @@
</script>
<main class="maindiv">
<!-- svelte-ignore a11y-invalid-attribute -->
<div class="language-selector" id="language-selector"> <a href="#" on:click={()=>{changeLanguage('it')}}>IT</a> <a href="#" on:click={()=>{changeLanguage('en')}}>EN</a> </div>
<div class="language-selector" id="language-selector"> <a href="#" on:click={()=>{ currentLanguage = 'it'}}>IT</a> <a href="#" on:click={()=>{currentLanguage = 'en'}}>EN</a> </div>
<div class="menu">
<Menu bind:this="{menuHandler}"/>
<Menu {currentLanguage}/>
</div>
<div class="about" id="home">
<AboutMe bind:this="{aboutMe}"/>
<AboutMe {currentLanguage}/>
</div>
<div class="content" id="jobs">
<h2>{titles.job[currentLanguage]}</h2>
<Jobs bind:this="{jobsHandler}"/>
<Jobs jobs={jobs} {currentLanguage}/>
</div>
<div class="content" id="training">
<h2>{titles.school[currentLanguage]}</h2>
<Training bind:this="{trainingHandler}"/>
<Training {currentLanguage} />
</div>
<div class="content" id="portfolio">
<h2>{titles.portfolio[currentLanguage]}</h2>
<Portfolio bind:this="{portfolioHandler}"/>
<Jobs jobs={portfolio} {currentLanguage}/>
</div>
<div class="content" id="contacts">
<h2>{titles.contacts[currentLanguage]}</h2>