Files
portfolio/fr/index.html
2024-02-21 22:13:48 +01:00

561 lines
42 KiB
HTML

<!DOCTYPE html>
<html lang="fr-FR">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/png" href="../assets/favicon.png">
<title>Alex Frequelin</title>
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="crossorigin"/>
<link rel="stylesheet" href="../styles/fork-awesome/css/fork-awesome.min.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/devicons/devicon@v2.16.0/devicon.min.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@mdi/font@7.2.96/css/materialdesignicons.min.css">
<link rel="preload" as="style" href="https://fonts.googleapis.com/css2?family=Poppins:wght@600&amp;family=Roboto:wght@300;400;500;700&amp;display=swap"/>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Poppins:wght@600&amp;family=Roboto:wght@300;400;500;700&amp;display=swap" media="print" onload="this.media='all'"/>
<noscript>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Poppins:wght@600&amp;family=Roboto:wght@300;400;500;700&amp;display=swap"/>
</noscript>
<!-- <link href="../styles/font-awesome/css/all.min.css?ver=1.2.0" rel="stylesheet"> -->
<link rel="stylesheet" href="../styles/fontawesome/css/all.min.css">
<link href="../styles/bootstrap.min.css?ver=1.2.0" rel="stylesheet">
<link href="../styles/aos.css?ver=1.2.0" rel="stylesheet">
<link href="../styles/main.css?ver=1.2.0" rel="stylesheet">
<noscript>
<style type="text/css">
[data-aos] {
opacity: 1 !important;
transform: translate(0) scale(1) !important;
}
</style>
</noscript>
</head>
<body id="top">
<header class="d-print-none">
<div class="container text-center text-lg-left">
<div class="py-3 clearfix">
<h1 class="site-title mb-0">Light'emerald</h1>
<div class="site-nav">
<nav role="navigation">
<ul class="nav justify-content-center">
<li class="nav-item"><a class="nav-link" href="https://www.reddit.com/user/light_emerald" title="Reddit">
<i class="fab fa-reddit"></i><span class="menu-title sr-only">Reddit</span></a>
</li>
<li class="nav-item"><a class="nav-link" href="https://discord.com/users/424216665673433088" title="Discord">
<i class="fa-brands fa-discord"></i><span class="menu-title sr-only">Discord</span></a>
</li>
<li class="nav-item"><a class="nav-link" href="https://git.justw.tf/Lightemerald" title="Gitea">
<i class="fa-brands fa-git"></i><span class="menu-title sr-only">Gitea</span></a>
</li>
<li class="nav-item"><a class="nav-link" href="https://github.com/lightemerald" title="Github">
<i class="fa-brands fa-github"></i><span class="menu-title sr-only">Github</span></a>
</li>
<li class="nav-item"><a class="nav-link" href="https://gitlab.com/Lightemerald" title="Gitlab">
<i class="fa-brands fa-gitlab"></i><span class="menu-title sr-only">Gitlab</span></a>
</li>
<li class="nav-item"><a class="nav-link" href="https://steamcommunity.com/id/lightemerald/" title="Steam">
<i class="fa-brands fa-steam"></i><span class="menu-title sr-only">Steam</span></a>
</li>
<li class="nav-item"><a class="nav-link" href="https://www.youtube.com/@lightemerald" title="Youtube">
<i class="fa-brands fa-youtube"></i><span class="menu-title sr-only">Youtube</span></a>
</li>
<li class="nav-item"><a class="nav-link" href="https://t.me/lightemerald" title="Telegram">
<i class="fa-brands fa-telegram"></i><span class="menu-title sr-only">Telegram</span></a>
</li>
<li class="nav-item"><a class="nav-link" href="https://twitter.com/emerald_dot_moe" title="Twitter">
<i class="fa-brands fa-twitter"></i><span class="menu-title sr-only">Twitter</span></a>
</li>
</ul>
</nav>
</div>
</div>
</div>
</header>
<div class="page-content">
<div class="container">
<div class="cover shadow-lg bg-div">
<div class="cover-bg p-3 p-lg-4 text-white">
<div class="row">
<div class="col-lg-4 col-md-5">
<div class="avatar hover-effect bg-avatar shadow-sm p-1"><img src="../assets/avatar.png" width="200" height="200"/></div>
</div>
<div class="col-lg-8 col-md-7 text-center text-md-start">
<h2 class="h1 mt-2" data-aos="fade-left" data-aos-delay="0">Alex Frequelin</h2>
<p data-aos="fade-left" data-aos-delay="100">Développeur Backend & Sysadmin</p>
<div class="d-print-none" data-aos="fade-left" data-aos-delay="200">
<a class="btn btn-light shadow-sm mt-1 me-1" href="https://cloud.aostia.net/s/5sG4gzrNc44jXEt" target="_blank">Télécharger CV</a>
<a class="btn btn-validate shadow-sm mt-1" href="https://cloud.aostia.net/s/jMNx3WmRS8H5DBs">Tableau Synthese</a>
<a class="btn btn-validate shadow-sm mt-1" href="mailto:light@emerald.moe">Me contacter</a>
</div>
</div>
</div>
</div>
<div class="about-section pt-4 px-3 px-lg-4 mt-1">
<div class="row">
<div class="col-md-6">
<h2 class="h3 mb-3">A Propos</h2>
<p>Depuis mon plus jeune âge, je suis attiré par le monde de l'informatique, passant d'innombrables heures à bricoler avec du matériel et des logiciels, et à perfectionner mes compétences en matière de codage.
<br><br>Ma passion pour la technologie et la programmation n'a fait que croître au fil des ans, et je me spécialise maintenant dans la construction de systèmes backend robustes et efficaces qui alimentent des applications complexes.
<br><br>Je suis constamment en train d'apprendre et d'explorer de nouvelles technologies, et je me consacre à la fourniture de solutions de haute qualité qui répondent aux besoins des entreprises modernes.
<br><br>Avec une compréhension approfondie des langages de programmation, des structures de données et des algorithmes, je m'engage à aider les organisations à tirer parti de la puissance de la technologie pour stimuler l'innovation et la croissance.</p>
</div>
<div class="col-md-5 offset-md-1">
<div class="row mt-2">
<div class="col-sm-4">
<div class="pb-1 underline">Prénom</div>
</div>
<div class="col-sm-8">
<div class="pb-1 text-secondary-color">Alex</div>
</div>
<div class="col-sm-4">
<div class="pb-1 underline">Nom</div>
</div>
<div class="col-sm-8">
<div class="pb-1 text-secondary-color">Frequelin Meyer</div>
</div>
<div class="col-sm-4 underline">
<div class="pb-1">Surnom</div>
</div>
<div class="col-sm-8">
<div class="pb-1 text-secondary-color">Light'emerald</div>
</div>
<div class="col-sm-4 underline">
<div class="pb-1">Age</div>
</div>
<div class="col-sm-8">
<div class="pb-1 text-secondary-color" id="age"></div>
<script>
const birthDate = new Date('2003-07-05');
const today = new Date();
const ageInMilliseconds = today - birthDate;
const ageInYears = Math.floor(ageInMilliseconds / 31556952000); // Approximate number of milliseconds in a year
document.getElementById('age').textContent = ageInYears;
</script>
</div>
<div class="col-sm-4">
<div class="pb-1 underline">Status</div>
</div>
<div class="col-sm-8">
<div class="pb-1 text-secondary-color">Étudiant</div>
</div>
<div class="col-sm-4">
<div class="pb-1 underline">Email</div>
</div>
<div class="col-sm-8">
<div class="pb-1 text-secondary-color">light@emerald.moe</div>
</div>
<div class="col-sm-4">
<div class="pb-1 underline">Téléphone</div>
</div>
<div class="col-sm-8">
<div class="pb-1 text-secondary-color">+33 6 59 44 37 75</div>
</div>
<div class="col-sm-4">
<div class="pb-1 underline">Localisation</div>
</div>
<div class="col-sm-8">
<div class="pb-1 text-secondary-color">France, Pantin</div>
</div>
</div>
</div>
</div>
</div>
<hr class="d-print-none"/>
<div class="skills-section px-3 px-lg-4">
<h2 class="h3 mb-3">Compétences Professionnel</h2>
<div class="row">
<div class="col-md-6">
<div class="mb-2"><span><i class="forka fa-nodejs"> </i> JavaScript & NodeJS & Bun.sh</span>
<div class="progress my-1">
<div class="progress-bar bg-alpha" role="progressbar" data-aos="zoom-in-right" data-aos-delay="100" data-aos-anchor=".skills-section" style="width: 95%" aria-valuenow="95" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
<div class="mb-2"><span><i class="forka fa-mysql"> </i> SQL (MySQL / MariaDB)</span>
<div class="progress my-1">
<div class="progress-bar bg-alpha" role="progressbar" data-aos="zoom-in-right" data-aos-delay="200" data-aos-anchor=".skills-section" style="width: 92%" aria-valuenow="92" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
<div class="mb-2"><span><i class="forka forka-php"> </i> PHP</span>
<div class="progress my-1">
<div class="progress-bar bg-alpha" role="progressbar" data-aos="zoom-in-right" data-aos-delay="300" data-aos-anchor=".skills-section" style="width: 88%" aria-valuenow="88" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
<div class="mb-2"><span><i class="devicon-cplusplus-plain"> </i> C/C++</span>
<div class="progress my-1">
<div class="progress-bar bg-alpha" role="progressbar" data-aos="zoom-in-right" data-aos-delay="300" data-aos-anchor=".skills-section" style="width: 85%" aria-valuenow="85" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
<div class="mb-2"><span><i class="forka forka-python"> </i> Python</span>
<div class="progress my-1">
<div class="progress-bar bg-alpha" role="progressbar" data-aos="zoom-in-right" data-aos-delay="300" data-aos-anchor=".skills-section" style="width: 80%" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
<div class="mb-2"><span><i class="fab fa-rust"> </i> RUST</span>
<div class="progress my-1">
<div class="progress-bar bg-alpha" role="progressbar" data-aos="zoom-in-right" data-aos-delay="300" data-aos-anchor=".skills-section" style="width: 50%" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="mb-2"><span><i class="fab fa-redhat"></i> Red Hat Entreprise Linux / <i class="fab fa-centos"></i> CentOS / <i class="fab fa-fedora"></i> Fedora</span>
<div class="progress my-1">
<div class="progress-bar bg-beta" role="progressbar" data-aos="zoom-in-right" data-aos-delay="400" data-aos-anchor=".skills-section" style="width: 95%" aria-valuenow="95" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
<div class="mb-2"><span><i class="forka fa-debian"></i> Debian / <i class="fab fa-ubuntu"></i> Ubuntu</span>
<div class="progress my-1">
<div class="progress-bar bg-beta" role="progressbar" data-aos="zoom-in-right" data-aos-delay="600" data-aos-anchor=".skills-section" style="width: 88%" aria-valuenow="88" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
<div class="mb-2"><span><span class="mdi mdi-arch"></span> Archlinux (I use Arch BTW)</span>
<div class="progress my-1">
<div class="progress-bar bg-beta" role="progressbar" data-aos="zoom-in-right" data-aos-delay="600" data-aos-anchor=".skills-section" style="width: 85%" aria-valuenow="85" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
<div class="mb-2"><span><i class="fa-brands fa-freebsd"></i> FreeBSD / <i class="devicon-pfsense-original"></i> PfSense</span>
<div class="progress my-1">
<div class="progress-bar bg-beta" role="progressbar" data-aos="zoom-in-right" data-aos-delay="600" data-aos-anchor=".skills-section" style="width: 80%" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
<div class="mb-2"><span><i class="forka fa-windows"></i> Windows Server</span>
<div class="progress my-1">
<div class="progress-bar bg-beta" role="progressbar" data-aos="zoom-in-right" data-aos-delay="600" data-aos-anchor=".skills-section" style="width: 75%" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
<!-- <div class="mb-2"><span><i class="devicon-gentoo-plain-wordmark"></i> Gentoo</span>
<div class="progress my-1">
<div class="progress-bar bg-beta" role="progressbar" data-aos="zoom-in-right" data-aos-delay="600" data-aos-anchor=".skills-section" style="width: 75%" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div> -->
</div>
</div>
</div>
<hr class="d-print-none"/>
<div class="work-experience-section px-3 px-lg-4">
<h2 class="h3 mb-4">Expérience Professionnel</h2>
<div class="timeline timeline-primary">
<div class="timeline-card timeline-card-primary card shadow-sm" data-aos="fade-left" data-aos-delay="0">
<div class="card-body">
<div class="h5 mb-1">SysAdmin <span class="text-muted h6">à Institut Paul Ricoeur</span></div>
<div class="text-muted text-small mb-2">2023 - 2024</div>
<div>Au cours de l'année écoulée, j'ai eu le privilège de travailler en tant que SysAdmin, un rôle qui m'a permis de jouer un rôle essentiel dans la mise en place et la gestion des systèmes d'information.
Mon travail a été caractérisé par la mise en place efficace de postes informatiques et de réseaux, ainsi que par le déploiement de scripts de masterisation afin de standardiser et de simplifier les processus d'installation et de configuration.
J'ai également consacré une part significative de mon temps à l'automatisation des tâches, en développant des scripts et des outils personnalisés pour faciliter les déploiements et les mises à jour système.
Grâce à ces efforts, j'ai contribué à améliorer l'efficacité opérationnelle tout en garantissant un environnement informatique fiable, sécurisé et performant pour nos utilisateurs.</div>
</div>
</div>
<div class="timeline-card timeline-card-primary card shadow-sm" data-aos="fade-left" data-aos-delay="0">
<div class="card-body">
<div class="h5 mb-1">Dévéloppeur Backend <span class="text-muted h6">à Enoway</span></div>
<div class="text-muted text-small mb-2">2023 - 2024</div>
<div>Enoway est un fournisseur de renom de services de montage vidéo spécialisé dans la production de vidéos visuellement étonnantes et percutantes à partir de matériel brut.
Grâce à une équipe de monteurs vidéo talentueux et à une technologie de pointe, Enoway propose une gamme de services de montage vidéo comprenant l'étalonnage, la conception sonore, l'animation graphique et les effets visuels.
Qu'il s'agisse d'une vidéo promotionnelle pour une entreprise ou d'un court métrage pour un festival, Enoway possède l'expertise et l'expérience nécessaires pour transformer n'importe quelle idée en une vidéo de haute qualité.
<br><br>En tant que développeur back-end pour Enoway, je joue un rôle crucial en veillant à ce que nos services de montage vidéo soient fournis de manière transparente et efficace.
Je travaille en étroite collaboration avec l'équipe pour développer et maintenir notre plateforme, qui permet à nos éditeurs vidéo de travailler en collaboration avec les clients et de livrer les projets dans les délais.
Je suis responsable de la gestion de la base de données, de la création d'API et de la mise en œuvre de fonctionnalités qui améliorent l'expérience de l'utilisateur.
Mon rôle consiste également à optimiser les performances de la plateforme, en veillant à ce qu'elle puisse gérer un grand nombre d'utilisateurs sans compromettre la vitesse et la fiabilité.
En tirant parti de mes compétences techniques et de mon expertise, j'aide Enoway à fournir à ses clients des services de montage vidéo de premier ordre qui dépassent leurs attentes.</div>
</div>
</div>
<div class="timeline-card timeline-card-primary card shadow-sm" data-aos="fade-left" data-aos-delay="50">
<div class="card-body">
<div class="h5 mb-1">Administrateur <span class="text-muted h6">à Nova Laboratory</span></div>
<div class="text-muted text-small mb-2">2021 - Present</div>
<div>Nova Laboratory est une entreprise spécialisée dans le développement d'applications multiplateformes, dont l'objectif est de fournir des solutions logicielles de haute qualité aux entreprises et aux particuliers.
Avec une équipe de développeurs et de designers expérimentés, Nova Laboratory crée des applications à la fois fonctionnelles et esthétiques, en utilisant les technologies et les langages de programmation les plus récents.
<br><br>En tant qu'administrateur chez Nova Laboratory, mon rôle était de fournir une orientation stratégique et de prendre des décisions importantes qui contribuent à la réussite de divers projets.
J'ai travaillé en étroite collaboration avec l'équipe de développement pour m'assurer que chaque projet était sur la bonne voie et que les délais étaient respectés.
En outre, j'étais chargé de superviser le travail des autres membres de l'équipe, en leur fournissant des conseils et un retour d'information pour les aider à améliorer leurs compétences et à atteindre leurs objectifs.
Grâce à mes contributions, j'ai aidé à créer des applications innovantes et efficaces qui répondaient aux besoins de nos clients et de nos utilisateurs.</div>
</div>
</div>
<div class="timeline-card timeline-card-primary card shadow-sm" data-aos="fade-left" data-aos-delay="100">
<div class="card-body">
<div class="h5 mb-1">Créateur & Dévéloppeur <span class="text-muted h6">de Chromatic.moe</span></div>
<div class="text-muted text-small mb-2">2019 - Present</div>
<div>Chromatic.moe est spécialisée dans le développement d'API et de bots à des fins diverses.
Mes responsabilités comprenaient la gestion de l'équipe de développement, la coordination des projets et la livraison des produits dans les délais impartis.
<br>J'ai également contribué au processus de développement en tant que développeur full-stack, en écrivant un code propre et efficace qui a permis à nos produits de fonctionner de manière transparente.
<br>Dans l'ensemble, mon travail chez Chromatic.moe m'a permis d'acquérir une expérience précieuse en matière de gestion de projet, de coordination d'équipe et de développement dans un environnement dynamique et rapide.</div>
</div>
</div>
<div class="timeline-card timeline-card-primary card shadow-sm" data-aos="fade-left" data-aos-delay="150">
<div class="card-body">
<div class="h5 mb-1">Créateur <span class="text-muted h6">de SofM</span></div>
<div class="text-muted text-small mb-2">2019 - 2021</div>
<div>En tant que fondateur, community manager, staff manager et développeur de SofM, une entreprise B2C spécialisée dans les services de jeux,
j'ai supervisé les opérations quotidiennes de l'entreprise et géré une équipe d'employés pour assurer une prestation de services efficace et sans encombre.
<br>J'étais également responsable du développement et de la maintenance du site web et de la présence en ligne de l'entreprise, tout en veillant à ce que l'expérience utilisateur soit transparente pour nos clients.
En outre, en tant que responsable de la communauté, je me suis activement engagée auprès des clients pour nouer des relations, recueillir leurs commentaires et répondre à leurs préoccupations.
<br>Mon rôle de développeur full-stack m'a permis de faire valoir mon expertise technique, en veillant à ce que nos systèmes soient à jour et efficaces, et à ce que l'entreprise reste compétitive dans le secteur.</div>
</div>
</div>
<div class="timeline-card timeline-card-primary card shadow-sm" data-aos="fade-left" data-aos-delay="200">
<div class="card-body">
<div class="h5 mb-1">Créateur & Dévéloppeur <span class="text-muted h6">de AOSTIA</span></div>
<div class="text-muted text-small mb-2">2018 - present</div>
<div>En tant que créateur et développeur full-stack chez Aostia, j'ai eu l'opportunité de travailler sur une plateforme qui fournit des services de messagerie et de cloud aux utilisateurs.
<br>Mon rôle consistait à travailler à la fois sur le front-end et le back-end de la plateforme, en utilisant une variété de technologies telles que PHP, HTML, CSS et JavaScript.
J'ai travaillé sur le développement de sites web performants, ainsi que sur l'implémentation de fonctionnalités robustes côté serveur pour les services de cloud et de messagerie d'Aostia.
Mon travail nécessitait une compréhension approfondie des meilleures pratiques de développement web, ainsi que la capacité de s'assurer que la plateforme d'Aostia fournissait une expérience transparente aux utilisateurs.
<br>Dans l'ensemble, mon travail à Aostia m'a permis d'acquérir une expérience inestimable dans le domaine du développement web, tant au niveau du front-end que du back-end,
et je suis fier d'avoir contribué à une plateforme qui offre des services essentiels aux utilisateurs.</div>
</div>
</div>
</div>
</div>
<hr class="d-print-none"/>
<div class="page-break"></div>
<div class="education-section px-3 px-lg-4 pb-4">
<h2 class="h3 mb-4">Éducation</h2>
<div class="timeline timeline-secondary">
<div class="timeline-card timeline-card-success card shadow-sm" data-aos="fade-left" data-aos-delay="0">
<div class="card-body">
<div class="h5 mb-1">BTS SIO SISR <span class="text-muted h6">à Lycée Robert Schumann</span></div>
<div class="text-muted text-small mb-2">2022 - 2024</div>
<div>Le BTS SIO (Services Informatiques aux Organisations) est un diplôme de niveau Bac+2 en France qui permet d'acquérir des compétences en informatique appliquée aux organisations.
Le BTS SIO comprend deux spécialités, à savoir le SISR (Solutions d'Infrastructure, Systèmes et Réseaux) et le SLAM (Solutions Logicielles et Applications Métiers).
<br><br>Le BTS SIO SISR porte sur la conception, la mise en œuvre et la gestion des infrastructures informatiques dans les organisations.
Les étudiants apprennent à installer et configurer des réseaux informatiques, à assurer la sécurité des systèmes d'information, à superviser l'administration des serveurs,
à gérer des bases de données et à proposer des solutions pour améliorer les performances des systèmes.
<br><br>Compétences acquises :<br>Cisco, Windows Server, Debian, Déploiement d'infrastructures réseau, Firewall.</div>
</div>
</div>
<div class="timeline-card timeline-card-success card shadow-sm" data-aos="fade-left" data-aos-delay="50">
<div class="card-body">
<div class="h5 mb-1">BUT Informatique <span class="text-muted h6">à IUT Paris Descartes</span></div>
<div class="text-muted text-small mb-2">2021 - 2022</div>
<div>Le BUT Informatique est une licence délivrée par les Instituts Universitaires de Technologie (IUT) en France.
<br><br>Ce programme de formation dure trois ans et permet aux étudiants d'acquérir des connaissances théoriques et pratiques en informatique.
Les étudiants suivent des cours de mathématiques, d'algorithmes, de programmation, de conception de systèmes d'information, de réseaux, de sécurité informatique, d'intelligence artificielle, de développement web, etc.
<br><br>Compétences acquises :<br>Project management, Java, Cryptography, C/C++, Marketing, Code optimization.</div>
</div>
</div>
<div class="timeline-card timeline-card-success card shadow-sm" data-aos="fade-left" data-aos-delay="100">
<div class="card-body">
<div class="h5 mb-1">BAC STI2d <span class="text-muted h6">à Lycée Jules Richard</span></div>
<div class="text-muted text-small mb-2">2018 - 2021</div>
<div>The BAC STI2d (Sciences and Technologies of Industry and Sustainable Development) is a technological baccalaureate program in France.
This program emphasizes scientific and technological subjects, as well as the consideration of environmental and sustainable development issues.
<br><br>Students in this program study subjects such as mathematics, physics, chemistry, engineering sciences, technology, computer science, and economic, social and human sciences.
<br><br>Compétences acquises :<br>Teamwork, Arduino, PHP, Mysql, Gantt, HTML5, CSS3, CATIA v5, Autodesk Inventor.</div>
</div>
</div>
</div>
</div>
<hr class="d-print-none">
<div class="contant-section px-3 px-lg-4 pb-4">
<h2 class="h3 text mb-3">Mes Projets</h2>
<div class="row g-0">
<div class="col-md-6 portfolio-bloc" data-aos="fade-right" data-aos-delay="100"><a href="https://aostia.com/" target="_blank"><img class="img-fluid" src="../assets/aostia.png" width="800" height="500"></a></div>
<div class="col-md-6 portfolio-bloc d-flex align-items-center aos-init aos-animate" data-aos="fade-left" data-aos-delay="100">
<div class="m-4 mt-md-2">
<p class="text-teal text-small">Full-Stack / PHP / HTML / CSS / JavaScript</p>
<h3>Aostia</h3>
<p class="t">Aostia is a platform that provides reliable and affordable cloud and email services for individuals and professionals.
<br>With Aostia, you can securely store and access your important files and documents from anywhere, and stay connected with friends and family through our easy-to-use email service.
<br>Our platform is designed with your privacy and convenience in mind, so you can enjoy the benefits of the cloud without sacrificing your personal data.
<br>Join Aostia today and experience hassle-free cloud and email services for your everyday life.</p>
</div>
</div>
</div>
<div class="row g-0 portfolio-reverse">
<div class="col-md-6 portfolio-bloc d-flex align-items-center aos-init" data-aos="fade-right" data-aos-delay="100">
<div class="m-4 mt-md-2 text-end">
<p class="text-teal text-small">Full-Stack / NodeJS / ExpressJS / HTML / CSS / JavaScript</p>
<h3>Emerald.moe</h3>
<p class="">Emerald.moe est une plateforme qui simplifie le processus d'intégration de nouvelles fonctionnalités pour les développeurs.
<br>Avec notre API facile à utiliser, les développeurs peuvent accéder aux données dont ils ont besoin en seulement quelques lignes de code, rendant leurs applications plus riches en fonctionnalités.
<br>Notre plateforme est conçue pour aider les développeurs à gagner du temps et de l'efficacité en fournissant une interface rationalisée et intuitive pour accéder et utiliser nos API.
<br>Que vous construisiez un bot, une application web ou autre chose, Emerald.moe facilite la réussite de votre projet.</p>
</div>
</div>
<div class="col-md-6 portfolio-bloc" data-aos="fade-left" data-aos-delay="100"><a href="https://api.emerald.moe/" target="_blank"><img class="img-fluid" src="../assets/emeraldapi.png" width="800" height="500"></a></div>
</div>
<div class="row g-0">
<div class="col-md-6 portfolio-bloc" data-aos="fade-right" data-aos-delay="100"><a href="https://emerald.bot/" target="_blank"><img class="img-fluid" src="../assets/emeraldbot.png" width="800" height="500"></a></div>
<div class="col-md-6 portfolio-bloc d-flex align-items-center aos-init" data-aos="fade-left" data-aos-delay="100">
<div class="m-4 mt-md-2">
<p class="text-teal text-small">Back-end / NodeJS / DiscordJS / MariaDB</p>
<h3>Emerald Bot</h3>
<p class="">Emerald est un puissant bot Discord polyvalent doté de fonctionnalités pour rendre la gestion et la communication de votre serveur plus efficaces.
Avec Emerald, vous pouvez facilement modérer votre serveur, créer des sondages, écouter de la musique et bien plus encore.
<br>Son interface intuitive et sa liste étendue de commandes en font le bot parfait tant pour les propriétaires de serveurs que pour les utilisateurs réguliers.
<br>Que vous ayez besoin d'aide pour la modération, le divertissement ou simplement pour vous amuser, Emerald est là pour vous aider.</p>
</div>
</div>
</div>
<div class="row g-0 portfolio-reverse">
<div class="col-md-6 portfolio-bloc d-flex align-items-center aos-init" data-aos="fade-right" data-aos-delay="100">
<div class="m-4 mt-md-2 text-end">
<p class="text-teal text-small">Full-Stack / Linux / NodeJS / ExpressJS / MariaDB / HTML / CSS / JavaScript</p>
<h3>Monika.Moe</h3>
<p class="">Monika.moe est une API avec une interface web qui permet de récupérer des images classées à partir du CDN Monika.moe. L'interface web offre également la possibilité de choisir l'API Reddit comme source secondaire.</p>
</div>
</div>
<div class="col-md-6 portfolio-bloc" data-aos="fade-left" data-aos-delay="100"><a href="https://monika.moe/" target="_blank"><img class="img-fluid" src="../assets/monika.png" width="800" height="500"></a></div>
</div>
<div class="row g-0">
<div class="col-md-6 portfolio-bloc" data-aos="fade-right" data-aos-delay="100"><a href="https://git.justw.tf/" target="_blank"><img class="img-fluid" src="../assets/justwtf.png" width="800" height="500"></a></div>
<div class="col-md-6 portfolio-bloc d-flex align-items-center aos-init" data-aos="fade-left" data-aos-delay="100">
<div class="m-4 mt-md-2">
<p class="text-teal text-small">Full-Stack / Linux / MariaDB / Proxmox</p>
<h3>Justw.tf</h3>
<p class="">Justw.tf est une plateforme d'hébergement pour les dépôts Git, hébergés sur un environnement Proxmox. Cette plateforme offre aux développeurs un moyen fiable et sécurisé de stocker et de gérer leurs projets Git, en garantissant une disponibilité maximale.</p>
</div>
</div>
</div>
<div class="row g-0 portfolio-reverse">
<div class="col-md-6 portfolio-bloc d-flex align-items-center aos-init" data-aos="fade-right" data-aos-delay="100">
<div class="m-4 mt-md-2">
<p class="text-teal text-small">Full-Stack / NodeJS / ExpressJS / MariaDB / HTML / CSS / JavaScript</p>
<h3>AirJet</h3>
<p class="">AirJet est un tableau de bord de gestion des vols conçu spécifiquement pour les compagnies aériennes. Il offre une interface intuitive et conviviale pour gérer tous les aspects des opérations de vol. Avec AirJet, les compagnies aériennes peuvent facilement planifier et suivre les vols, gérer les réservations des passagers, gérer les équipages et les ressources, et générer des rapports détaillés sur les performances des vols.</p>
</div>
</div>
<div class="col-md-6 portfolio-bloc" data-aos="fade-left" data-aos-delay="100"><a href="https://git.justw.tf/Lightemerald/airjet" target="_blank"><img class="img-fluid" src="../assets/airjet.png" width="800" height="500"></a></div>
</div>
<div class="row g-0">
<div class="col-md-6 portfolio-bloc" data-aos="fade-right" data-aos-delay="100"><a href="https://git.justw.tf/Lightemerald/chromanews" target="_blank"><img class="img-fluid" src="../assets/chromanews.webp" width="800" height="500"></a></div>
<div class="col-md-6 portfolio-bloc d-flex align-items-center aos-init" data-aos="fade-left" data-aos-delay="100">
<div class="m-4 mt-md-2 text-end">
<p class="text-teal text-small">Full-Stack / Linux / Bun.sh / JavaScript</p>
<h3>ChromaNews</h3>
<p class="">ChromaNews est un outil permettant de récupérer les meilleurs posts basés sur une liste de subs Reddit et de générer une page hors ligne (html) pour l'utilisateur. Il offre également la possibilité d'envoyer la page générée sur des plateformes telles que Discord et Telegram.</p>
</div>
</div>
</div>
<div class="row g-0 portfolio-reverse">
<div class="col-md-6 portfolio-bloc d-flex align-items-center aos-init" data-aos="fade-right" data-aos-delay="100">
<div class="m-4 mt-md-2">
<p class="text-teal text-small">Full-Stack / Linux / FreeBSD / Bun.sh / ExpressJS / MariaDB / Bash</p>
<h3>HSP-GDH / CTX</h3>
<p class="">Le projet de création d'un réseau pour l'hôpital a été mis en place en utilisant des technologies telles que des serveurs basés sur Linux (Proxmox) pour une virtualisation efficace.<br>
Des scripts d'automatisation ont été développés pour simplifier la gestion quotidienne du réseau, tandis que les backups sont effectués à partir de snapshots ZFS pour garantir une sauvegarde fiable des données.<br>
En parallèle, un site web/dashboard a été développé, incluant un API robuste pour permettre l'intégration avec d'autres systèmes.</p>
</div>
</div>
<div class="col-md-6 portfolio-bloc" data-aos="fade-left" data-aos-delay="100"><a href="https://git.justw.tf/Lightemerald/hsp-gdh" target="_blank"><img class="img-fluid" src="../assets/hsp-gdh.png" width="800" height="500"></a></div>
</div>
</div>
<hr class="d-print-none"/>
<div class="contant-section px-3 px-lg-4 pb-4">
<h2 class="h3 text mb-3">Veille Technologique</h2>
<p data-aos="fade-up-left" data-aos-delay="0">
La veille technologique est une démarche stratégique qui vise à anticiper les évolutions technologiques, à identifier les tendances émergentes et à rester à jour dans un domaine spécifique.
Dans le cadre de ma veille technologique, j'ai choisi de me focaliser sur les technologies émergentes du Web3 et les développements dans le domaine des cryptomonnaies.
</p><br>
<h4 class="h4 text mb-3">Méthode de Veille:</h4>
<p data-aos="fade-up-left" data-aos-delay="0">
Pour assurer une veille pertinente et ciblée, j'ai développé un outil personnalisé qui exploite le flux RSS de certaines communautés clés sur Reddit.
Les subreddits spécifiques inclus dans ma veille sont r/cryptocurrency, r/bitcoin, r/ethereum, et r/web3. Ces plateformes sont réputées pour être des hubs dynamiques où les passionnés et les experts partagent des informations de grande valeur sur les
dernières avancées technologiques, les tendances du marché et les discussions pointues.
</p><br>
<h4 class="h4 text mb-3">Outil de Veille:</h4>
<p data-aos="fade-up-left" data-aos-delay="0">
L'outil que j'ai conçu se connecte aux flux RSS de ces subreddits sélectionnés, filtrant ainsi les informations pertinentes liées au Web3 et aux cryptomonnaies.
La spécificité de cet outil réside dans sa capacité à trier les articles en fonction des flairs attribués par les utilisateurs aux posts.
Les flairs tels que "news articles" sont cruciaux pour distinguer les actualités importantes des discussions générales.
</p><br>
<h4 class="h4 text mb-3">Tri des Articles:</h4>
<p data-aos="fade-up-left" data-aos-delay="0">
Le tri des articles est une étape cruciale pour garantir la qualité de la veille. Dans le cadre de mon processus, je me concentre principalement sur les
posts étiquetés comme "news articles" par les utilisateurs, ce qui permet d'isoler les informations les plus pertinentes et les plus actuelles.
De plus, l'utilisation du nombre d'upvotes comme critère de sélection ajoute une couche de validation communautaire, mettant en avant les contenus les plus appréciés par la communauté.
</p><br>
<h4 class="h4 text mb-3">Intérêt du Sujet:</h4>
<p data-aos="fade-up-left" data-aos-delay="0">
Le Web3 représente la prochaine étape dans l'évolution d'Internet, avec des concepts tels que la décentralisation, la blockchain et la sécurité renforcée au cœur de son développement.
Parallèlement, les cryptomonnaies continuent de remodeler le paysage financier mondial. En combinant ces deux domaines, ma veille vise à capturer les innovations,
les défis et les opportunités qui émergent de cette convergence.
</p><br>
<p data-aos="fade-up-left" data-aos-delay="0">
En résumé, ma veille technologique sur le Web3 et les cryptomonnaies s'appuie sur un outil personnalisé exploitant les flux RSS de Reddit.
Le tri des articles se fait grâce aux flairs, avec une attention particulière portée aux posts étiquetés comme "news articles" et aux upvotes pour assurer la pertinence et
la fiabilité des informations recueillies. Cette approche me permet de rester constamment informé des développements les plus significatifs dans ces domaines en constante évolution.
</p><br>
<div class="row">
<div class="col">
<div class="mt-2">
<p data-aos="fade-up-left" data-aos-delay="50">Sujet: Web3 & Cryptocurrency</p>
<table id="myTable" class="table" data-aos="fade-up-left" data-aos-delay="100">
<thead>
<tr>
<th>Date</th>
<th>Nom Article</th>
<th>Résumé</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</div>
</div>
</div>
<hr class="d-print-none"/>
<div class="contant-section px-3 px-lg-4 pb-4">
<br>
<h2 class="h3 text mb-3 text-center">Merci</h2>
</div>
<a href="#" class="back-to-top"> <i class="fa-solid fa-chevron-up"> </i></a>
</div></div>
</div>
<footer class="pt-4 pb-4 text-muted text-center d-print-none">
<div class="container">
<div class="my-3">
<div class="footer-nav">
<nav role="navigation">
<ul class="nav justify-content-center">
<li class="nav-item"><a class="nav-link" href="https://www.reddit.com/user/light_emerald" title="Reddit">
<i class="fab fa-reddit"></i><span class="menu-title sr-only">Reddit</span></a>
</li>
<li class="nav-item"><a class="nav-link" href="https://discord.com/users/424216665673433088" title="Discord">
<i class="fa-brands fa-discord"></i><span class="menu-title sr-only">Discord</span></a>
</li>
<li class="nav-item"><a class="nav-link" href="https://git.justw.tf/Lightemerald" title="Gitea">
<i class="fa-brands fa-git"></i><span class="menu-title sr-only">Gitea</span></a>
</li>
<li class="nav-item"><a class="nav-link" href="https://github.com/lightemerald" title="Github">
<i class="fa-brands fa-github"></i><span class="menu-title sr-only">Github</span></a>
</li>
<li class="nav-item"><a class="nav-link" href="https://gitlab.com/Lightemerald" title="Gitlab">
<i class="fa-brands fa-gitlab"></i><span class="menu-title sr-only">Gitlab</span></a>
</li>
<li class="nav-item"><a class="nav-link" href="https://steamcommunity.com/id/lightemerald/" title="Steam">
<i class="fa-brands fa-steam"></i><span class="menu-title sr-only">Steam</span></a>
</li>
<li class="nav-item"><a class="nav-link" href="https://www.youtube.com/@lightemerald" title="Youtube">
<i class="fa-brands fa-youtube"></i><span class="menu-title sr-only">Youtube</span></a>
</li>
<li class="nav-item"><a class="nav-link" href="https://t.me/lightemerald" title="Telegram">
<i class="fa-brands fa-telegram"></i><span class="menu-title sr-only">Telegram</span></a>
</li>
<li class="nav-item"><a class="nav-link" href="https://twitter.com/emerald_dot_moe" title="Twitter">
<i class="fa-brands fa-twitter"></i><span class="menu-title sr-only">Twitter</span></a>
</li>
</ul>
</nav>
</div>
</div>
</div>
</footer>
<script src="../scripts/bootstrap.bundle.min.js?ver=1.2.0"></script>
<script src="../scripts/aos.js?ver=1.2.0"></script>
<script src="../scripts/main.js?ver=1.2.0"></script>
</body>
</html>