https://juliensellier.com/

ID da verificação
ef9118b2-aa07-474c-8075-d2bb669d9ed2Concluído
URL enviado:
https://juliensellier.com/
Relatório concluído:
LinkTexto
https://github.com/ejuju🔗Github
https://linkedin.com/in/jsellier🔗LinkedIn
https://github.com/ejuju/nubioNubio

Variáveis JavaScript · 3 encontrada(s)

NomeTipo
onbeforetoggleobject
documentPictureInPictureobject
onscrollendobject

Mensagens de registro do console · 0 encontrada(s)

HTML

<!DOCTYPE html><html lang="en"><head>
    <meta charset="utf-8">
    <link rel="icon" type="image/svg+xml" href="/favicon.svg">
    <link rel="mask-icon" href="/favicon.svg">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Julien Sellier</title>
    <meta name="description" content="Welcome to my public web profile!">
    <meta name="robots" content="index, follow">
    <meta name="author" content="Julien Sellier">

    <style>
        :root {
            --color-fg-0: hsl(0, 0%, 95%);
            --color-fg-1: hsl(0, 0%, 80%);
            --color-fg-2: hsl(0, 0%, 65%);
            --color-bg-0: hsl(0, 0%, 10%);
            --color-bg-1: hsl(0, 0%, 15%);
            --color-bg-2: hsl(0, 0%, 25%);
        }

        *,
        *::before,
        *::after {
            box-sizing: border-box;
            margin: 0;
            padding: 0;
        }

        html {
            height: 100%;
        }

        body {
            min-height: 100%;
            background-color: var(--color-bg-0);
            color: var(--color-fg-1);
            font-family: sans-serif;
        }

        main {
            padding: 16px;
            max-width: 600px;
            margin: 0 auto;
            display: flex;
            flex-direction: column;
            gap: 24px;
        }

        a {
            color: currentColor;
            font-weight: bold;
        }

        h1 {
            font-size: 150%;
            color: var(--color-fg-0);
        }

        h2 {
            color: var(--color-fg-1);
            font-size: 125%;
        }

        h3 {
            color: var(--color-fg-1);
            font-size: 100%;
        }

        ul {
            list-style-type: none;
        }

        hr {
            width: 100%;
            background-color: var(--color-bg-2);
            height: 1px;
            border: none;
        }

        section.card {
            padding: 24px 16px;
            background-color: var(--color-bg-1);
            border-radius: 8px;
            display: flex;
            flex-direction: column;
            gap: 24px;
        }

        ul.hlist {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
            list-style-type: none;
        }

        ul.hlist .tag {
            padding: 4px 8px;
            background-color: var(--color-bg-2);
        }

        ul.vlist {
            display: grid;
            gap: 8px;
        }

        a.button {
            background-color: var(--color-bg-2);
            padding: 8px 12px;
            border-radius: 8px;
            display: flex;
            align-items: center;
            gap: 8px;
            text-decoration: none;
        }

        .emoji {
            font-size: 110%;
            font-weight: bold;
            color: #ffcb4c;
        }

        .kv {
            display: grid;
            grid-template-columns: auto 1fr;
            gap: 8px;
            align-items: baseline;
        }

        .grid-8px {
            display: grid;
            gap: 8px;
        }

        .grid-12px {
            display: grid;
            gap: 12px;
        }

        .color-fg-2 {
            color: var(--color-fg-2);
        }

        #exports {
            display: flex;
            flex-wrap: wrap;
            flex-direction: row;
            gap: 12px;
        }

        footer {
            max-width: 600px;
            margin: 0 auto;
            padding: 32px 16px;
        }
    </style>
</head>

<body>
    <main>
        <section id="top" class="card">
            <h1>Julien Sellier</h1>
            <ul class="hlist">
                <li>
                    <a class="button" href="mailto:[email protected]">
                        <span class="emoji">@</span>[email protected]
                    </a>
                </li>
                
                <li>
                    <a target="_blank" class="button" href="/pgp.asc"><span class="emoji">🔑</span>PGP key</a>
                </li>
                
                <li>
                    <a target="_blank" rel="noopener noreferrer" class="button" href="https://github.com/ejuju">
                        <span class="emoji">🔗</span>Github
                    </a>
                </li>
                
                <li>
                    <a target="_blank" rel="noopener noreferrer" class="button" href="https://linkedin.com/in/jsellier">
                        <span class="emoji">🔗</span>LinkedIn
                    </a>
                </li>
                
                <li>
                    <a target="_blank" rel="noopener noreferrer" class="button" href="https://juliensellier.com">
                        <span class="emoji">🔗</span>Website
                    </a>
                </li>
                
            </ul>
        </section>

        <section id="experiences" class="card">
            <h2>Work experiences</h2>
            
            <hr>
            <section class="grid-12px">
                <h3>Backend Software Engineer at Scaleway</h3>
                <p>Working on DNS (and formerly transactional email).</p>
                <p class="color-fg-2">September 2023 - now (Paris, France)</p>
                <ul class="hlist"><li class="tag">DNS</li><li class="tag">Go</li><li class="tag">SMTP</li></ul>
            </section>
            
            <hr>
            <section class="grid-12px">
                <h3>Web Development Teacher at Orange, Code Phenix, and others</h3>
                <p>Taught web development to (former-) inmates and youth at risk.</p>
                <p class="color-fg-2">January 2023 - August 2023 (Paris, France)</p>
                <ul class="hlist"><li class="tag">HTML/CSS/JS</li><li class="tag">HTTP</li><li class="tag">DNS</li><li class="tag">Computer programming</li></ul>
            </section>
            
            <hr>
            <section class="grid-12px">
                <h3>Backend Software Engineer at Canal+</h3>
                <p>Worked on a new live video streaming solution based on DASH and HLS.</p>
                <p class="color-fg-2">January 2022 - October 2022 (Paris, France)</p>
                <ul class="hlist"><li class="tag">Go</li><li class="tag">Kubernetes</li><li class="tag">HLS</li><li class="tag">DASH</li></ul>
            </section>
            
            <hr>
            <section class="grid-12px">
                <h3>Website Developer (Freelance) at Record Eye, Cyclic Studio, and others</h3>
                <p>Designed and developed websites for various SMBs.</p>
                <p class="color-fg-2">September 2020 - January 2022 (Paris, France)</p>
                <ul class="hlist"><li class="tag">HTML/CSS/JS</li><li class="tag">TypeScript</li><li class="tag">Svelte</li><li class="tag">React</li><li class="tag">A11y</li></ul>
            </section>
            
            <hr>
            <section class="grid-12px">
                <h3>Chief Operations Officer at GreenOnline</h3>
                <p>Managed the expansion and operation of our web application in 5 new European countries.</p>
                <p class="color-fg-2">September 2018 - April 2020 (Amsterdam, Netherlands)</p>
                <ul class="hlist"><li class="tag">People management</li><li class="tag">Recruitment</li><li class="tag">Project management</li></ul>
            </section>
            
        </section>

        <section id="skills" class="card">
            <h2>Skills</h2>
            <hr>
            
            <section class="grid-8px">
                <h3>Software development</h3>
                <ul class="hlist"><li class="tag">Go</li><li class="tag">JavaScript</li><li class="tag">TypeScript</li></ul>
            </section>
            
            <section class="grid-8px">
                <h3>Web development</h3>
                <ul class="hlist"><li class="tag">HTML/CSS/JS</li><li class="tag">DNS</li><li class="tag">HTTP</li><li class="tag">SMTP</li><li class="tag">Svelte</li><li class="tag">A11y</li></ul>
            </section>
            
            <section class="grid-8px">
                <h3>DevOps</h3>
                <ul class="hlist"><li class="tag">CICD</li><li class="tag">Containerization</li><li class="tag">Ansible</li></ul>
            </section>
            
            <section class="grid-8px">
                <h3>Software engineering practices</h3>
                <ul class="hlist"><li class="tag">TDD</li><li class="tag">Pair (and mob) programming</li></ul>
            </section>
            
            <section class="grid-8px">
                <h3>Database</h3>
                <ul class="hlist"><li class="tag">SQL</li><li class="tag">Postgres</li><li class="tag">BoltDB</li></ul>
            </section>
            
        </section>

        <section id="languages" class="card">
            <h2>Languages</h2>
            <hr>
            
            <section class="grid-8px">
                <h3>French</h3>
                <p class="color-fg-2">Native</p>
            </section>
            
            <section class="grid-8px">
                <h3>English</h3>
                <p class="color-fg-2">Bilingual</p>
            </section>
            
            <section class="grid-8px">
                <h3>Spanish</h3>
                <p class="color-fg-2">Working proficiency</p>
            </section>
            
            <section class="grid-8px">
                <h3>Dutch</h3>
                <p class="color-fg-2">Basic understanding</p>
            </section>
            
        </section>

        <section id="education" class="card">
            <h2>Education</h2>
            <hr>
            
            <section class="grid-8px">
                <h3>Bachelor of Business Administration (Hospitality Management)</h3>
                <p class="color-fg-2">At HTH (Amsterdam) (September 2016 - February 2019)</p>
            </section>
            
        </section>

        <section id="interests" class="card">
            <h2>Interests</h2>
            <hr>
            <ul class="vlist">
                <li class="kv"><span class="emoji color-fg-2">+</span>Web-related protocols (HTTP, TLS, TCP, DNS, SMTP)</li><li class="kv"><span class="emoji color-fg-2">+</span>Esoteric programming languages (Forth, Brainf*ck and others)</li><li class="kv"><span class="emoji color-fg-2">+</span>Creative coding</li>
            </ul>
        </section>

        <section id="hobbies" class="card">
            <h2>Hobbies</h2>
            <hr>
            <ul class="vlist">
                <li class="kv"><span class="emoji color-fg-2">+</span>Coding</li><li class="kv"><span class="emoji color-fg-2">+</span>Playing guitar</li><li class="kv"><span class="emoji color-fg-2">+</span>Cooking (and eating)</li><li class="kv"><span class="emoji color-fg-2">+</span>Climbing (bouldering)</li>
            </ul>
        </section>

        <section id="exports" class="card">
            <a target="_blank" class="button" href="/profile.pdf">Open as <strong>PDF</strong></a>
            <a target="_blank" class="button" href="/profile.json">Open as <strong>JSON</strong></a>
            <a target="_blank" class="button" href="/profile.txt">Open as <strong>TXT</strong></a>
            <a target="_blank" class="button" href="/profile.md">Open as <strong>Markdown</strong></a>
        </section>
    </main>

    <footer>
        <p class="color-fg-2">Powered by <a href="https://github.com/ejuju/nubio">Nubio</a></p>
    </footer>



</body></html>