Compare commits

..

No commits in common. "ae0a9622c157da63869e51d6300e79267204aea2" and "a8d98999e6efa74f43c25e6937b091ff1d278b91" have entirely different histories.

8 changed files with 180 additions and 321 deletions

View File

@ -3,7 +3,6 @@
<Home/> <Home/>
<SkillPicker ref='picker' @pick='onPick($event)'/> <SkillPicker ref='picker' @pick='onPick($event)'/>
<Timeline ref='timeline' @pick='onPicked($event)'/> <Timeline ref='timeline' @pick='onPicked($event)'/>
<Footer/>
</div> </div>
</template> </template>
@ -13,7 +12,6 @@ import { tID } from '@/model/skills';
import Home from './components/Home.vue'; import Home from './components/Home.vue';
import Timeline from './components/Timeline.vue'; import Timeline from './components/Timeline.vue';
import SkillPicker from './components/SkillPicker.vue'; import SkillPicker from './components/SkillPicker.vue';
import Footer from './components/Footer.vue';
import { Locales } from './locales'; import { Locales } from './locales';
@ -22,7 +20,6 @@ import { Locales } from './locales';
Home, Home,
Timeline, Timeline,
SkillPicker, SkillPicker,
Footer,
}, },
}) })
export default class App extends Vue { export default class App extends Vue {

View File

@ -1,72 +0,0 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
width="420mm"
height="20.822mm"
version="1.1"
viewBox="0 0 420 20.822"
id="svg4984"
sodipodi:docname="wave.invert.1.svg"
inkscape:version="1.2.1 (9c6d41e410, 2022-07-14)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview4986"
pagecolor="#505050"
bordercolor="#eeeeee"
borderopacity="1"
inkscape:showpageshadow="0"
inkscape:pageopacity="0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#505050"
inkscape:document-units="mm"
showgrid="false"
inkscape:zoom="0.79815972"
inkscape:cx="793.70079"
inkscape:cy="38.839344"
inkscape:window-width="1920"
inkscape:window-height="1006"
inkscape:window-x="0"
inkscape:window-y="42"
inkscape:window-maximized="1"
inkscape:current-layer="svg4984" />
<defs
id="defs4978">
<linearGradient
id="a"
x1="787.57"
x2="787.57"
y1="4.8222"
y2="78.695"
gradientUnits="userSpaceOnUse">
<stop
stop-color="#fff"
stop-opacity=".97647"
offset="0"
id="stop4971"
style="stop-color:#745cfc;stop-opacity:0.98000002;" />
<stop
stop-color="#fff"
stop-opacity=".89804"
offset="0.59202999"
id="stop4973"
style="stop-color:#745cfc;stop-opacity:0.89999998;" />
<stop
stop-color="#fff"
offset="1"
id="stop4975"
style="stop-color:#745cfc;stop-opacity:1;" />
</linearGradient>
</defs>
<g
transform="translate(-.83328 -158.95)"
id="g4982">
<path
transform="matrix(.26458 0 0 .26458 .83328 158.95)"
d="m606.63 54.502c-83.352 2.1157-145.7-25.555-224.09-24.496s-178.77 28.151-242.71 33.189c-63.941 5.0388-69.397 2.5932-139.83 2.9902v12.51h1587.4v-12.51l-43.672-0.2875c-118.61-0.78082-508.71-61.141-665.74-55.086-157.03 6.0549-188 41.574-271.35 43.69z"
fill="url(#a)"
stroke-width=".56894"
id="path4980" />
</g>
</svg>

Before

Width:  |  Height:  |  Size: 2.2 KiB

View File

@ -1,73 +0,0 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
width="420mm"
height="20.822mm"
version="1.1"
viewBox="0 0 420 20.822"
id="svg7400"
sodipodi:docname="wave.invert.2.svg"
inkscape:version="1.2.1 (9c6d41e410, 2022-07-14)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview7402"
pagecolor="#505050"
bordercolor="#eeeeee"
borderopacity="1"
inkscape:showpageshadow="0"
inkscape:pageopacity="0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#505050"
inkscape:document-units="mm"
showgrid="false"
inkscape:zoom="0.86745536"
inkscape:cx="659.97633"
inkscape:cy="39.195101"
inkscape:window-width="1920"
inkscape:window-height="1006"
inkscape:window-x="0"
inkscape:window-y="42"
inkscape:window-maximized="1"
inkscape:current-layer="svg7400" />
<defs
id="defs7394">
<linearGradient
id="a"
x1="775"
x2="775"
y1="78.695"
y2="-.00018898"
gradientUnits="userSpaceOnUse">
<stop
stop-color="#fff"
stop-opacity=".25098"
offset="0"
id="stop7387"
style="stop-color:#745cfc;stop-opacity:0.25;" />
<stop
stop-color="#fff"
stop-opacity=".14902"
offset="0.22879"
id="stop7389"
style="stop-color:#745cfc;stop-opacity:0.15000001;" />
<stop
stop-color="#fff"
stop-opacity=".05098"
offset="1"
id="stop7391"
style="stop-color:#745cfc;stop-opacity:0.05;" />
</linearGradient>
</defs>
<g
transform="translate(-.83328 -158.95)"
id="g7398">
<path
transform="matrix(.26458 0 0 .26458 .83328 158.95)"
d="m606.63 28.502c-75.125 1.5646-148.96-25.511-224.09-24.496-81.65 1.1031-161.31 26.774-242.71 33.189-46.477 3.6626-69.397 2.5932-139.83 2.9902v38.51h1587.4v-38.51c-9.6396 0.39215-29.126 0.28262-43.672-0.2875-85.048-3.3332-169.58-19.372-254.68-18.308-79.795 0.99823-158.54 26.167-238.28 23.133-86.633-3.2952-169.52-43.758-256.21-44.724-63.351-0.70603-124.57 27.183-187.92 28.502z"
fill="url(#a)"
stroke-width=".56894"
id="path7396" />
</g>
</svg>

Before

Width:  |  Height:  |  Size: 2.4 KiB

View File

@ -1,13 +1,72 @@
<?xml version="1.0" encoding="UTF-8"?> <?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="420.23mm" height="14.465mm" version="1.1" viewBox="0 0 420.23 14.465" xmlns="http://www.w3.org/2000/svg"> <svg
<defs> width="420mm"
<linearGradient id="a" x1="787.57" x2="787.57" y1="4.8222" y2="78.695" gradientTransform="matrix(.26458 0 0 .11755 .83328 170.52)" gradientUnits="userSpaceOnUse"> height="20.822mm"
<stop stop-color="#202228" stop-opacity=".98039" offset="0"/> version="1.1"
<stop stop-color="#202228" stop-opacity=".9" offset=".59203"/> viewBox="0 0 420 20.822"
<stop stop-color="#202228" offset="1"/> id="svg4984"
</linearGradient> sodipodi:docname="wave.invert.1.svg"
</defs> inkscape:version="1.2.1 (9c6d41e410, 2022-07-14)"
<g transform="matrix(1 0 0 -1 -.83328 179.77)"> xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
<path d="m161.34 176.93c-22.053 0.24871-38.549-3.004-59.29-2.8795-20.74 0.12449-47.299 3.3092-64.216 3.9014-16.918 0.59231-18.361 0.30483-36.996 0.3515v1.4706h419.99v-1.4706l-11.555-0.0338c-31.382-0.0918-134.59-7.1872-176.14-6.4754-41.547 0.71177-49.741 4.8871-71.794 5.1358z" fill="url(#a)" stroke-width=".10034"/> xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
</g> xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview4986"
pagecolor="#505050"
bordercolor="#eeeeee"
borderopacity="1"
inkscape:showpageshadow="0"
inkscape:pageopacity="0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#505050"
inkscape:document-units="mm"
showgrid="false"
inkscape:zoom="0.79815972"
inkscape:cx="793.70079"
inkscape:cy="38.839344"
inkscape:window-width="1920"
inkscape:window-height="1006"
inkscape:window-x="0"
inkscape:window-y="42"
inkscape:window-maximized="1"
inkscape:current-layer="svg4984" />
<defs
id="defs4978">
<linearGradient
id="a"
x1="787.57"
x2="787.57"
y1="4.8222"
y2="78.695"
gradientUnits="userSpaceOnUse">
<stop
stop-color="#fff"
stop-opacity=".97647"
offset="0"
id="stop4971"
style="stop-color:#745cfc;stop-opacity:0.98000002;" />
<stop
stop-color="#fff"
stop-opacity=".89804"
offset="0.59202999"
id="stop4973"
style="stop-color:#745cfc;stop-opacity:0.89999998;" />
<stop
stop-color="#fff"
offset="1"
id="stop4975"
style="stop-color:#745cfc;stop-opacity:1;" />
</linearGradient>
</defs>
<g
transform="translate(-.83328 -158.95)"
id="g4982">
<path
transform="matrix(.26458 0 0 .26458 .83328 158.95)"
d="m606.63 54.502c-83.352 2.1157-145.7-25.555-224.09-24.496s-178.77 28.151-242.71 33.189c-63.941 5.0388-69.397 2.5932-139.83 2.9902v12.51h1587.4v-12.51l-43.672-0.2875c-118.61-0.78082-508.71-61.141-665.74-55.086-157.03 6.0549-188 41.574-271.35 43.69z"
fill="url(#a)"
stroke-width=".56894"
id="path4980" />
</g>
</svg> </svg>

Before

Width:  |  Height:  |  Size: 913 B

After

Width:  |  Height:  |  Size: 2.2 KiB

View File

@ -1,13 +1,73 @@
<?xml version="1.0" encoding="UTF-8"?> <?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="420.23mm" height="14.465mm" version="1.1" viewBox="0 0 420.23 14.465" xmlns="http://www.w3.org/2000/svg"> <svg
<defs> width="420mm"
<linearGradient id="a" x1="775" x2="775" y1="78.695" y2="-.00018898" gradientUnits="userSpaceOnUse"> height="20.822mm"
<stop stop-color="#202228" stop-opacity=".25098" offset="0"/> version="1.1"
<stop stop-color="#202228" stop-opacity=".14902" offset=".22879"/> viewBox="0 0 420 20.822"
<stop stop-color="#202228" stop-opacity=".05098" offset="1"/> id="svg7400"
</linearGradient> sodipodi:docname="wave.invert.2.svg"
</defs> inkscape:version="1.2.1 (9c6d41e410, 2022-07-14)"
<g transform="matrix(1 0 0 -.41891 -.71728 75.423)"> xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
<path transform="matrix(.26458 0 0 .26458 .83328 158.95)" d="m606.63 28.502c-75.125 1.5646-148.96-25.511-224.09-24.496-81.65 1.1031-161.31 26.774-242.71 33.189-46.477 3.6626-69.397 2.5932-139.83 2.9902v38.51h1587.4v-38.51c-9.6396 0.39215-29.126 0.28262-43.672-0.2875-85.048-3.3332-169.58-19.372-254.68-18.308-79.795 0.99823-158.54 26.167-238.28 23.133-86.633-3.2952-169.52-43.758-256.21-44.724-63.351-0.70603-124.57 27.183-187.92 28.502z" fill="url(#a)" stroke-width=".56894"/> xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
</g> xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview7402"
pagecolor="#505050"
bordercolor="#eeeeee"
borderopacity="1"
inkscape:showpageshadow="0"
inkscape:pageopacity="0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#505050"
inkscape:document-units="mm"
showgrid="false"
inkscape:zoom="0.86745536"
inkscape:cx="659.97633"
inkscape:cy="39.195101"
inkscape:window-width="1920"
inkscape:window-height="1006"
inkscape:window-x="0"
inkscape:window-y="42"
inkscape:window-maximized="1"
inkscape:current-layer="svg7400" />
<defs
id="defs7394">
<linearGradient
id="a"
x1="775"
x2="775"
y1="78.695"
y2="-.00018898"
gradientUnits="userSpaceOnUse">
<stop
stop-color="#fff"
stop-opacity=".25098"
offset="0"
id="stop7387"
style="stop-color:#745cfc;stop-opacity:0.25;" />
<stop
stop-color="#fff"
stop-opacity=".14902"
offset="0.22879"
id="stop7389"
style="stop-color:#745cfc;stop-opacity:0.15000001;" />
<stop
stop-color="#fff"
stop-opacity=".05098"
offset="1"
id="stop7391"
style="stop-color:#745cfc;stop-opacity:0.05;" />
</linearGradient>
</defs>
<g
transform="translate(-.83328 -158.95)"
id="g7398">
<path
transform="matrix(.26458 0 0 .26458 .83328 158.95)"
d="m606.63 28.502c-75.125 1.5646-148.96-25.511-224.09-24.496-81.65 1.1031-161.31 26.774-242.71 33.189-46.477 3.6626-69.397 2.5932-139.83 2.9902v38.51h1587.4v-38.51c-9.6396 0.39215-29.126 0.28262-43.672-0.2875-85.048-3.3332-169.58-19.372-254.68-18.308-79.795 0.99823-158.54 26.167-238.28 23.133-86.633-3.2952-169.52-43.758-256.21-44.724-63.351-0.70603-124.57 27.183-187.92 28.502z"
fill="url(#a)"
stroke-width=".56894"
id="path7396" />
</g>
</svg> </svg>

Before

Width:  |  Height:  |  Size: 1.0 KiB

After

Width:  |  Height:  |  Size: 2.4 KiB

View File

@ -1,112 +0,0 @@
<template>
<div id='footer'>
<div class='wave'></div>
<div class='wave w2'></div>
<footer>
<div class='copyright'>
2022 © xdrm-brackets
<span>Adrien Marquès</span>
</div>
<img class='logo' src='../assets/home/logo.svg'/>
<div class='contact'>
<span class='tel'>(+33) 06 69 05 19 10</span>
<span class='mail'>xdrm.dev@gmail.com</span>
<span class='addr'>Montauban, 82000</span>
</div>
</footer>
</div>
</template>
<script lang="ts">
import { Component, Vue } from 'vue-property-decorator';
@Component({
components: {},
})
export default class Footer extends Vue {
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="scss">
$width: 100vw;
$wave-height: 3rem;
$logo-size: 4em;
#footer {
display: block;
position: relative;
min-height: $wave-height;
background: lighten(#202228, 15%);
}
footer {
display: flex;
position: relative;
margin-top: $wave-height;
min-height: 20vh;
color: #bcc6ce;
flex-flow: row wrap;
justify-content: space-around;
align-items: center;
font-family: 'Fira Code';
.copyright, .contact {
font-size: 1.3em;
text-align: center;
span {
display: block;
}
}
.copyright {
user-select: none;
}
img {
width: $logo-size;
height: $logo-size;
}
}
@keyframes wave-x {
from{ background-position-x: 1px; }
to{ background-position-x: 100vw; }
}
.wave {
display: block;
position: absolute;
top: -1px;
left: 0;
width: 100vw;
height: $wave-height;
background-image: url('../assets/wave.invert.1.svg');
background-repeat: repeat-x;
background-position-y: 0;
background-size: auto 100%;
animation: 23s ease-in-out wave-x infinite alternate;
&.w2{
background-image: url('../assets/wave.invert.2.svg');
animation: 25s ease-in-out wave-x infinite alternate-reverse;
}
z-index: 200;
}
</style>

View File

@ -291,7 +291,7 @@ export default class Home extends Vue {
width: 100vw; width: 100vw;
height: $wave-height; height: $wave-height;
background-image: url('../assets/wave.1.svg'); background-image: url('../assets/wave.invert.1.svg');
background-repeat: repeat-x; background-repeat: repeat-x;
background-position-y: 101%; background-position-y: 101%;
background-size: auto 100%; background-size: auto 100%;
@ -299,7 +299,7 @@ export default class Home extends Vue {
animation: 18s ease-in-out wave-x infinite alternate; animation: 18s ease-in-out wave-x infinite alternate;
&.w2{ &.w2{
background-image: url('../assets/wave.2.svg'); background-image: url('../assets/wave.invert.2.svg');
animation: 20s ease-in-out wave-x infinite alternate-reverse; animation: 20s ease-in-out wave-x infinite alternate-reverse;
} }

View File

@ -147,8 +147,8 @@ export const Skills: tSkills = {
icon: 'skills/mariadb.svg', icon: 'skills/mariadb.svg',
tags: [tTag.Web, tTag.Storage], tags: [tTag.Web, tTag.Storage],
info: { info: {
[Locales.EN]: 'MySQL (now MariaDB) is the most known database management system to introduce SQL. 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.', [Locales.EN]: '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.',
[Locales.FR]: 'MySQL (maintenant MariaDB) est le système de base de données le plus répendu pour une introduction au SQL. J\'ai commencé à utiliser MySQL puis MariaDB en introduction à SQL, principalement quand j\'ai commencé à apprendre le développement web avec PHP. J\'utilise maintenant plutôt PostgreSQL car je le trouve plus robuste et performant.', [Locales.FR]: 'J\'ai commencé à utiliser MySQL puis MariaDB en introduction à SQL, principalement quand j\'ai commencé à apprendre le développement web avec PHP. J\'utilise maintenant plutôt PostgreSQL car je le trouve plus robuste et performant.',
} }
}, },
[tID.Postgres]: { [tID.Postgres]: {
@ -156,8 +156,8 @@ export const Skills: tSkills = {
icon: 'skills/postgres.svg', icon: 'skills/postgres.svg',
tags: [tTag.Web, tTag.Storage], tags: [tTag.Web, tTag.Storage],
info: { info: {
[Locales.EN]: 'A DBMS like MariaDB but with performance and consistency in mind. My main choice of dbms when using sql orfor relational databases. Had some experience with it mainly with go services with docker.', [Locales.EN]: 'My main choice of dbms when using sql orfor relational databases. Had some experience with it mainly with go services with docker.',
[Locales.FR]: 'Un DBMS comme MariaDB mais avec la performance et robustesse en plus. Mon choix de prédilection quand il s\'agit de DBMS sql ou de base relationnelle. Je l\'ai pas mal utilisé principalement pour des services go avec docker et docker-compose.', [Locales.FR]: 'Mon choix de prédilection quand il s\'agit de DBMS sql ou de base relationnelle. Je l\'ai pas mal utilisé principalement pour des services go avec docker et docker-compose.',
} }
}, },
[tID.Mongo]: { [tID.Mongo]: {
@ -175,8 +175,8 @@ export const Skills: tSkills = {
icon: 'skills/vue.svg', icon: 'skills/vue.svg',
tags: [tTag.Web, tTag.UI], tags: [tTag.Web, tTag.UI],
info: { info: {
[Locales.EN]: 'Web front-end framework that displays components directly from your data, with an extremely low cost. 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.', [Locales.EN]: '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.',
[Locales.FR]: 'Framework pour front-end web qui affiche des composants graphiques directement depuis les données à un coup relativement bas. J\'ai découvert Vue en 2016, et n\'ai jamais arrêté de l\'utiliser depuis tant pour mes projets perso que professionnels. Je vois Vue comme une meilleure alternative qu\'Angular qui, lui, fournit un cadre de travail strict qui manque de flexibilité aux équipes et projets.<br><br>Vue vous rend la responsabilité de structurer correctement vos projets, ce que j\'apprécie faire moi-même, je trouve que ça pousse à un meilleur workflow (ajusté à chaque projet).<br><br>C\'est moi choix de prédilection en tant que framework web pour faire du rendu.', [Locales.FR]: 'J\'ai découvert Vue en 2016, et n\'ai jamais arrêté de l\'utiliser depuis tant pour mes projets perso que professionnels. Je vois Vue comme une meilleure alternative qu\'Angular qui, lui, fournit un cadre de travail strict qui manque de flexibilité aux équipes et projets.<br><br>Vue vous rend la responsabilité de structurer correctement vos projets, ce que j\'apprécie faire moi-même, je trouve que ça pousse à un meilleur workflow (ajusté à chaque projet).<br><br>C\'est moi choix de prédilection en tant que framework web pour faire du rendu.',
} }
}, },
[tID.Angular]: { [tID.Angular]: {
@ -193,8 +193,8 @@ export const Skills: tSkills = {
icon: 'skills/parcel.svg', icon: 'skills/parcel.svg',
tags: [tTag.Web], tags: [tTag.Web],
info: { info: {
[Locales.EN]: 'Package bundler for the web, that aims to require no configuration. 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.', [Locales.EN]: '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.',
[Locales.FR]: 'Bundler (c.f. webpack) pour le web, qui vise à ne demander aucune configuration. Beaucoup utilisé pendant le Master, souvent pour des projets web avec un backend PHP. Permet de s\'affranchir de webpack, ce que je trouve plutôt bénéfique car trop complexe et souvent un point-of-failure majeur.<br><br>Je ne l\'ai pas utilisé depuis un moment mais je le garde en tête comme alternative sans prérequis pour les projets web.', [Locales.FR]: 'Beaucoup utilisé pendant le Master, souvent pour des projets web avec un backend PHP. Permet de s\'affranchir de webpack, ce que je trouve plutôt bénéfique car trop complexe et souvent un point-of-failure majeur.<br><br>Je ne l\'ai pas utilisé depuis un moment mais je le garde en tête comme alternative sans prérequis pour les projets web.',
} }
}, },
[tID.Cordova]: { [tID.Cordova]: {
@ -202,8 +202,8 @@ export const Skills: tSkills = {
icon: 'skills/cordova.svg', icon: 'skills/cordova.svg',
tags: [tTag.System, tTag.Web, tTag.Mobile], tags: [tTag.System, tTag.Web, tTag.Mobile],
info: { info: {
[Locales.EN]:'Library that transforms a single page application into a mobile or desktop application with no further programming. I\'ve used it often to transform SPA 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".', [Locales.EN]:'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".',
[Locales.FR]:'Programme permettant de transformer des sites web SPA (Single Page Application) en applications mobiles ou bureau sans avoir à toucher le code. Je l\'ai beaucoup utilisé pour transformer mes applis SPA en applications Android, iOS ou de bureau a moindre coût. Je n\'en ai pas eu besoin depuis un moment, il serait sûrement judicieux de m\'intéresser aux nouvelles alternatives plus à jour telles que Capacitor.', [Locales.FR]:'Je l\'ai beaucoup utilisé pour transformer mes applis SPA (Single Page Application) en applications Android, iOS ou de bureau a moindre coût. Je n\'en ai pas eu besoin depuis un moment, il serait sûrement judicieux de m\'intéresser aux nouvelles alternatives plus à jour telles que Capacitor.',
}, },
}, },
[tID.Webpack]: { [tID.Webpack]: {
@ -211,8 +211,8 @@ export const Skills: tSkills = {
icon: 'skills/webpack.svg', icon: 'skills/webpack.svg',
tags: [tTag.Web], tags: [tTag.Web],
info: { info: {
[Locales.EN]: 'The most known/used package bundler for the web ... I used it a lot because it is often required. But I hate that it is so complex that most users use it without understanding what is really does. I avoid it whenever possible, the issue can be transposed to node_modules and the whole node ecosystem.', [Locales.EN]: '... I used it a lot because it is often required. But I hate that it is so complex that most users use it without understanding what is really does. I avoid it whenever possible, the issue can be transposed to node_modules and the whole node ecosystem.',
[Locales.FR]: 'Le bundler pour du web le plus connu/utilisé ... J\'ai été forcé de beaucoup l\'utiliser mais jamais par choix ! C\'est un outil très puissant, mais je n\'aime pas que ce soit aussi complexe et que la plupart des utilisateurs (moi inclus) l\'utilisent sans vraiment comprendre ce que ça fait réellement. Je l\'évite dès que possible, cette problématique peut être transposée à node_modules et l\'écosystème node en général.', [Locales.FR]: '... J\'ai été forcé de beaucoup l\'utiliser mais jamais par choix ! C\'est un outil très puissant, mais je n\'aime pas que ce soit aussi complexe et que la plupart des utilisateurs (moi inclus) l\'utilisent sans vraiment comprendre ce que ça fait réellement. Je l\'évite dès que possible, cette problématique peut être transposée à node_modules et l\'écosystème node en général.',
} }
}, },
@ -221,8 +221,8 @@ export const Skills: tSkills = {
icon: null, icon: null,
tags: [tTag.Web], tags: [tTag.Web],
info: { info: {
[Locales.EN]: 'OpenGL API for the web ! I used it during my graduation years, the potential is great but I need to find a time to explore what\'s new.', [Locales.EN]: 'I used it during my graduation years, the potential is great but I need to find a time to explore what\'s new.',
[Locales.FR]: 'API OpenGL pour le web ! Utilisé à plusieurs reprises pendant mes études, il y a un gros potentiel mais il me faudrait trouver le temps d\'explorer les nouveautés et utilisation.', [Locales.FR]: 'Utilisé à plusieurs reprises pendant mes études, il y a un gros potentiel mais il me faudrait trouver le temps d\'explorer les nouveautés et utilisation.',
} }
}, },
[tID.AudioAPI]: { [tID.AudioAPI]: {
@ -230,8 +230,8 @@ export const Skills: tSkills = {
icon: null, icon: null,
tags: [tTag.Web], tags: [tTag.Web],
info: { info: {
[Locales.EN]: 'Audio API for the web ! 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.', [Locales.EN]: '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.',
[Locales.FR]: 'API Audio pour le web ! Je l\'ai principalement utilisée pour un projet clone de Discord (audio et video en streaming full-duplex) pendant mes études. J\'ai aussi beaucoup joué avec pour essayer d\'implémenter la transformée de Fourier afin de produire un visuel de lecture audio (c.f. Soundcloud) mais je n\'ai pas réussi à l\'époque.', [Locales.FR]: 'Je l\'ai notamment utilisée pour un projet clone de Discord (audio et video en streaming full-duplex) pendant mes études. J\'ai aussi beaucoup joué avec pour essayer d\'implémenter la transformée de Fourier afin de produire un visuel de lecture audio (c.f. Soundcloud) mais je n\'ai pas réussi à l\'époque.',
} }
}, },
[tID.Websocket]: { [tID.Websocket]: {
@ -239,8 +239,8 @@ export const Skills: tSkills = {
icon: null, icon: null,
tags: [tTag.Web, tTag.Network, tTag.IoT], tags: [tTag.Web, tTag.Network, tTag.IoT],
info: { info: {
[Locales.EN]: 'Communication protocol for the web that is full-duplex (both sides can send and receive simultaneously). I use them whenever possible to avoid the classical expensive polling.<br><br>I also created my own websocket client & server implementation in Go following nothing but the RFC for learning purposes.<br><br>I\'ve used, designed and implemented websocket communications among personal and professional projects.', [Locales.EN]: 'I use them whenever possible to avoid the classical expensive polling.<br><br>I also created my own websocket client & server implementation in Go following nothing but the RFC for learning purposes.<br><br>I\'ve used, designed and implemented websocket communications among personal and professional projects.',
[Locales.FR]: 'Protocole de communication pour le web full-duplex (les 2 côtés peuvent envoyer et recevoir en même temps). Je les utilise dès que possible plutôt que faire du polling coûteux pour rien.<br><br>J\'ai aussi créé ma propre implémentation de client et serveur en Go en suivant juste la RFC afin d\'avoir une meilleure appréhension du fonctionnement et des limites.<br><br>J\'ai eu plusieurs l\'occasion de concevoir et implémenter des systèmes de communications basés sur les websocket que ce soit pour des projets perso ou pro.', [Locales.FR]: 'Je les utilise dès que possible plutôt que faire du polling coûteux pour rien.<br><br>J\'ai aussi créé ma propre implémentation de client et serveur en Go en suivant juste la RFC afin d\'avoir une meilleure appréhension du fonctionnement et des limites.<br><br>J\'ai eu plusieurs l\'occasion de concevoir et implémenter des systèmes de communications basés sur les websocket que ce soit pour des projets perso ou pro.',
} }
}, },
@ -249,8 +249,8 @@ export const Skills: tSkills = {
icon: 'skills/docker.svg', icon: 'skills/docker.svg',
tags: [tTag.Web, tTag.System], tags: [tTag.Web, tTag.System],
info: { info: {
[Locales.EN]: 'Container system and ecosystem. 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.<br><br>I am learning docker a bit more every time I use it. It is often coupled with docker-compose in my projects.', [Locales.EN]: '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.<br><br>I am learning docker a bit more every time I use it. It is often coupled with docker-compose in my projects.',
[Locales.FR]: 'Système et écosystème de containerisation. J\'utilise docker assez régulièrement depuis des années. La plupart de mes projets en go en tirent parti car cela permet de construire des containers "multi-plateforme" sans que ça pèse plus lourd que l\'exécutable (multi-stage build from scratch). Docker aussi permet à mes devs en go de l\'isolation et un meilleur contrôle de l\'environnement.<br><br>J\'étends mes connaissances à chaque nouveau projet, je l\'utilise aussi beaucoup via docker-compose.', [Locales.FR]: 'J\'utilise docker assez régulièrement depuis des années. La plupart de mes projets en go en tirent parti car cela permet de construire des containers "multi-plateforme" sans que ç pèse plus lourd que l\'exécutable (multi-stage build from scratch). Docker aussi permet à mes devs en go de l\'isolation et un meilleur contrôle de l\'environnement.<br><br>J\'étends mes connaissances à chaque nouveau projet, je l\'utilise aussi beaucoup via docker-compose.',
} }
}, },
[tID.Bash]: { [tID.Bash]: {
@ -258,8 +258,8 @@ export const Skills: tSkills = {
icon: null, icon: null,
tags: [tTag.System], tags: [tTag.System],
info: { info: {
[Locales.EN]: 'GNU sh-compatible shell, featured in GNU/Linux distros. 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.', [Locales.EN]: '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.',
[Locales.FR]: 'Shell compatible <i>sh</i> fourni dans les OS GNU/Linux. Je suis tombé amoureux de GNU/Linux et son écosystème depuis un moment (à 14 ans) et je n\'ai pas déchanté depuis. Je suis souvent le "linux/bash guy" de l\'équipe.<br><br>J\'utilise le bash de manière déraisonnable pour automatiser tout ce que les humains peuvent faire, mais sans les erreurs, dans la plupart de mes workflows.', [Locales.FR]: 'Je suis tombé amoureux de GNU/Linux et son écosystème depuis un moment (à 14 ans) et je n\'ai pas déchanté depuis. Je suis souvent le "linux/bash guy" de l\'équipe.<br><br>J\'utilise le bash de manière déraisonnable pour automatiser tout ce que les humains peuvent faire, mais sans les erreurs, dans la plupart de mes workflows.',
} }
}, },
[tID.Linux]: { [tID.Linux]: {
@ -276,8 +276,8 @@ export const Skills: tSkills = {
icon: null, icon: null,
tags: [tTag.System], tags: [tTag.System],
info: { info: {
[Locales.EN]: 'Linux most advanced system and service manager, it coordinates all programs run in a Linux system. I had the chance to dive deep into systemd for the LogAuth project. I had to define a complex structure for some Raspberry Pi to be independent, featuring services, paths, sockets, dependencies, requirements, etc.<br><br>Often used but rarely understood, I like its flexibility and have used it in many projects upon the production deployment.', [Locales.EN]: 'I had the chance to dive deep into systemd for the LogAuth project. I had to define a complex structure for some Raspberry Pi to be independent, featuring services, paths, sockets, dependencies, requirements, etc.<br><br>Often used but rarely understood, I like its flexibility and have used it in many projects upon the production deployment.',
[Locales.FR]: 'Le gestionnaire de système et services le plus avancé pour Linux, il coordonne tous les programmes d\'un système Linux. J\'ai eu l\'occasion de plonger dans les tréfonds de systemd pour le projet LogAuth. J\'ai du concevoir et implémenter une structure complexe pour des Raspberry Pi "embarqués" en utilisant les services, paths, sockets, dépendences, ordres d\'éxécution, etc.<br><br>Souvent utilisé mais rarement compris, j\'apprécie sa puissance et sa flexibilité, je l\'ai souvent utilisé dans mes projets web pour le déploiement sur l\'environnement de production.', [Locales.FR]: 'J\'ai eu l\'occasion de plonger dans les tréfonds de systemd pour le projet LogAuth. J\'ai du concevoir et implémenter une structure complexe pour des Raspberry Pi "embarqués" en utilisant les services, paths, sockets, dépendences, ordres d\'éxécution, etc.<br><br>Souvent utilisé mais rarement compris, j\'apprécie sa puissance et sa flexibilité, je l\'ai souvent utilisé dans mes projets web pour le déploiement sur l\'environnement de production.',
}, },
}, },
[tID.Git]: { [tID.Git]: {
@ -285,8 +285,8 @@ export const Skills: tSkills = {
icon: 'skills/git.svg', icon: 'skills/git.svg',
tags: [tTag.System, tTag.Organization], tags: [tTag.System, tTag.Organization],
info: { info: {
[Locales.EN]: 'The standard distributed version control system for code management. What to say .. I use it all the time, even when writing this exact description.', [Locales.EN]: 'What to say about git ?!',
[Locales.FR]: 'Le système distribué de gestion de version par excellence. Que dire .. Je l\'utilise tout le temps, même pour écrire cette description.', [Locales.FR]: 'Quoi dire sur git ?!',
}, },
}, },
[tID.Rpm]: { [tID.Rpm]: {
@ -294,8 +294,8 @@ export const Skills: tSkills = {
icon: null, icon: null,
tags: [tTag.System], tags: [tTag.System],
info: { info: {
[Locales.EN]: 'The CentOS package manager. I used it once; I had to create a tool that generates RPM packages to provide installable modules for an embedded web project : the package contains web components (code, assets, navigation, pages) and backend services.', [Locales.EN]: '',
[Locales.FR]: 'Le gestionnaire de paquets de CentOS. J\'ai pu m\'y intéresser lors d\'un stage, j\'ai du créer un outil qui génère des paquets RPM afin de fournir des modules installables pour un projet web embarqué : les paquets contienent des composants web (du code, images, la navigation, des pages) et des services backend.', [Locales.FR]: '',
}, },
}, },
@ -359,17 +359,17 @@ export const Skills: tSkills = {
icon: null, icon: null,
tags: [tTag.Web, tTag.Network], tags: [tTag.Web, tTag.Network],
info: { info: {
[Locales.EN]: 'Web API that allows to download resources from a web page without reloading. It is now used almost everywhere, but at my "old days" it was more rare and we used to have reload between each page and static resources. Back then I created my well named "page-manager.js" library, it allows to load javascript, html, css, php, or even image files asynchronously and integrate them into your web page automatically. Now I still use it in web projects, but mainly through libraries.', [Locales.EN]: '',
[Locales.FR]: 'API web qui permet le téléchargement HTTP depuis une page sans avoir à la recharger. C\'est maintenant monnaie courante, mais dans mes "premiers temps" dans le web c\'était plus rare, il était plus courant de changer souvent de page et d\'avoir des ressources fixes. A cette époque j\'ai créé ma librairie magnifiquement nommée "page-manager.js". Elle permettait de charger des fichiers javascript, html, css, php ou même des images de manière asynchrone et les intégrait automatiquement dans la page web. Maintenant j\'utilise toujours Ajax, mais souvent à travers des librairies qui font le travail à ma place.', [Locales.FR]: '',
}, },
}, },
[tID.Ts]: { [tID.Ts]: {
link: 'https://www.typescriptlang.org/', link: 'https://www.typescript.org/',
icon: 'skills/ts.svg', icon: 'skills/ts.svg',
tags: [tTag.Language, tTag.Web, tTag.UI], tags: [tTag.Language, tTag.Web, tTag.UI],
info: { info: {
[Locales.EN]: 'Strongly typed language that (pre)compiles into javascript (javascript with types). It allows for your javascript codebase to be more consistent and maintainable. As these are 2 qualities that I strongly work to ensure, I use it for every javascript project and I\'ve never wrote "raw" javascript since then.', [Locales.EN]: '',
[Locales.FR]: 'Langage à typage fort qui se (pré)compile en javascript (javascript avec des types). Il permet d\'avoir un code plus robuste et maintenable. Ces 2 points sont parmi ceux que je trouve les plus importants dans mon travail, c\'est pourquoi je n\'ai plus écris de javascript "brut" (sans typescript) depuis que typescript existe.', [Locales.FR]: '',
}, },
}, },
[tID.C]: { [tID.C]: {
@ -541,8 +541,8 @@ export const Skills: tSkills = {
icon: 'skills/inkscape.svg', icon: 'skills/inkscape.svg',
tags: [tTag.UI, tTag.Web, tTag.Organization], tags: [tTag.UI, tTag.Web, tTag.Organization],
info: { info: {
[Locales.EN]: 'Free open-source software to create and edit vector files, a must-have for templating and creating good visual assets. I\'ve used it for a several years, I can finally say that I master Inkscape ! The numerous shortcuts and hidden features are no more a secret to me ;) I use it nearly every day be it for templating, or creating visual assets (logos, icons, images, backgrounds, animations, etc).', [Locales.EN]: '',
[Locales.FR]: 'Logiciel open-source de création et d\'édition de fichiers vectoriels, un indispensable pour la création de maquettes et d\'assets graphiques. Je l\'utilise maintenant depuis plusieurs années, je peux enfin dire que je maîtrise Inkscape ! Les nombreux raccourcis et fonctionnalités cachées ne sont plus un secret pour moi ;) Je l\'utilise quasiment tout les jours que ce soit pour les maquettages, ou encore la création des ressources graphiques (images, logos, animations, fonds, etc).', [Locales.FR]: '',
}, },
}, },
[tID.RnD]: { [tID.RnD]: {