portfolio/index.html

<!DOCTYPE html>
<html lang="fr">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Pismont Quentin</title>
    <link rel="stylesheet" href="styles.css">
    <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&family=Roboto:wght@400;700&display=swap" rel="stylesheet">
</head>

<body>
    <header class="section">
        <img src="face.jpg" alt="Votre Photo" id="profile-photo" style="max-width: 150px; border-radius: 50%;">
        <h1>Pismont Quentin</h1>
        <p>Lead Developer</p>
        <button id="theme-toggle">Toggle Theme</button>
    </header>

    <main class="container">
        <section id="about-me" class="section">
            <h2>À propos de moi</h2>
            <p>Passionné et expérimenté en développement, je maîtrise NodeJS, React et TypeScript, avec une expertise solide en bases de données tels que MariaDB et PostgreSQL.</p>
            <p>J'ai également des compétences avancées en déploiement et intégration continue grâce à Docker, Docker Swarm, GitLab et Linux.</p>
            <p>Toujours avide d'apprendre et d'évoluer, je cherche activement des opportunités pour me plonger davantage dans le langage Rust, avec l'intention de m'y spécialiser à terme.</p>
            <p>Disponible pour de nouvelles opportunités stimulantes et enrichissantes.</p>
        </section>

        <section id="experiences" class="section">
            <h2>Expériences</h2>
            <div class="card">
                <h3>Lead Web Developer</h3>
                <h5>sept. 2019 - aujourd'hui</h5>
                <hr/>
                <p>GitLab · Docker Swarm · Node.js · React · Docker · PHP · JavaScript · MySQL · Git · Linux · TypeScript · Méthodes agiles · Scrum · Intégration continue</p>
            </div>
            <div class="card">
                <h3>Fullstack Web Developer</h3>
                <h5>août 2016 - sept. 2019</h5>
                <hr/>
                <p>Maintenance et création</p>
                <p>Node.js · React · PHP · JavaScript · MySQL · Git · Linux · TypeScript · Méthodes agiles · Scrum</p>
            </div>
        </section>

        <section id="skills" class="section">
            <h2>Compétences</h2>
            <ul>
                <li>NodeJS /w Typescript</li>
                <li>Bun</li>
                <li>React /w Typescript & ViteJS</li>
                <li>Linux</li>
                <li>MariaDB</li>
                <li>PostgreSQL</li>
                <li>Docker + Swarm</li>
                <li>CI/CD avec Gitlab et Gitea</li>
                <li>Rust</li>
            </ul>
        </section>

        <section id="projects" class="section">
            <h2>Projets</h2>
            <div class="card">
                <h3><a style="color: inherit" href="https://gitea.qpismont.fr/qpismont/imgproxy-rs">ImgProxy-rs</a></h3>
                <p>Ce projet consiste en un proxy d'images développé en Rust, utilisant la bibliothèque Tokio pour la gestion asynchrone des requêtes.</p>
                <p>Le proxy mettra en cache les images en mémoire, sur le disque dur ou sur Amazon S3 pour une récupération rapide ultérieure.</p>
                <p>De plus, il permettra d'effectuer des manipulations d'images telles que le zoom, le rognage, etc., en utilisant la puissante bibliothèque de traitement d'images, Libvips.</p>
            </div>
            <div class="card">
                <h3>Trepa</h3>
                <p>Ce projet vise à développer une plateforme de streaming vidéo moderne et évolutive en utilisant l'architecture de microservices.</p>
                <p>Chaque microservice sera développé en NodeJS avec NestJS comme framework backend et utilisera PostgreSQL pour le stockage des données.</p>
                <p>Les utilisateurs pourront uploader des vidéos via l'interface web en React et les regarder en streaming avec une expérience utilisateur fluide.</p>
            </div>
        </section>
    </main>

    <footer>
        <p>&copy; 2024 Pismont Quentin. Tous droits réservés.</p>
    </footer>

    <script>
        const toggleButton = document.getElementById('theme-toggle');
        const body = document.body;
    
        toggleButton.addEventListener('click', () => {
            body.classList.toggle('dark-mode');
        });
    
        if (localStorage.getItem('theme') === 'dark') {
            body.classList.add('dark-mode');
        }
    
        toggleButton.addEventListener('click', () => {
            if (body.classList.contains('dark-mode')) {
                localStorage.setItem('theme', 'dark');
            } else {
                localStorage.setItem('theme', 'light');
            }
        });
    </script>    

</body>

</html>
first :) 2023-08-08 19:46:11 +02:00			`<!DOCTYPE html>`
			`<html lang="fr">`

			`<head>`
			`<meta charset="UTF-8">`
			`<meta name="viewport" content="width=device-width, initial-scale=1.0">`
			`<title>Pismont Quentin</title>`
			`<link rel="stylesheet" href="styles.css">`
refonte 2024-05-27 19:34:44 +02:00			`<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&family=Roboto:wght@400;700&display=swap" rel="stylesheet">`
first :) 2023-08-08 19:46:11 +02:00			`</head>`

			`<body>`
refonte 2024-05-27 19:34:44 +02:00			`<header class="section">`
			`<img src="face.jpg" alt="Votre Photo" id="profile-photo" style="max-width: 150px; border-radius: 50%;">`
first :) 2023-08-08 19:46:11 +02:00			`<h1>Pismont Quentin</h1>`
			`<p>Lead Developer</p>`
refonte 2024-05-27 19:34:44 +02:00			`<button id="theme-toggle">Toggle Theme</button>`
			`</header>`
first :) 2023-08-08 19:46:11 +02:00
refonte 2024-05-27 19:34:44 +02:00			`<main class="container">`
			`<section id="about-me" class="section">`
			`<h2>À propos de moi</h2>`
			`<p>Passionné et expérimenté en développement, je maîtrise NodeJS, React et TypeScript, avec une expertise solide en bases de données tels que MariaDB et PostgreSQL.</p>`
			`<p>J'ai également des compétences avancées en déploiement et intégration continue grâce à Docker, Docker Swarm, GitLab et Linux.</p>`
			`<p>Toujours avide d'apprendre et d'évoluer, je cherche activement des opportunités pour me plonger davantage dans le langage Rust, avec l'intention de m'y spécialiser à terme.</p>`
			`<p>Disponible pour de nouvelles opportunités stimulantes et enrichissantes.</p>`
			`</section>`
first :) 2023-08-08 19:46:11 +02:00
refonte 2024-05-27 19:34:44 +02:00			`<section id="experiences" class="section">`
			`<h2>Expériences</h2>`
			`<div class="card">`
			`<h3>Lead Web Developer</h3>`
			`<h5>sept. 2019 - aujourd'hui</h5>`
			`<hr/>`
			`<p>GitLab · Docker Swarm · Node.js · React · Docker · PHP · JavaScript · MySQL · Git · Linux · TypeScript · Méthodes agiles · Scrum · Intégration continue</p>`
			`</div>`
			`<div class="card">`
			`<h3>Fullstack Web Developer</h3>`
			`<h5>août 2016 - sept. 2019</h5>`
			`<hr/>`
			`<p>Maintenance et création</p>`
			`<p>Node.js · React · PHP · JavaScript · MySQL · Git · Linux · TypeScript · Méthodes agiles · Scrum</p>`
			`</div>`
			`</section>`
first :) 2023-08-08 19:46:11 +02:00
refonte 2024-05-27 19:34:44 +02:00			`<section id="skills" class="section">`
			`<h2>Compétences</h2>`
			`<ul>`
			`<li>NodeJS /w Typescript</li>`
			`<li>Bun</li>`
			`<li>React /w Typescript & ViteJS</li>`
			`<li>Linux</li>`
			`<li>MariaDB</li>`
			`<li>PostgreSQL</li>`
			`<li>Docker + Swarm</li>`
			`<li>CI/CD avec Gitlab et Gitea</li>`
			`<li>Rust</li>`
			`</ul>`
			`</section>`

			`<section id="projects" class="section">`
			`<h2>Projets</h2>`
			`<div class="card">`
			`<h3><a style="color: inherit" href="https://gitea.qpismont.fr/qpismont/imgproxy-rs">ImgProxy-rs</a></h3>`
			`<p>Ce projet consiste en un proxy d'images développé en Rust, utilisant la bibliothèque Tokio pour la gestion asynchrone des requêtes.</p>`
			`<p>Le proxy mettra en cache les images en mémoire, sur le disque dur ou sur Amazon S3 pour une récupération rapide ultérieure.</p>`
			`<p>De plus, il permettra d'effectuer des manipulations d'images telles que le zoom, le rognage, etc., en utilisant la puissante bibliothèque de traitement d'images, Libvips.</p>`
			`</div>`
			`<div class="card">`
			`<h3>Trepa</h3>`
			`<p>Ce projet vise à développer une plateforme de streaming vidéo moderne et évolutive en utilisant l'architecture de microservices.</p>`
			`<p>Chaque microservice sera développé en NodeJS avec NestJS comme framework backend et utilisera PostgreSQL pour le stockage des données.</p>`
			`<p>Les utilisateurs pourront uploader des vidéos via l'interface web en React et les regarder en streaming avec une expérience utilisateur fluide.</p>`
			`</div>`
			`</section>`
			`</main>`

			`<footer>`
			`<p>© 2024 Pismont Quentin. Tous droits réservés.</p>`
			`</footer>`

			`<script>`
			`const toggleButton = document.getElementById('theme-toggle');`
			`const body = document.body;`

			`toggleButton.addEventListener('click', () => {`
			`body.classList.toggle('dark-mode');`
			`});`

			`if (localStorage.getItem('theme') === 'dark') {`
			`body.classList.add('dark-mode');`
			`}`

			`toggleButton.addEventListener('click', () => {`
			`if (body.classList.contains('dark-mode')) {`
			`localStorage.setItem('theme', 'dark');`
			`} else {`
			`localStorage.setItem('theme', 'light');`
			`}`
			`});`
			`</script>`
first :) 2023-08-08 19:46:11 +02:00
			`</body>`

			`</html>`