feat: translate project descriptions

src/components/Timeline.vue

@@ -36,7 +36,7 @@
 			<div :key="'desc-icon-'+proj.name" class='desc-icon'>
 				<img src='../assets/timeline/info.svg' />
 			</div>
-			<div :key="'desc-'+proj.name" class='desc' v-html='proj.info'></div>
+			<div :key="'desc-'+proj.name" class='desc' v-html='proj.info[$i18n.locale]'></div>
 
 			<template v-if='proj.source != null'>
 				<div :key="'src-icon-'+proj.name" class='src-icon'>
@@ -465,6 +465,7 @@ export default class Timeline extends Vue {
 				width: 50vw;
 
 			font-size: .8em;
+			text-align: justify;
 
 			padding: 1em;
 			padding-bottom: 2em;

src/locales/en.json

@@ -71,6 +71,7 @@
 	"skill.uiux":            "UI/UX",
 	"skill.inkscape":        "Inkscape",
 	"skill.rnd":             "R&D",
+	"skill.teamlead":        "Team Lead",
 
 	"time.diff-format": "{elapsed} ago",
 

src/locales/fr.json

@@ -32,6 +32,7 @@
 	"skill.neuralnetwork":   "Réseaux de neuronnes",
 	"skill.opti":            "Optimization",
 	"skill.concurrency":     "Programmation Concurrente",
+	"skill.teamlead":        "Chef d'équipe",
 
 
 	"time.diff-format": "il y a {elapsed}",

src/model/projects.ts

@@ -1,3 +1,4 @@
+import { Locales } from '@/locales';
 import { tID as s } from './skills';
 
 export interface Link {
@@ -11,7 +12,7 @@ export interface Project {
 	client: string|null;
 	started_at: Date;
 	stopped_at: Date|null;
-	info: string;
+	info: { [loc in Locales]: string };
 	source: Link|null;
 	doc: Link|null;
 	commits: number;
@@ -24,7 +25,10 @@ export const Projects: Project[] = [
 		skills: [s.Angular, s.RnD, s.Concurrency, s.Html, s.Css, s.Inkscape, s.UIUX, s.Ts, s.Js, s.Ajax, s.Cordova, s.Bash, s.Git, s.Rest, s.Rpm, s.Vue, s.Web, s.Docker],
 		started_at: new Date(2019, 10, 26),
 		stopped_at: new Date(2021, 4, 11),
-		info: 'Prototype for a front-end Angular modular system. I technically and visually designed a kind of app store. Hacked angular to allow injecting custom pages and code on-the-go.',
+		info: {
+			[Locales.EN]: 'Prototype for a front-end Angular modular system. I technically and visually designed a kind of app store. Hacked angular to allow injecting custom pages and code on-the-go.',
+			[Locales.FR]: 'Prototype pour rendre un front-end Angular entièrement modulaire. J\'ai du concevoir (techniquement et visuellement) une sorte d\'App store permettant de sélectionner les modules à installer. D\'autre part j\'ai du en quelque sorte hacker angular afin qu\'il permette d\'y injecter des composants (interface) et des services (code) externes en temps réel.',
+		},
 		source: null, doc: null,
 		commits: 0, // ???
 	},
@@ -34,17 +38,23 @@ export const Projects: Project[] = [
 		skills: [s.Qt, s.RnD, s.Cpp, s.Concurrency, s.Git, s.Css, s.Inkscape, s.UIUX],
 		started_at: new Date(2019, 10, 26),
 		stopped_at: new Date(2021, 4, 11),
-		info: 'TODO',
+		info: {
+			[Locales.EN]: 'TODO',
+			[Locales.FR]: 'TODO',
+		},
 		source: null, doc: null,
 		commits: 840,
 	},
 	{
 		name: 'ADSBOnPED',
 		client: 'Collins Aerospace',
-		skills: [s.Qt, s.RnD, s.Cpp, s.Concurrency, s.Git, s.Css, s.Bash, s.Linux, s.Inkscape, s.UIUX],
+		skills: [s.Qt, s.RnD, s.Cpp, s.Concurrency, s.Git, s.Css, s.Bash, s.Linux, s.Inkscape, s.UIUX, s.TeamLead],
 		started_at: new Date(2020, 7, 16),
 		stopped_at: null,
-		info: 'TODO',
+		info: {
+			[Locales.EN]: 'TODO',
+			[Locales.FR]: 'TODO',
+		},
 		source: null, doc: null,
 		commits: 1897 + 62,
 	},
@@ -54,7 +64,10 @@ export const Projects: Project[] = [
 		skills: [s.Go, s.Rest, s.Concurrency, s.Git, s.Bash, s.Linux, s.Docker, s.Crypto, s.Postgres, s.Opti, s.Websocket, s.Inkscape, s.UIUX],
 		started_at: new Date(2021, 1, 6),
 		stopped_at: new Date(2022, 11, 1),
-		info: 'TODO',
+		info: {
+			[Locales.EN]: 'TODO',
+			[Locales.FR]: 'TODO',
+		},
 		source: null, doc: null,
 		commits: 1260 + 90 + 41 + 1 + 12 + 1 + 14,
 	},
@@ -65,7 +78,10 @@ export const Projects: Project[] = [
 		skills: [s.Go, s.Web, s.Rest, s.OpenSource, s.Git, s.Inkscape],
 		started_at: new Date(2018, 5, 19),
 		stopped_at: null, // still active
-		info: 'Started as a personal go library to ease REST API development. The main goal is to greatly enhance maintainability by providing a single configuration file that describes every endpoint of the API. Everything that can be automated is while staying idiomatic to go. Aicra automates routing, parameter validation and extraction, permission management, response output formatting. I then used it for a professional project in the medical field after corporate evaluation and audit.',
+		info: {
+			[Locales.EN]: 'Started as a personal go library to ease REST API development. The main goal is to greatly enhance maintainability by providing a single configuration file that describes every endpoint of the API. Everything that can be automated is while staying idiomatic to go. Aicra automates routing, parameter validation and extraction, permission management, response output formatting.<br><br>I then used it for a professional project in the medical field after corporate evaluation and audit. At the end of the project, results in production are promising : development and testing speed and ease, overall performances, configuration readability for other team members provides a real benefit, they can know the whole api at any time.',
+			[Locales.FR]: 'Démarré en tant que projet personnel afin de simplifier mes développements d\'API REST. L\'objectif principal et d\'améliorer significativement la maintenabilité avec l\'utilisation d\'un fichier de configuration unique qui décrit/définit tous les endpoints de l\'API. Tout ce qui peut être automatisé l\'est tout en restant idiomatique à Go. Aicra automatise le routage, la validation et extraction des paramètres, les classes de permissions, le formattage des réponses, etc.<br><br>J\'ai ensuite pu utiliser cette librairie lors d\'un projet industriel dans le domaine médical après audit et evaluation par l\'entreprise. Après avoir terminé ce projet, les résultats sont plutôt encourageants : rapidité de développement et de test, performances, lisibilité du fichier de configuration pour les autres membres de l\'équipe, (permet de connaître toute l\'API à tout moment du développement) etc.',
+		},
 		source: { name: 'github.com/xdrm-io/aicra', link: 'https://github.com/xdrm-io/aicra' },
 		doc: { name: 'pkg.go.dev/github.com/xdrm-io/aicra', link: 'https://pkg.go.dev/github.com/xdrm-io/aicra' },
 		commits: 535,

src/model/skills.ts

@@ -44,6 +44,7 @@ export enum tID {
 	UIUX,
 	Inkscape,
 	RnD,
+	TeamLead,
 }
 
 export enum tTag {
@@ -125,12 +126,12 @@ export function skillLabel(s: tID): string {
 		case tID.UIUX:            return 'skill.uiux';
 		case tID.Inkscape:        return 'skill.inkscape';
 		case tID.RnD:             return 'skill.rnd';
+		case tID.TeamLead:        return 'skill.teamlead';
 	}
 }
 
 export interface tSkill {
 	icon: string|null;
-	name: string;
 	link: string;
 	tags: tTag[];
 	info: string;
@@ -140,21 +141,18 @@ export type tSkills = { [id in tID]: tSkill };
 
 export const Skills: tSkills = {
 	[tID.MariaDB]: {
-		name: 'MariaDB',
 		link: 'https://mariadb.org',
 		icon: 'skills/mariadb.svg',
 		tags: [tTag.Web, tTag.Storage],
 		info: 'I started using mysql then MariaDB as my first introduction to SQL, mostly when I started learning web with PHP. I now prefer using postgreSQL instead as it tends to be more robust and performant overall.',
 	},
 	[tID.Postgres]: {
-		name: 'PostgreSQL',
 		link: 'https://postgresql.org',
 		icon: 'skills/postgres.svg',
 		tags: [tTag.Web, tTag.Storage],
 		info: 'My main choice of dbms when using sql orfor relational databases. Had some experience with it mainly with go services with docker.',
 	},
 	[tID.Mongo]: {
-		name: 'MongoDB',
 		link: 'https://mongodb.com',
 		icon: 'skills/mongo.svg',
 		tags: [tTag.Web, tTag.Storage],
@@ -162,35 +160,30 @@ export const Skills: tSkills = {
 	},
 
 	[tID.Vue]: {
-		name: 'Vue <i>(.js)</i>',
 		link: 'https://vuejs.org',
 		icon: 'skills/vue.svg',
 		tags: [tTag.Web, tTag.UI],
 		info: 'I started learning Vue (.js) back in 2016, and never stopped practicing since then for personal and professional projects. I view it as a better alternative than angular which provides you with a strict framework that can lack flexibility among teams and projects.<br><br>Vue makes it your responsability to properly structure your project which I like to take care of myself, as it tends to provide a better workflow adjusted for every project.<br><br>It is my top choice when considering a web framework for rendering pages.',
 	},
 	[tID.Angular]: {
-		name: 'Angular <i>(7+)</i>',
 		link: 'https://angular.io',
 		icon: 'skills/angular.svg',
 		tags: [tTag.Web, tTag.UI],
 		info: 'I used it only once to break it apart in a R&D project. I had to "hack" it in order to inject services and components on-the-fly.<br><br>You had a kind of App store where you could install modules. The Angular-powered website would inject new navigation menus, pages and services according to the modules you had installed.<br><br>I do not like Angular, as I think Vue.js does a better job achieving the same goal with a cleaner API, and does not force you to embrace the Angular/Google way of coding and organizing things.',
 	},
 	[tID.Parcel]: {
-		name: 'Parcel',
 		link: 'https://parceljs.org/',
 		icon: 'skills/parcel.svg',
 		tags: [tTag.Web],
 		info: 'I used it often back in my Master\'s Degree period along with PHP backends. It allows to get away from webpack which I find overly complicated and a major point of failure for most frontends.<br><br>I haven\'t used it in a while but would highly consider it as it has no real prerequisite.',
 	},
 	[tID.Cordova]: {
-		name: 'Apache Cordova',
 		link: 'https://cordova.apache.org/',
 		icon: 'skills/cordova.svg',
 		tags: [tTag.System, tTag.Web, tTag.Mobile],
 		info: 'I used it often to transform single-page applications into android, iOS or desktop apps at low cost. I haven\'t needed this kind of software for a while, it might now be favorable to use Capacitor or other "alternatives".',
 	},
 	[tID.Webpack]: {
-		name: 'Webpack',
 		link: 'https://webpack.js.org/',
 		icon: 'skills/webpack.svg',
 		tags: [tTag.Web],
@@ -198,21 +191,18 @@ export const Skills: tSkills = {
 	},
 
 	[tID.WebGL]: {
-		name: 'WebGL',
 		link: 'https://www.khronos.org/webgl/',
 		icon: null,
 		tags: [tTag.Web],
 		info: 'I used it during my graduation years, the potential is great but I need to find a time to explore what\'s new.',
 	},
 	[tID.AudioAPI]: {
-		name: 'Audio API',
 		link: 'https://webaudio.github.io/web-audio-api/',
 		icon: null,
 		tags: [tTag.Web],
 		info: 'I used it mainly to build a discord clone (audio and video full-duplex streaming) as a school project. I also tried the Fourier transform to build nice graphics (c.f. Soundcloud) but have not succeeded at the time.',
 	},
 	[tID.Websocket]: {
-		name: 'Websocket',
 		link: 'https://tools.ietf.org/html/rfc6455',
 		icon: null,
 		tags: [tTag.Web, tTag.Network, tTag.IoT],
@@ -220,42 +210,36 @@ export const Skills: tSkills = {
 	},
 
 	[tID.Docker]: {
-		name: 'Docker',
 		link: 'https://docker.com',
 		icon: 'skills/docker.svg',
 		tags: [tTag.Web, tTag.System],
 		info: 'I am using it for a while now. Most of my go projects use it as it costs no memory for your executable (multi-stage build from scratch) and allows for isolation and a better control over the running environment. I am learning docker a bit more every time I use it. It is often coupled with docker-compose in my projects.',
 	},
 	[tID.Bash]: {
-		name: 'bash',
 		link: 'https://www.gnu.org/software/bash/',
 		icon: null,
 		tags: [tTag.System],
 		info: 'Felt in love with GNU/linux and its ecosystem a while back (was 14yo back then) and I\'ve never stopped. I\'m often the linux/bash guy of the team.<br><br>I use it extensively to automate anything a human can do as it avoids a lot of mistakes in most workflows.',
 	},
 	[tID.Linux]: {
-		name: 'GNU/Linux',
 		link: 'https://www.linux.org',
 		icon: 'skills/linux.svg',
 		tags: [tTag.System],
 		info: 'Felt in love with GNU/linux and its ecosystem a while back (was 14yo back then) and I\'ve never stopped. <br><br>Linux has been my main OS choice since then. I stepped through Ubuntu, Debian, Manjaro, Elementary, Tails (live), and I am now on Solus for a few years.',
 	},
 	[tID.Systemd]: {
-		name: 'systemd',
 		link: 'https://freedesktop.org/wiki/Software/systemd/',
 		icon: null,
 		tags: [tTag.System],
 		info: '',
 	},
 	[tID.Git]: {
-		name: 'Git',
 		link: 'https://git-scm.com/',
 		icon: 'skills/git.svg',
 		tags: [tTag.System, tTag.Organization],
 		info: '',
 	},
 	[tID.Rpm]: {
-		name: 'RPM packaging',
 		link: 'https://rpm.org/',
 		icon: null,
 		tags: [tTag.System],
@@ -263,14 +247,12 @@ export const Skills: tSkills = {
 	},
 
 	[tID.RaspBerry]: {
-		name: 'Raspberry',
 		link: 'https://raspberrypi.org',
 		icon: 'skills/raspberry.svg',
 		tags: [tTag.System, tTag.IoT],
 		info: '',
 	},
 	[tID.Arduino]: {
-		name: 'Arduino',
 		link: 'https://arduino.cc',
 		icon: 'skills/arduino.svg',
 		tags: [tTag.System, tTag.IoT],
@@ -278,70 +260,60 @@ export const Skills: tSkills = {
 	},
 
 	[tID.Php]: {
-		name: 'PHP',
 		link: 'https://www.php.net',
 		icon: 'skills/php.svg',
 		tags: [tTag.Language, tTag.Web, tTag.IoT],
 		info: '',
 	},
 	[tID.Html]: {
-		name: 'HTML5',
 		link: 'https://www.w3.org/standards/webdesign/htmlcss',
 		icon: 'skills/html.svg',
 		tags: [tTag.Language, tTag.Web, tTag.UI],
 		info: '',
 	},
 	[tID.Css]: {
-		name: 'CSS3',
 		link: 'https://www.w3.org/standards/webdesign/htmlcss',
 		icon: 'skills/css.svg',
 		tags: [tTag.Language, tTag.Web, tTag.UI],
 		info: '',
 	},
 	[tID.Js]: {
-		name: 'Javascript',
 		link: 'http://www.ecma-international.org/publications-and-standards/standards/ecma-262/',
 		icon: 'skills/js.svg',
 		tags: [tTag.Language, tTag.Web, tTag.UI],
 		info: '',
 	},
 	[tID.Ajax]: {
-		name: 'AJAX',
 		link: 'https://www.w3schools.com/xml/ajax_intro.asp',
 		icon: null,
 		tags: [tTag.Web, tTag.Network],
 		info: '',
 	},
 	[tID.Ts]: {
-		name: 'Typescript',
 		link: 'https://www.typescript.org/',
 		icon: 'skills/ts.svg',
 		tags: [tTag.Language, tTag.Web, tTag.UI],
 		info: '',
 	},
 	[tID.C]: {
-		name: 'C (lang)',
 		link: 'https://www.open-std.org/jtc1/sc22/wg14/',
 		icon: 'skills/c.svg',
 		tags: [tTag.Language, tTag.System],
 		info: '',
 	},
 	[tID.Cpp]: {
-		name: 'C++',
 		link: 'https://isocpp.org/',
 		icon: 'skills/cpp.svg',
 		tags: [tTag.Language, tTag.System],
 		info: '',
 	},
 	[tID.Python]: {
-		name: 'Python',
 		link: 'https://python.org/',
 		icon: 'skills/python.svg',
 		tags: [tTag.Language, tTag.System],
 		info: '',
 	},
 	[tID.Go]: {
-		name: 'Go (lang)',
 		link: 'https://go.dev',
 		icon: 'skills/go.svg',
 		tags: [tTag.Language, tTag.System, tTag.IoT, tTag.Network],
@@ -349,7 +321,6 @@ export const Skills: tSkills = {
 	},
 
 	[tID.Qt]: {
-		name: 'Qt',
 		link: 'https://qt.io',
 		icon: 'skills/qt.svg',
 		tags: [tTag.Language, tTag.System, tTag.IoT, tTag.Network],
@@ -357,108 +328,99 @@ export const Skills: tSkills = {
 	},
 
 	[tID.OpenSource]: {
-		name: 'Open-source',
 		link: 'https://opensource.org/',
 		icon: null,
 		tags: [tTag.Human],
 		info: '',
 	},
 	[tID.Electronics]: {
-		name: 'Electronics',
 		link: 'https://en.wikipedia.org/wiki/Electronics',
 		icon: 'skills/electronics.svg',
 		tags: [tTag.Other, tTag.IoT],
 		info: '',
 	},
 	[tID.Web]: {
-		name: 'Web',
 		link: 'https://en.wikipedia.org/wiki/World_Wide_Web',
 		icon: null,
 		tags: [tTag.Web],
 		info: '',
 	},
 	[tID.Rest]: {
-		name: 'REST',
 		link: 'https://en.wikipedia.org/wiki/Representational_state_transfer',
 		icon: null,
 		tags: [tTag.Web, tTag.Network],
 		info: '',
 	},
 	[tID.Crypto]: {
-		name: 'Security/crypto',
 		link: 'https://en.wikipedia.org/wiki/Cryptography',
 		icon: 'skills/security.svg',
 		tags: [tTag.System, tTag.Network],
 		info: '',
 	},
 	[tID.ImageProcessing]: {
-		name: 'Image processing',
 		link: 'https://en.wikipedia.org/wiki/Digital_image_processing',
 		icon: 'skills/image-processing.svg',
 		tags: [tTag.System],
 		info: '',
 	},
 	[tID.AI]: {
-		name: 'Artificial Intelligence',
 		link: 'https://en.wikipedia.org/wiki/Artificial_intelligence',
 		icon: null,
 		tags: [tTag.Other],
 		info: '',
 	},
 	[tID.DeepLearning]: {
-		name: 'Deep Learning',
 		link: 'https://en.wikipedia.org/wiki/Deep_learning',
 		icon: null,
 		tags: [tTag.Other],
 		info: '',
 	},
 	[tID.NeuralNetwork]: {
-		name: 'Neural Networks',
 		link: 'https://en.wikipedia.org/wiki/Artificial_neural_network',
 		icon: null,
 		tags: [tTag.Other],
 		info: '',
 	},
 	[tID.Opti]: {
-		name: 'Program optimization',
 		link: 'https://en.wikipedia.org/wiki/Program_optimization',
 		icon: 'skills/opti.svg',
 		tags: [tTag.System, tTag.Network],
 		info: '',
 	},
 	[tID.Sockets]: {
-		name: 'Sockets',
 		link: 'https://en.wikipedia.org/wiki/Computer_network_programming',
 		icon: null,
 		tags: [tTag.System, tTag.Network, tTag.IoT, tTag.Web],
 		info: '',
 	},
 	[tID.Concurrency]: {
-		name: 'Concurrency',
 		link: 'https://en.wikipedia.org/wiki/Concurrent_computing',
 		icon: null,
 		tags: [tTag.System, tTag.Network],
 		info: '',
 	},
 	[tID.UIUX]: {
-		name: 'UI/UX',
 		link: 'https://en.wikipedia.org/wiki/UX',
 		icon: null,
 		tags: [tTag.System, tTag.Web, tTag.IoT],
 		info: '',
 	},
 	[tID.Inkscape]: {
-		name: 'Inkscape',
 		link: 'https://inkscape.org/',
 		icon: 'skills/inkscape.svg',
 		tags: [tTag.UI, tTag.Web, tTag.Organization],
 		info: '',
 	},
 	[tID.RnD]: {
-		name: 'R&D',
 		link: 'https://en.wikipedia.org/wiki/R&D',
 		icon: null,
 		tags: [tTag.Organization, tTag.Other],
 		info: '',
 	},
+	[tID.TeamLead]: {
+		link: 'https://en.wikipedia.org/wiki/Team_leader',
+		icon: null,
+		tags: [tTag.Organization, tTag.Human,],
+		info: '',
+	},
 };