first commit

2025-09-11 17:37:03 +02:00
commit 8213752385
53 changed files with 11946 additions and 0 deletions
--- a/30
+++ b/30
@@ -0,0 +1,30 @@
+# Stage de build
+FROM node:20-alpine AS build
+
+WORKDIR /app
+
+# Installer pnpm
+RUN npm install -g pnpm
+
+# Copier package.json et lockfile pour cache pnpm
+COPY package.json pnpm-lock.yaml* ./
+
+RUN pnpm install --frozen-lockfile
+
+# Copier tout le projet
+COPY . .
+
+# Build Nuxt
+RUN pnpm build
+
+# Stage production
+FROM node:20-alpine
+
+WORKDIR /app
+
+COPY --from=build /app/.output .output
+COPY --from=build /app/package.json ./
+COPY --from=build /app/node_modules ./node_modules
+
+EXPOSE 3000
+CMD ["node", ".output/server/index.mjs"]
--- a/README.md
+++ b/README.md
@@ -0,0 +1,75 @@
+# Nuxt Minimal Starter
+
+Look at the [Nuxt documentation](https://nuxt.com/docs/getting-started/introduction) to learn more.
+
+## Setup
+
+Make sure to install dependencies:
+
+```bash
+# npm
+npm install
+
+# pnpm
+pnpm install
+
+# yarn
+yarn install
+
+# bun
+bun install
+```
+
+## Development Server
+
+Start the development server on `http://localhost:3000`:
+
+```bash
+# npm
+npm run dev
+
+# pnpm
+pnpm dev
+
+# yarn
+yarn dev
+
+# bun
+bun run dev
+```
+
+## Production
+
+Build the application for production:
+
+```bash
+# npm
+npm run build
+
+# pnpm
+pnpm build
+
+# yarn
+yarn build
+
+# bun
+bun run build
+```
+
+Locally preview production build:
+
+```bash
+# npm
+npm run preview
+
+# pnpm
+pnpm preview
+
+# yarn
+yarn preview
+
+# bun
+bun run preview
+```
+
+Check out the [deployment documentation](https://nuxt.com/docs/getting-started/deployment) for more information.
--- a/app/app.vue
+++ b/app/app.vue
@@ -0,0 +1,5 @@
+<template>
+  <div>
+    <NuxtPage />
+  </div>
+</template>
--- a/app/components/clientDialog.vue
+++ b/app/components/clientDialog.vue
@@ -0,0 +1,59 @@
+<template>
+  <TransitionRoot as="template" :show="open">
+    <Dialog class="relative z-10" @close="$emit('closeDialog')">
+      <TransitionChild as="template" enter="ease-out duration-300" enter-from="opacity-0" enter-to="opacity-100"
+        leave="ease-in duration-200" leave-from="opacity-100" leave-to="opacity-0">
+        <div class="fixed inset-0 bg-white dark:bg-black bg-opacity-90 transition-opacity" />
+      </TransitionChild>
+
+      <div class="fixed inset-0 z-10 w-screen overflow-y-auto">
+        <div class="flex min-h-full items-end justify-center p-4 text-center sm:items-center sm:p-0">
+          <TransitionChild as="template" enter="ease-out duration-300"
+            enter-from="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
+            enter-to="opacity-100 translate-y-0 sm:scale-100" leave="ease-in duration-200"
+            leave-from="opacity-100 translate-y-0 sm:scale-100"
+            leave-to="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95">
+            <DialogPanel
+              class="relative transform overflow-hidden rounded-lg bg-white text-left shadow-xl transition-all sm:my-8 sm:w-full sm:max-w-lg">
+              <div class="bg-white px-4 pb-4 pt-5 sm:p-6 sm:pb-4">
+                <div class="flex-col">
+                  <div v-if="props.project.image"
+                    class="bg-slate-200 p-8 mx-auto flex h-64 w-64 flex-shrink-0 items-center justify-center rounded-full">
+                    <img :src="'/projects/' + props.project.image" class="rounded-full">
+                  </div>
+                  <div class="mt-3 text-center sm:ml-4 sm:mt-0 sm:text-left">
+                    <DialogTitle as="h3" class="text-base font-semibold leading-6 text-gray-900">
+                      {{ project.company }}
+                    </DialogTitle>
+                    <div class="mt-2 text-xl [&>p]:mb-4">
+                      <p class="text-sm" v-for="desc in props.project.description">{{ desc }}</p>
+                      Role:
+                      <p class="text-sm text-yellow-600">{{ props.project.role }}</p>
+                      Outils:<br>
+                      <p class="text-sm text-yellow-600 inline-block pr-4" v-for="tool in props.project.tools">{{ tool
+                      }}</p>
+                    </div>
+                  </div>
+                </div>
+              </div>
+              <div class="bg-gray-50 px-4 py-3 sm:flex sm:flex-row-reverse sm:px-6">
+                <a v-if="props.project.url" :href="props.project.url" target="_blank"
+                  class="inline-flex w-full justify-center rounded-md bg-esyellow text-black px-3 py-2 text-sm font-semibold shadow-sm hover:bg-yellow-400 sm:ml-3 sm:w-auto ring-1">
+                  voir le site</a>
+                <button type="button"
+                  class="mt-3 inline-flex w-full justify-center rounded-md bg-white px-3 py-2 text-sm font-semibold text-gray-900 shadow-sm ring-inset ring-gray-300 hover:bg-gray-50 sm:mt-0 sm:w-auto"
+                  @click="$emit('closeDialog')" ref="cancelButtonRef">retour</button>
+              </div>
+            </DialogPanel>
+          </TransitionChild>
+        </div>
+      </div>
+    </Dialog>
+  </TransitionRoot>
+</template>
+
+<script setup>
+import { Dialog, DialogPanel, DialogTitle, TransitionChild, TransitionRoot } from '@headlessui/vue'
+
+const props = defineProps(['project', 'open'])
+</script>
--- a/app/components/project.vue
+++ b/app/components/project.vue
@@ -0,0 +1,24 @@
+<template>
+  <button
+    class=" bg-orange-200 m-4 p-4 rounded-full flex flex-shrink-0 items-center justify-center w-60 hover:text-xl hover:bg-orange-400 transition-all">
+    <img v-if="project.image && project.image !== ''" class="h-16 rounded-full" :src="'/projects/' + project.image"
+      :alt="project.company">
+    <p class="grow text-center text-w font-bold text-md" v-if="!project.hideTitle">
+      {{ project.company }}
+    </p>
+  </button>
+</template>
+
+<script setup lang="ts">
+interface project {
+  image: string,
+  hideTitle?: boolean,
+  url: string,
+  year: string,
+  company: string,
+  role: string,
+  description: string[],
+  tools: string[]
+}
+const props = defineProps(['project'])
+</script>
--- a/app/pages/index.vue
+++ b/app/pages/index.vue
@@ -0,0 +1,91 @@
+<template>
+  <div class="card-container flex flex-col justify-center items-center dark:bg-slate-900">
+    <section class="flex items-center p-8 max-w-screen-lg flex-col md:flex-row">
+      <div class="flex flex-col items-center">
+        <img src="/profil.jpg" class="max-w-96 p-2 rounded-full">
+        <div class="flex">
+          <img src="/tools/javascript.svg" title="javascript"
+            class="bg-white w-16 h-16 p-2 m-2  flex -mt-10 rounded-full -top-6 relative">
+          <img src="/tools/vue.svg" title="vue" class="bg-white w-16 h-16 p-2 m-2  flex -mt-10 rounded-full">
+          <img src="/tools/react.svg" title="pinia"
+            class="bg-white w-16 h-16 p-2 m-2  flex -mt-10 rounded-full relative">
+          <img src="/tools/tailwind.svg" title="tailwind"
+            class="bg-white w-16 h-16 p-2 m-2  flex -mt-10 rounded-full -top-6 relative">
+        </div>
+      </div>
+      <div class="ml-12 text-center">
+        <h1 class="mt-5 text-slate-800 font-extrabold text-5xl leading-relaxed text-left dark:text-slate-50">
+          Valère BRON
+        </h1>
+        <h2 class="text-yellow-700 dark:text-esyellow text-2xl leading-relaxed mb-8 font-mono text-left">
+          Développeur Front-end
+        </h2>
+        <p class="text-slate-800 dark:text-slate-100 text-lg font-mono text-left">
+          Développeur JavaScript Front-end avec une expertise en React & en Vue, je vous propose mes services
+          pour la réalisation de vos projets web.<br><br> Fort de 12 ans d'expérience sur divers projets, je maîtrise la
+          création
+          d’applications interactives et performantes, en respectant les meilleures pratiques de développement.
+        </p>
+        <a href="https://www.malt.fr/profile/valerebron"
+          class="text-black font-bold bg-esyellow p-6 ring-1 rounded-lg inline-block mt-12 hover:text-xl transition-all">
+          <img src="/malt.svg" class="inline pr-3">
+          Discutons de votre projet
+        </a>
+      </div>
+    </section>
+    <section class="w-screen flex flex-col items-center">
+      <p class="text-lg leading-relaxed font-mono p-8 max-w-screen-lg dark:text-white">
+        Les clients avec qui j'ai travaillé :
+      </p>
+      <div class="flex overflow-x-scroll w-screen">
+        <project @click="openProject(project)" v-if="folio && folio.projects" v-for="project in folio.projects"
+          :project="project">
+        </project>
+      </div>
+    </section>
+    <clientDialog :project="currentProject" :open="isDialogOpen" @closeDialog="closeProject()"></clientDialog>
+    <footer class="flex mt-8 [&>a>img]:h-9 [&>a>img]:w-9 [&>a>img]:p-1 dark:bg-slate-50 [&>a]:p-4 rounded-t-xl">
+      <a href="https://linkedin.com/in/valere-bron">
+        <img src="/linkedin.svg">
+      </a>
+      <a href="https://www.malt.fr/profile/valerebron">
+        <img src="/malt.svg">
+      </a>
+      <a href="https://github.com/valerebron">
+        <img src="/github.svg">
+      </a>
+    </footer>
+  </div>
+</template>
+
+<script setup lang="ts">
+const folio = ref(null)
+onMounted(async () => {
+  const res = await fetch('/folio.json')
+  folio.value = await res.json()
+})
+useHead({
+  title: 'valère BRON - Developpeur web',
+  meta: [
+    { name: 'description', content: 'Découvrez mon profil de développeur web et explorez mes compétences et expériences dans le domaine du développement web.' },
+    { name: 'keywords', content: 'développeur web, Valère BRON, Lyon, France, HTML, CSS, JavaScript, Typescript, Tailwind, React, Vue' }
+  ]
+})
+const isDialogOpen = ref(false)
+const currentProject = ref({})
+
+
+const openProject = function (project: project) {
+  currentProject.value = project
+  isDialogOpen.value = true
+}
+const closeProject = function () {
+  isDialogOpen.value = false
+}
+</script>
+
+<style>
+body {
+  overflow-x: hidden;
+}
+</style>
--- a/config.sh
+++ b/config.sh
@@ -0,0 +1,5 @@
+export REPO_NAME="valeredev"
+export DOMAIN="valere.dev"
+export PORT="7902"
+export PORT_EXPOSED="3000"
+export REDIRECTIONS="" # example.$MAIN_DOMAIN->/route $MAIN_DOMAIN->url /route->/another-route /route->url
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -0,0 +1,23 @@
+services:
+  valeredev:
+    image: local/valeredev
+    build:
+      context: .
+      dockerfile: Dockerfile
+    container_name: valeredev
+    restart: unless-stopped
+    working_dir: /app
+    ports:
+      - "${PORT}:${PORT_EXPOSED}"
+    volumes:
+      - "${MEDIA_DIR}:/mnt/media"
+    environment:
+      VIRTUAL_HOST: "${DOMAIN}"
+      LETSENCRYPT_HOST: "${DOMAIN}"
+      PUID: "${PUID}"
+      PGID: "${PGID}"
+
+networks:
+  default:
+    name: dockerweb
+    external: true
--- a/eslint.config.mjs
+++ b/eslint.config.mjs
@@ -0,0 +1,6 @@
+// @ts-check
+import withNuxt from './.nuxt/eslint.config.mjs'
+
+export default withNuxt(
+  // Your custom configs here
+)
--- a/logo.svg
+++ b/logo.svg
@@ -0,0 +1,48 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="25.31884mm"
+   height="16.87923mm"
+   viewBox="0 0 25.31884 16.87923"
+   version="1.1"
+   id="svg1"
+   inkscape:version="1.4.2 (ebf0e940d0, 2025-05-08)"
+   sodipodi:docname="logo.svg"
+   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="namedview1"
+     pagecolor="#505050"
+     bordercolor="#eeeeee"
+     borderopacity="1"
+     inkscape:showpageshadow="0"
+     inkscape:pageopacity="0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#505050"
+     inkscape:document-units="mm"
+     inkscape:zoom="0.79375"
+     inkscape:cx="396.85039"
+     inkscape:cy="561.25984"
+     inkscape:window-width="1920"
+     inkscape:window-height="1132"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer1" />
+  <defs
+     id="defs1" />
+  <g
+     inkscape:label="Layer 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <path
+       fill="#00dc82"
+       d="m 14.20412,16.87923 h 9.41203 c 0.29902,0 0.59263,-0.078 0.85156,-0.22609 a 1.6963627,1.6963627 0 0 0 0.62327,-0.61787 1.6761077,1.6761077 0 0 0 0.22786,-0.84404 1.6761077,1.6761077 0 0 0 -0.22863,-0.8438 L 18.76936,3.4964503 a 1.6963627,1.6963627 0 0 0 -0.62318,-0.61778 1.713242,1.713242 0 0 0 -0.85139,-0.22609 c -0.29884,0 -0.59246,0.0781 -0.8513,0.22618 a 1.6963627,1.6963627 0 0 0 -0.62318,0.61778 l -1.61619,2.77629 -3.16004,-5.42903003 A 1.6963627,1.6963627 0 0 0 10.42064,0.22602027 1.713242,1.713242 0 0 0 9.5691703,2.6800251e-7 c -0.29893,0 -0.59263,0.0780000019975 -0.85156,0.22610000199749 a 1.6963627,1.6963627 0 0 0 -0.62343,0.6177 L 0.22862027,14.34735 A 1.6752637,1.6752637 0 0 0 2.7493408e-7,15.19123 C -1.6972507e-4,15.48754 0.07850027,15.77862 0.22787027,16.03527 a 1.6963627,1.6963627 0 0 0 0.62326,0.61787 1.713242,1.713242 0 0 0 0.85156003,0.22609 h 5.90807 c 2.34089,0 4.0672197,-1.01908 5.2550097,-3.00728 l 2.8839,-4.9500097 1.5447,-2.64911 4.63588,7.9572897 h -6.18058 z m -6.6896597,-2.65181 -4.12309,-7.9e-4 6.1805,-10.6091097 3.0839197,5.30456 -2.06484,3.5454797 c -0.7888497,1.28999 -1.6849597,1.76 -3.0764897,1.76"
+       data-v-7503c9ae=""
+       id="path1"
+       style="stroke-width:0.0843963" />
+  </g>
+</svg>
--- a/nuxt.config.ts
+++ b/nuxt.config.ts
@@ -0,0 +1,6 @@
+// https://nuxt.com/docs/api/configuration/nuxt-config
+export default defineNuxtConfig({
+  compatibilityDate: '2025-07-15',
+  devtools: { enabled: true },
+  modules: ['@nuxt/eslint', '@nuxtjs/tailwindcss']
+})
--- a/package.json
+++ b/package.json
@@ -0,0 +1,26 @@
+{
+  "name": "nuxt-app",
+  "type": "module",
+  "private": true,
+  "scripts": {
+    "build": "nuxt build",
+    "dev": "nuxt dev",
+    "generate": "nuxt generate",
+    "preview": "nuxt preview",
+    "postinstall": "nuxt prepare"
+  },
+  "dependencies": {
+    "@headlessui/vue": "1.7.23",
+    "@heroicons/vue": "^2.2.0",
+    "@nuxt/eslint": "1.9.0",
+    "@nuxtjs/tailwindcss": "6.14.0",
+    "eslint": "^9.33.0",
+    "nuxt": "^4.0.3",
+    "vue": "^3.5.18",
+    "vue-router": "^4.5.1"
+  },
+  "engines": {
+    "pnpm": ">=10 <11"
+  },
+  "packageManager": "pnpm@10.14.0+sha512.ad27a79641b49c3e481a16a805baa71817a04bbe06a38d17e60e2eaee83f6a146c6a688125f5792e48dd5ba30e7da52a5cda4c3992b9ccf333f9ce223af84748"
+}
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
--- a/public/cv.html
+++ b/public/cv.html
@@ -0,0 +1,252 @@
+<html><head>
+            <link rel="preconnect" href="https://fonts.googleapis.com">
+            <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="">
+            <link href="https://fonts.googleapis.com/css2?family=Barlow:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&amp;display=swap" rel="stylesheet">
+            <link href="https://fonts.googleapis.com/css2?family=Roboto+Mono:ital,wght@0,100..700;1,100..700&amp;display=swap" rel="stylesheet">                   
+            <link href="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/themes/prism-tomorrow.min.css" rel="stylesheet">
+            <style>
+                /* Default styles */
+                pre {
+                    background: #2d2d2d;
+                    border-radius: 4px;
+                    margin: 0.5em 0;
+                }
+                code {
+                    font-family: 'Fira Code', Consolas, Monaco, monospace;
+                }
+                /* Custom CSS */
+                /* ====== Markdown PDF Pro Theme ====== */
+
+@page {
+  margin: 25mm 20mm;
+  margin-top: 0mm;
+}
+
+body {
+  font-family: "Segoe UI", "Helvetica Neue", Arial, sans-serif;
+  font-size: 11pt;
+  line-height: 1.6;
+  color: #333;
+  background: white;
+  max-width: 800px;
+  margin: auto;
+  padding: 60px;
+}
+
+/* Headings */
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  font-family: "Segoe UI Semibold", "Helvetica Neue", Arial, sans-serif;
+  font-weight: 600;
+  margin-top: 2em;
+  margin-bottom: 0.6em;
+  line-height: 1.3;
+  color: #222;
+}
+
+h1 {
+  font-size: 24pt;
+  border-bottom: 2px solid #00dc82;
+  /* accent color */
+  padding-bottom: 0.3em;
+  margin-top: 0;
+}
+
+h2 {
+  font-size: 18pt;
+  border-left: 4px solid #00dc82;
+  padding-left: 0.5em;
+}
+
+h3 {
+  font-size: 14pt;
+  color: #444;
+}
+
+h4,
+h5,
+h6 {
+  font-size: 12pt;
+  color: #555;
+}
+
+/* Paragraphs */
+p {
+  margin: 0.5em 0;
+  text-align: justify;
+}
+
+/* Links */
+a {
+  color: #1e7fce;
+  text-decoration: none;
+}
+
+a:hover {
+  text-decoration: underline;
+}
+
+/* Lists */
+ul,
+ol {
+  margin: 0.5em 0 0.5em 2em;
+}
+
+li {
+  margin-bottom: 0.3em;
+}
+
+/* Blockquote */
+blockquote {
+  border-left: 4px solid #0078D7;
+  margin: 1em 0;
+  padding: 0.5em 1em;
+  color: #555;
+  background: #f9f9f9;
+  font-style: italic;
+}
+
+/* Code */
+code {
+  font-family: "Fira Code", "Consolas", monospace;
+  background: #f4f4f4;
+  padding: 0.2em 0.4em;
+  border-radius: 4px;
+  font-size: 0.95em;
+}
+
+pre {
+  background: #1e1e1e;
+  color: #dcdcdc;
+  padding: 1em;
+  border-radius: 6px;
+  overflow-x: auto;
+  font-size: 0.9em;
+  line-height: 1.4;
+}
+
+/* Tables */
+table {
+  border-collapse: collapse;
+  margin: 1em 0;
+  width: 100%;
+  font-size: 0.95em;
+}
+
+th,
+td {
+  border: 1px solid #ccc;
+  padding: 0.6em 0.8em;
+  text-align: left;
+}
+
+th {
+  background: #f0f0f0;
+  font-weight: 600;
+}
+
+tr:nth-child(even) td {
+  background: #fafafa;
+}
+
+/* Horizontal rule */
+hr {
+  border: none;
+  border-top: 2px solid #eee;
+  margin: 2em 0;
+}
+            </style>
+            <script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/prism.min.js"></script>
+            <script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/components/prism-python.min.js"></script>
+            <script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/components/prism-javascript.min.js"></script>
+            <script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/components/prism-bash.min.js"></script>
+            <script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/components/prism-sql.min.js"></script>
+            <script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/components/prism-go.min.js"></script>
+        </head>
+        <body>
+            <h1>Valère BRON</h1>
+<p><strong>Développeur Web | Vue.js, Nuxt, Node.js, Docker</strong></p>
+<p>📞 <a href="tel:+33681847737">06 81 84 77 37</a><br>📧 <a href="mailto:contact@valere.dev">contact@valere.dev</a><br>🔗 <a href="https://www.linkedin.com/in/valere-bron/">LinkedIn</a><br>💻 <a href="https://github.com/valerebron">GitHub</a></p>
+<hr>
+<h2>💡 Compétences</h2>
+<ul>
+<li><strong>Front-end :</strong> Vue 2/3, Nuxt, Pinia, React.js, Tailwind, SCSS, Storybook</li>
+<li><strong>Back-end :</strong> Node.js, NestJS, GraphQL, Prisma, REST API</li>
+<li><strong>DevOps &amp; CI/CD :</strong> Docker, Docker Compose, GitLab, Drone, Gitea</li>
+<li><strong>Outils :</strong> Vite, ITCSS, Atomic Design</li>
+</ul>
+<hr>
+<h2>🏢 Expériences</h2>
+<h3>2025 – Groupama | Développeur Vue.js</h3>
+<ul>
+<li>Développement &amp; maintenance d’applications Vue 3</li>
+<li>Participation aux choix techniques et aux orientations produit</li>
+<li>Collaboration avec l’équipe pour assurer l’intégration des fonctionnalités</li>
+<li>Sécurisation des applications et suivi des bonnes pratiques</li>
+<li>Mob et pair programming, présentation du backlog et des priorités à l’équipe</li>
+</ul>
+<h3>2024 – Fitarena | Développeur Vue.js</h3>
+<ul>
+<li>Développement d’un agenda interactif en Vue 3 &amp; Pinia</li>
+<li>Refactorisation du code existant et création de stores et services API</li>
+<li>Développement de composants UI spécifiques</li>
+</ul>
+<h3>2021–2023 – Potager City | Développeur Vue.js</h3>
+<ul>
+<li>Développement front-end et optimisation SEO</li>
+<li>Coordination avec les équipes produit pour améliorer l’expérience utilisateur</li>
+<li>Mise en place de tests techniques et contrôle qualité du code</li>
+</ul>
+<h3>2020–2021 – MassiveMusic | Développeur Vue/Typescript/Node/Prisma</h3>
+<ul>
+<li>Composants Vue avec Atomic Design</li>
+<li>Intégration SCSS normalisée (ITCSS)</li>
+<li>API GraphQL &amp; Typescript et modélisation Prisma</li>
+<li>CI/CD via GitLab et Docker Compose</li>
+</ul>
+<h3>2020–2021 – Analytics | Développeur Node.js</h3>
+<ul>
+<li>Tracker client et API GraphQL &amp; Typescript</li>
+<li>CI/CD et modélisation Prisma</li>
+</ul>
+<h3>2020 – Studiolab | Développeur React.js</h3>
+<ul>
+<li>Développement de composants avec React &amp; Ant Design</li>
+</ul>
+<h3>2019 – Euronews | Développeur Vue.js</h3>
+<ul>
+<li>Intégration SCSS normalisée (ITCSS) pour la v3 du site</li>
+</ul>
+<h3>2018 – Tyredating | Développeur Vue.js</h3>
+<ul>
+<li>Développement de composants Vue pour CMS from scratch</li>
+<li>Intégration responsive</li>
+</ul>
+<p><em>(… autres expériences antérieures disponibles sur demande)</em></p>
+<hr>
+<h2>🎓 Diplômes</h2>
+<ul>
+<li>2011 – Licence Ingénierie de l’Internet</li>
+<li>2010 – BTS Communication et Industries Graphiques</li>
+</ul>
+<hr>
+<h2>🚀 Projets personnels</h2>
+<ul>
+<li>Paquets Node.js en Typescript</li>
+<li>Web extensions</li>
+<li>Microservices Docker</li>
+<li>Surcouche docker-compose en bash : <a href="https://docker-web.valere.dev">docker-web.valere.dev</a></li>
+<li>Kit full-stack Nuxt : <a href="https://sidebase.io">sidebase.io</a></li>
+</ul>
+<p>Ces projets renforcent mes compétences en administration système, CI/CD et expérimentation front/back.</p>
+
+            <script>
+                Prism.highlightAll();
+            </script>
+        
+        
+    </body></html>
--- a/public/cv.md
+++ b/public/cv.md
@@ -0,0 +1,87 @@
+# Valère BRON
+
+**Développeur Web | Vue.js, Nuxt, Node.js, Docker**
+
+📞 [06 81 84 77 37](tel:+33681847737)  
+📧 [contact@valere.dev](mailto:contact@valere.dev)  
+🔗 [LinkedIn](https://www.linkedin.com/in/valere-bron/)  
+💻 [GitHub](https://github.com/valerebron)
+
+---
+
+## 💡 Compétences
+
+- **Front-end :** Vue 2/3, Nuxt, Pinia, React.js, Tailwind, SCSS, Storybook
+- **Back-end :** Node.js, NestJS, GraphQL, Prisma, REST API
+- **DevOps & CI/CD :** Docker, Docker Compose, GitLab, Drone, Gitea
+- **Outils :** Vite, ITCSS, Atomic Design
+
+---
+
+## 🏢 Expériences
+
+### 2025 – Groupama | Développeur Vue.js
+
+- Développement & maintenance d’applications Vue 3
+- Participation aux choix techniques et aux orientations produit
+- Collaboration avec l’équipe pour assurer l’intégration des fonctionnalités
+- Sécurisation des applications et suivi des bonnes pratiques
+- Mob et pair programming, présentation du backlog et des priorités à l’équipe
+
+### 2024 – Fitarena | Développeur Vue.js
+
+- Développement d’un agenda interactif en Vue 3 & Pinia
+- Refactorisation du code existant et création de stores et services API
+- Développement de composants UI spécifiques
+
+### 2021–2023 – Potager City | Développeur Vue.js
+
+- Développement front-end et optimisation SEO
+- Coordination avec les équipes produit pour améliorer l’expérience utilisateur
+- Mise en place de tests techniques et contrôle qualité du code
+
+### 2020–2021 – MassiveMusic | Développeur Vue/Typescript/Node/Prisma
+
+- Composants Vue avec Atomic Design
+- Intégration SCSS normalisée (ITCSS)
+- API GraphQL & Typescript et modélisation Prisma
+- CI/CD via GitLab et Docker Compose
+
+### 2020–2021 – Analytics | Développeur Node.js
+
+- Tracker client et API GraphQL & Typescript
+- CI/CD et modélisation Prisma
+
+### 2020 – Studiolab | Développeur React.js
+
+- Développement de composants avec React & Ant Design
+
+### 2019 – Euronews | Développeur Vue.js
+
+- Intégration SCSS normalisée (ITCSS) pour la v3 du site
+
+### 2018 – Tyredating | Développeur Vue.js
+
+- Développement de composants Vue pour CMS from scratch
+- Intégration responsive
+
+_(… autres expériences antérieures disponibles sur demande)_
+
+---
+
+## 🎓 Diplômes
+
+- 2011 – Licence Ingénierie de l’Internet
+- 2010 – BTS Communication et Industries Graphiques
+
+---
+
+## 🚀 Projets personnels
+
+- Paquets Node.js en Typescript
+- Web extensions
+- Microservices Docker
+- Surcouche docker-compose en bash : [docker-web.valere.dev](https://docker-web.valere.dev)
+- Kit full-stack Nuxt : [sidebase.io](https://sidebase.io)
+
+Ces projets renforcent mes compétences en administration système, CI/CD et expérimentation front/back.
--- a/public/cv.pdf
+++ b/public/cv.pdf
--- a/public/desk.jpg
+++ b/public/desk.jpg
--- a/public/favicon.ico
+++ b/public/favicon.ico
--- a/public/folio.json
+++ b/public/folio.json
@@ -0,0 +1,182 @@
+{
+  "stack": [
+    "React", "Tailwind", "Nuxt", "Prisma", "Node", "Nest", "Docker", "Drone", "Gitea", "Gitlab"
+  ],
+  "projects": [
+    {
+      "image": "groupama.svg",
+      "url": "https://www.g2s-groupama-technologies.fr/",
+      "year": "2025",
+      "company": "Groupama Support & Services",
+      "role": "Développeur Vue",
+      "description": [
+        "Développement & maintenance d’applications Vue 3",
+        "Participation aux choix techniques et aux orientations produit",
+        "Collaboration avec l’équipe pour assurer l’intégration des fonctionnalités",
+        "Sécurisation des applications et suivi des bonnes pratiques",
+        "Mob et pair programming"
+      ],
+      "tools": ["Vue 3", "Pinia", "Vite", "single SPA"]
+    },
+    {
+      "image": "fitarena.png",
+      "url": "https://www.fit-arena.fr/",
+      "year": "2024",
+      "company": "Fit-arena",
+      "role": "Développeur Vue",
+      "description": [
+        "Renfort sur le front de Fitarena, mise en place de l'agenda interactif avec Vue3 & Pinia",
+        "Analyse et refactorisation du code existant",
+        "Mise en place des stores par entité",
+        "Mise en place des services API",
+        "Ajout d'interactions avec le calendrier",
+        "Ajout de composants UI spécifiques pour le calendrier"
+      ],
+      "tools": ["Vue 3", "Pinia", "Vite"]
+    },
+    {
+      "image": "potagercity.svg",
+      "hideTitle": true,
+      "url": "https://potagercity.fr",
+      "year": "2023-2021",
+      "company": "Potager City",
+      "role": "Développeur Vue",
+      "description": [
+        "Développement et mise à jour de l'ensemble des environnements front-end",
+        "Mise en place des phases de tests techniques pour stabiliser les services",
+        "Participation à l'amélioration de l'expérience utilisateur en coordination avec les équipes produits",
+        "Optimisation du balisage technique SEO pour améliorer les performances de trafic depuis les moteurs de recherche",
+        "Contrôle de la qualité du code"
+      ],
+      "tools": ["Vue 2", "VueX", "Vue Router", "Webpack", "SCSS", "Tailwind", "Storybook"]
+    },
+    {
+      "image": "euronews.svg",
+      "hideTitle": false,
+      "url": "https://euronews.fr",
+      "year": "2019",
+      "company": "Euronews",
+      "role": "Développeur Vue.js",
+      "description": [
+        "Développement du site euronews.com v3",
+        "Intégration SCSS normalisé avec ITcss"
+      ],
+      "tools": ["Vue.js", "SCSS", "ITcss"]
+    },
+    {
+      "image": "tyredating.png",
+      "hideTitle": true,
+      "url": "https://www.tyredating.com/",
+      "year": "2018",
+      "company": "Tyredating",
+      "role": "Développeur Vue.js",
+      "description": [
+        "Développement des composants Vue",
+        "Intégration responsive"
+      ],
+      "tools": ["Vue.js"]
+    },
+    {
+      "image": "michelin.png",
+      "hideTitle": false,
+      "url": "https://bike.michelin.com",
+      "year": "2017",
+      "company": "Michelin",
+      "role": "Intégrateur",
+      "description": [
+        "Développement pour le prototype des nouveaux sites de Michelin (bike.michelin.com) avec React & apostrophe CMS"
+      ],
+      "tools": ["React", "Apostrophe CMS"]
+    },
+    {
+      "image": "africanews.png",
+      "url": "https://africanews.com",
+      "year": "2016",
+      "company": "Africanews",
+      "role": "Intégrateur",
+      "description": [
+        "Intégration pour africanews.com et euronews.com v2",
+        "Intégration SCSS normalisé avec ITcss"
+      ],
+      "tools": ["SCSS", "ITcss"]
+    },
+    {
+      "image": "peaks.svg",
+      "hideTitle": true,
+      "url": "https://peaks.fr/",
+      "year": "2014-2015",
+      "company": "Agences Web",
+      "role": "Développeur front-end",
+      "description": [
+        "Diverses missions de développeur front-end en agences comme PEAKS, Agence Interactive, Sirroco, Nevada, Brand Advocate"
+      ],
+      "tools": ["SCSS", "HTML", "javascript"]
+    },
+    {
+      "image": "appspanel.png",
+      "url": "https://www.appspanel.com/",
+      "year": "2013",
+      "company": "Apps Panel",
+      "role": "Développeur front-end / Intégrateur",
+      "description": [
+        "Développeur front-end / Intégrateur en CDI pour l'agence Apps Panel"
+      ],
+      "tools": ["CSS", "HTML", "javascript"]
+    },
+    {
+      "image": "dnd.svg",
+      "hideTitle": true,
+      "url": "https://dnd.fr",
+      "year": "2011/2012",
+      "company": "Dn'd",
+      "role": "Développeur front-end / Intégrateur Magento",
+      "description": [
+        "Développeur front-end / Intégrateur Magento en contrat professionnel pour l’agence Dn’d"
+      ],
+      "tools": ["Magento", "HTML", "CSS"]
+    },
+    {
+      "image": "evilspins.svg",
+      "hideTitle": true,
+      "url": "https://evilspins.com",
+      "year": "2024",
+      "company": "evilSpins",
+      "role": "Développeur Vue / Node / UI Designer",
+      "description": [
+        "Conception et réalisation d'une SPA pour les compilations musicales \"evilSpins\" avec Nuxt3 et Atropos js"
+      ],
+      "tools": ["Vue 3", "Nuxt"]
+    },
+    {
+      "image": "massivemusic.png",
+      "url": "https://github.com/valerebron/massivemusic",
+      "year": "2021-2020",
+      "company": "MassiveMusic",
+      "role": "Développeur Vue / Typescript / Node / Prisma",
+      "description": [
+        "Développement des composants Vue normalisé avec Atomic Design",
+        "Intégration SCSS normalisé avec ITcss",
+        "Développement du store Vuex",
+        "Construction de l'API avec GraphQL & Typescript",
+        "Modélisation des données avec Prisma.io",
+        "Mise en place de l'intégration continue avec Gitlab et Docker-compose"
+      ],
+      "tools": ["Vue", "Typescript", "Node", "Prisma", "GraphQL", "Gitlab", "Docker-compose", "SCSS", "ITcss"]
+    },
+    {
+      "image": "",
+      "hideTitle": false,
+      "url": "",
+      "year": "2021-2020",
+      "company": "Analytics",
+      "role": "Développeur Node.js",
+      "description": [
+        "Développement du tracker client",
+        "Modélisation des données avec Prisma.io",
+        "Construction de l'API avec GraphQL & Typescript",
+        "Mise en place de l'intégration continue avec Gitlab et Docker-compose"
+      ],
+      "tools": ["Node.js", "Prisma", "GraphQL", "Gitlab", "Docker-compose", "Typescript"]
+    }
+  ]
+}
--- a/public/github.svg
+++ b/public/github.svg
@@ -0,0 +1,41 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   height="29.910585"
+   aria-hidden="true"
+   viewBox="0 0 23 22.432939"
+   version="1.1"
+   width="30.666666"
+   data-view-component="true"
+   class="octicon octicon-mark-github v-align-middle color-fg-default"
+   id="svg1"
+   sodipodi:docname="github.svg"
+   inkscape:version="1.3.2 (091e20ef0f, 2023-11-25)"
+   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">
+  <defs
+     id="defs1" />
+  <sodipodi:namedview
+     id="namedview1"
+     pagecolor="#505050"
+     bordercolor="#eeeeee"
+     borderopacity="1"
+     inkscape:showpageshadow="0"
+     inkscape:pageopacity="0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#505050"
+     showgrid="false"
+     inkscape:zoom="25.40625"
+     inkscape:cx="15.527675"
+     inkscape:cy="14.937269"
+     inkscape:window-width="1920"
+     inkscape:window-height="1011"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg1" />
+  <path
+     d="M 11.5,0 C 5.146,0 0,5.146 0,11.5 c 0,5.089 3.292,9.387 7.863,10.91 0.575,0.101 0.79,-0.244 0.79,-0.546 0,-0.273 -0.014,-1.178 -0.014,-2.142 C 5.75,20.254 5.003,19.018 4.773,18.372 4.643,18.041 4.083,17.02 3.593,16.747 3.191,16.531 2.616,15.999 3.579,15.985 c 0.906,-0.014 1.553,0.834 1.769,1.179 1.035,1.74 2.688,1.25 3.349,0.948 0.1,-0.747 0.402,-1.25 0.733,-1.538 C 6.871,16.287 4.198,15.295 4.198,10.896 4.198,9.6460005 4.643,8.611 5.376,7.806 5.261,7.518 4.859,6.339 5.491,4.758 c 0,0 0.963,-0.302 3.163,1.179 0.92,-0.259 1.897,-0.388 2.875,-0.388 0.977,0 1.955,0.13 2.875,0.388 2.2,-1.495 3.162,-1.179 3.162,-1.179 0.633,1.581 0.23,2.76 0.115,3.048 0.733,0.805 1.179,1.8250005 1.179,3.09 0,4.413 -2.688,5.39 -5.247,5.678 0.417,0.36 0.776,1.05 0.776,2.128 0,1.538 -0.014,2.774 -0.014,3.162 0,0.302 0.216,0.662 0.79,0.547 C 19.709,20.887 23,16.574 23,11.5 23,5.146 17.854,0 11.5,0 Z"
+     id="path1" />
+</svg>
--- a/public/linkedin.svg
+++ b/public/linkedin.svg
@@ -0,0 +1,7 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" data-supported-dps="24x24" fill="#0A66C2"
+  class="mercado-match" width="24" height="24" focusable="false"
+  data-darkreader-inline-fill="">
+  <path
+    d="M20.5 2h-17A1.5 1.5 0 002 3.5v17A1.5 1.5 0 003.5 22h17a1.5 1.5 0 001.5-1.5v-17A1.5 1.5 0 0020.5 2zM8 19H5v-9h3zM6.5 8.25A1.75 1.75 0 118.3 6.5a1.78 1.78 0 01-1.8 1.75zM19 19h-3v-4.74c0-1.42-.6-1.93-1.38-1.93A1.74 1.74 0 0013 14.19a.66.66 0 000 .14V19h-3v-9h2.9v1.3a3.11 3.11 0 012.7-1.4c1.55 0 3.36.86 3.36 3.66z">
+  </path>
+</svg>
--- a/public/logo.svg
+++ b/public/logo.svg
@@ -0,0 +1,75 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Generator: Adobe Illustrator 22.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+
+<svg
+   version="1.1"
+   id="Calque_1"
+   x="0px"
+   y="0px"
+   viewBox="0 0 54.4 32.1"
+   style="enable-background:new 0 0 54.4 32.1;"
+   xml:space="preserve"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:xlink="http://www.w3.org/1999/xlink"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+<defs
+   id="defs19"><linearGradient
+     inkscape:collect="always"
+     id="linearGradient20121"><stop
+       style="stop-color:#253e54;stop-opacity:1;"
+       offset="0"
+       id="stop20117" /><stop
+       style="stop-color:#4f3d4b;stop-opacity:1;"
+       offset="0.36860955"
+       id="stop20125" /><stop
+       style="stop-color:#c63f42;stop-opacity:1;"
+       offset="0.63747197"
+       id="stop20127" /><stop
+       style="stop-color:#e2702c;stop-opacity:1;"
+       offset="0.80073786"
+       id="stop20129" /><stop
+       style="stop-color:#f2c200;stop-opacity:1;"
+       offset="1"
+       id="stop20119" /></linearGradient>
+  <linearGradient
+     inkscape:collect="always"
+     xlink:href="#linearGradient20121"
+     id="linearGradient20123"
+     x1="5.5493269"
+     y1="25.562057"
+     x2="50.954609"
+     y2="7.3235936"
+     gradientUnits="userSpaceOnUse"
+     spreadMethod="pad" />
+</defs>
+<g
+   id="g14">
+
+	<g
+   id="g20115"
+   style="fill:url(#linearGradient20123);fill-opacity:1"><g
+     id="g10"
+     style="fill:url(#linearGradient20123);fill-opacity:1">
+		<polygon
+   class="st0"
+   points="31.7,0 18.5,27.3 5.3,0 0,0 15.1,32.2 16.1,32.2 20.8,32.2 21.8,32.2 36.9,0   "
+   id="polygon4"
+   style="fill:url(#linearGradient20123);fill-opacity:1" />
+		<polygon
+   class="st0"
+   points="19.6,0 14.4,0 10.2,8.6 12.9,14.3   "
+   id="polygon6"
+   style="fill:url(#linearGradient20123);fill-opacity:1" />
+		<polygon
+   class="st0"
+   points="17.4,23.7 28.5,0 23.2,0 14.6,17.9   "
+   id="polygon8"
+   style="fill:url(#linearGradient20123);fill-opacity:1" />
+	</g><path
+     class="st0"
+     d="M50.4,14c2.3-1.4,3.9-3.7,3.9-6.4c0-4.2-3.8-7.6-8.4-7.6c-0.1,0-0.2,0-0.3,0l0,0h-5.3L24.8,32.1H30h0.5h12.4   c6.3,0,11.5-4.6,11.5-10.4C54.4,18.6,52.8,15.9,50.4,14z"
+     id="path12"
+     style="fill:url(#linearGradient20123);fill-opacity:1" /></g>
+     </g></svg>
--- a/public/logo333.png
+++ b/public/logo333.png
--- a/public/logo80.png
+++ b/public/logo80.png
--- a/public/logo800.png
+++ b/public/logo800.png
--- a/public/malt.svg
+++ b/public/malt.svg
@@ -0,0 +1,63 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   width="31.698099"
+   height="31.69808"
+   viewBox="0 0 31.698099 31.69808"
+   fill="none"
+   version="1.1"
+   id="svg13"
+   sodipodi:docname="malt.svg"
+   inkscape:version="1.3.2 (091e20ef0f, 2023-11-25)"
+   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">
+  <defs
+     id="defs13" />
+  <sodipodi:namedview
+     id="namedview13"
+     pagecolor="#505050"
+     bordercolor="#eeeeee"
+     borderopacity="1"
+     inkscape:showpageshadow="0"
+     inkscape:pageopacity="0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#505050"
+     inkscape:zoom="6.8425197"
+     inkscape:cx="63.426928"
+     inkscape:cy="13.810702"
+     inkscape:window-width="1920"
+     inkscape:window-height="1011"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg13" />
+  <path
+     d="M 27.126,4.57378 C 24.7333,2.18109 22.1774,3.72972 20.5778,5.32926 L 5.46756,20.44008 c -1.59954,1.5993 -3.27375,4.0295 -0.75548,6.5474 2.51826,2.5188 4.94845,0.8443 6.54762,-0.7553 l 15.1106,-15.1104 c 1.5996,-1.5997 3.1482,-4.1556 0.7557,-6.548 z"
+     fill="#fc5757"
+     id="path1" />
+  <path
+     d="m 12.6898,3.9549 3.1995,3.19938 3.2568,-3.25673 C 19.3672,3.67593 19.5917,3.47026 19.8176,3.2763 19.4765,1.55559 18.4947,0 15.8878,0 13.276,0 12.2954,1.5617 11.9562,3.28614 12.2,3.49707 12.4434,3.70851 12.6898,3.9549 Z"
+     fill="#fc5757"
+     id="path2" />
+  <path
+     d="m 19.1442,27.72108 -3.2547,-3.2549 -3.1979,3.1976 c -0.2428,0.243 -0.4845,0.4649 -0.7251,0.6735 0.3667,1.7541 1.4046,3.3608 3.9217,3.3608 2.5236,0 3.5601,-1.6153 3.9245,-3.3751 -0.2239,-0.1926 -0.4478,-0.3814 -0.6685,-0.6019 z"
+     fill="#fc5757"
+     id="path3" />
+  <path
+     d="M 11.3327,11.71108 H 5.16431 C 2.90262,11.71108 0,12.42368 0,15.80708 c 0,2.5245 1.61583,3.5612 3.3759,3.9253 0.20839,-0.2406 7.9568,-8.0213 7.9568,-8.0213 z"
+     fill="#fc5757"
+     id="path4" />
+  <path
+     d="m 28.4128,11.87538 c -0.1952,0.2271 -7.9599,8.0274 -7.9599,8.0274 h 6.0809 c 2.2618,0 5.1643,-0.5344 5.1643,-4.0957 0,-2.6115 -1.5612,-3.5926 -3.2853,-3.9317 z"
+     fill="#fc5757"
+     id="path5" />
+  <path
+     d="m 13.3538,9.68638 1.102,-1.102 -3.1976,-3.1981 C 9.6585,3.78691 7.22864,2.11253 4.71038,4.6308 2.86376,6.47738 3.27392,8.27468 4.25339,9.73368 4.55171,9.71158 13.3538,9.68638 13.3538,9.68638 Z"
+     fill="#fc5757"
+     id="path6" />
+  <path
+     d="m 18.4239,21.92758 -1.1049,1.1049 3.2571,3.2568 c 1.5996,1.5997 4.1555,3.148 6.5479,0.7556 1.7851,-1.7853 1.3755,-3.6605 0.3886,-5.1626 -0.3177,0.0229 -9.0887,0.0453 -9.0887,0.0453 z"
+     fill="#fc5757"
+     id="path7" />
+</svg>
--- a/public/play.svg
+++ b/public/play.svg
@@ -0,0 +1,38 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   version="1.1"
+   id="svg1"
+   sodipodi:docname="play.svg"
+   width="25.177818"
+   height="31.875"
+   inkscape:version="1.3.2 (091e20ef0f, 2023-11-25)"
+   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">
+  <defs
+     id="defs1" />
+  <sodipodi:namedview
+     id="namedview1"
+     pagecolor="#505050"
+     bordercolor="#eeeeee"
+     borderopacity="1"
+     inkscape:showpageshadow="0"
+     inkscape:pageopacity="0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#505050"
+     inkscape:zoom="1.9448516"
+     inkscape:cx="202.07197"
+     inkscape:cy="136.00009"
+     inkscape:window-width="1920"
+     inkscape:window-height="1011"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg1" />
+  <path
+     style="font-size:64px;line-height:0.6;font-family:'Noto Sans Rejang';-inkscape-font-specification:'Noto Sans Rejang';letter-spacing:0.03px;word-spacing:0.16px;stroke-width:5.38174;stroke-miterlimit:2.3;stroke-dasharray:1.07635, 5.91989"
+     d="M 0,31.875 V 0 l 25.177818,15.9375 z"
+     id="text1"
+     aria-label="▸" />
+</svg>
--- a/public/profil.jpg
+++ b/public/profil.jpg
--- a/public/projects/africanews.png
+++ b/public/projects/africanews.png
--- a/public/projects/appspanel.png
+++ b/public/projects/appspanel.png
--- a/public/projects/dnd.svg
+++ b/public/projects/dnd.svg
@@ -0,0 +1,67 @@
+<svg id="Horizontal-Bleu" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 195.2 66.12">
+<defs>
+<style>
+                            .cls-1 {
+                                clip-path: url(#clippath);
+                            }
+
+                            .cls-2 {
+                                fill: none;
+                            }
+
+                            .cls-2, .cls-3, .cls-4 {
+                                stroke-width: 0px;
+                            }
+
+                            .cls-5 {
+                                clip-path: url(#clippath-1);
+                            }
+
+                            .cls-6 {
+                                clip-path: url(#clippath-3);
+                            }
+
+                            .cls-7 {
+                                clip-path: url(#clippath-2);
+                            }
+
+                            .cls-3 {
+                                fill: #fff;
+                            }
+
+                            .cls-4 {
+                                fill: #010101;
+                            }
+                        </style>
+<clipPath id="clippath">
+<path class="cls-2" d="M33.06,0C14.8,0,0,14.8,0,33.06s14.8,33.06,33.06,33.06h.01c18.26,0,33.06-14.8,33.06-33.06S51.33,0,33.07,0h-.01Z"></path>
+</clipPath>
+<clipPath id="clippath-1">
+<rect class="cls-2 inverse-color" x="-75.11" y="-86.33" width="345.13" height="244.03"></rect>
+</clipPath>
+<clipPath id="clippath-2">
+<path class="cls-2 change-color" d="M30.27,46.29l.34-3.08c.42-.06.78-.14,1.1-.23,2.05-.49,3.81-1.41,5.29-2.87.53-.53,1.01-1.12,1.45-1.77.13.08.27.17.44.27.07.04.15.09.3.18.12.07.21.13.3.19,1.64,1.02,2.83,1.72,3.99,2.29-1.64,3.49-4.91,5-9.66,5.01h-3.55M23.51,39.44c-.67-.5-.94-1.12-.88-1.81.18-1.84,2.29-2.86,5.69-2.86,2.75,0,4.86.6,7.66,2.12-.3.44-.64.84-.99,1.19-1.43,1.42-3.27,2.15-5.63,2.41-.19.02-.38.03-.57.05-.14,0-.27.02-.38.02-.05,0-.09,0-.11,0-2.25,0-3.85-.43-4.78-1.12M40.99,36.57c-.09-.05-.18-.11-.3-.18-.15-.09-.23-.14-.3-.18-.25-.15-.42-.26-.6-.37-.02,0-.03-.02-.05-.03.74-1.89,1.2-4.14,1.37-6.79.03-.43.04-.86.03-1.29.26.14.51.3.75.46,2.02,1.44,3.03,3.94,2.78,7.94-.06.86-.16,1.67-.31,2.41-.96-.49-1.98-1.1-3.37-1.96M34.7,33.14c-.95-.37-1.9-.66-2.88-.86l.64-5.78h2.59c1.16,0,2.22.09,3.17.25.07.66.09,1.34.05,2.06-.14,2.18-.49,4.01-1.02,5.52-.89-.48-1.69-.86-2.55-1.19M28.17,16.68h-4.64l-1.37,11.67,2.82.33,1.08-9.16h2.57c.84,0,1.57,0,2.16,0,2.99.01,5.37,1.66,6.6,4.25-.74-.07-1.52-.11-2.33-.11-1.26,0-2.41,0-3.38,0h-1.77s-.91,8.28-.91,8.28c-.22,0-.44-.01-.66-.01-2,0-3.83.32-5.28,1.02-1.86.89-3.04,2.39-3.24,4.41-.16,1.68.53,3.26,2,4.36,1.38,1.03,3.37,1.61,5.92,1.68l-.64,5.72h1.58s.1,0,.19,0h4.96c8.06-.02,13.11-4.02,13.68-12.83.32-4.94-1.08-8.39-3.96-10.44-.87-.62-1.83-1.09-2.88-1.43-1.28-4.54-4.96-7.73-9.85-7.75h-2.64"></path>
+</clipPath>
+<clipPath id="clippath-3">
+<rect class="cls-2" x="-75.11" y="-86.33" width="345.13" height="244.03"></rect>
+</clipPath>
+</defs>
+<g id="logo_agence_dnd">
+<g class="cls-1" id="logo_agence_dnd_background">
+<g class="cls-5">
+<path class="cls-4 change-color" d="M-1.19-1.18h68.5v68.49H-1.19V-1.18Z"></path>
+</g>
+</g>
+<g class="cls-7" id="logo_agence_dnd_logo">
+<g class="cls-6">
+<path class="cls-3 inverse-color" d="M18.6,15.49h30.14v34.83h-30.14V15.49Z"></path>
+</g>
+</g>
+</g>
+<g id="logo_agence_dnd_text">
+<path class="cls-4 text change-color" d="M156.6,22.09l3.28-7.83h-5.23l-.88,7.51,2.82.33Z"></path>
+<path class="cls-4 text change-color" d="M150.02,28.73v20.17h-5.94v-19.13c0-4.72-3-8.03-7.3-8.03s-8.22,2.88-8.7,6.62v20.54h-6.07v-31.69h6.07v4.6c1.9-3.13,5.76-5.33,10.06-5.33,6.99,0,11.89,5.09,11.89,12.26"></path>
+<path class="cls-4 text change-color" d="M96.96,16.43h-11.45v32.49h11.45c11.06,0,18.78-6.69,18.78-16.27s-7.72-16.22-18.78-16.22M97.89,43.61h-6.44v-21.87h6.44c6.74,0,11.64,4.59,11.64,10.9s-4.9,10.96-11.64,10.96"></path>
+<path class="cls-4 text change-color" d="M176.42,16.43h-11.45v32.49h11.45c11.06,0,18.78-6.69,18.78-16.27s-7.72-16.22-18.78-16.22M177.36,43.61h-6.44v-21.87h6.44c6.74,0,11.64,4.59,11.64,10.9s-4.9,10.96-11.64,10.96"></path>
+</g>
+</svg>
--- a/public/projects/euronews.svg
+++ b/public/projects/euronews.svg
@@ -0,0 +1,12 @@
+<svg viewBox="0 0 72 72" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <rect width="72" height="72" fill="#0172F0"/>
+  <path d="M19.3904 50.652V44.0629C19.3904 43.5479 19.3371 43.0861 19.1773 42.6599C19.0175 42.2692 18.8043 41.914 18.5202 41.6298C18.2538 41.3456 17.9341 41.1325 17.5789 40.9904C17.2059 40.8306 16.8152 40.7595 16.4067 40.7595C15.9982 40.7595 15.5897 40.8306 15.2345 40.9904C14.8793 41.1503 14.5596 41.3634 14.2755 41.6476C13.9913 41.9317 13.7782 42.2869 13.6184 42.6777C13.4585 43.1039 13.3342 43.5834 13.3342 44.0807V50.6698H10.457V43.9564C10.457 43.0861 10.6346 42.2692 10.9366 41.5232C11.2385 40.7951 11.6647 40.1379 12.2153 39.5874C12.7659 39.0546 13.4052 38.6283 14.1156 38.3442C14.8438 38.06 15.6075 37.9001 16.4245 37.9001C17.2414 37.9001 18.0051 38.0422 18.7333 38.3264C19.4615 38.6106 20.1008 39.0368 20.6336 39.5696C21.1842 40.1202 21.6105 40.7595 21.8946 41.5055C22.1965 42.2692 22.3209 43.0861 22.3209 43.9564V50.6698H19.3904V50.652Z" fill="white"/>
+  <path d="M68.625 48.5178C68.8884 47.0803 67.9365 45.7015 66.499 45.4381C65.0614 45.1747 63.6826 46.1266 63.4192 47.5641C63.1559 49.0016 64.1077 50.3805 65.5453 50.6439C66.9828 50.9072 68.3616 49.9554 68.625 48.5178Z" fill="white"/>
+  <path d="M34.9658 38.202V38.131H38.1094C38.5001 41.1502 39.4769 45.9277 40.3472 48.0945C41.2529 45.9277 42.3008 41.1502 42.6915 38.131H45.3023C45.7108 41.1502 46.7409 45.7324 47.6644 48.0945C48.5169 45.7324 49.4937 41.1502 49.9022 38.131H53.028V38.202C52.2998 42.9085 50.9323 47.757 49.7601 50.6342H45.8351C45.178 49.0535 44.3965 46.6381 43.988 44.4891C43.5973 46.6559 42.7448 49.1956 42.1587 50.6342H38.2337C36.8839 47.4906 35.3743 42.2158 34.9658 38.202Z" fill="white"/>
+  <path d="M52.8861 50.1003V47.7026H53.0104C53.7208 47.9158 55.2482 48.2177 56.3494 48.2177H56.9887C58.0188 48.2177 58.7825 47.898 58.7825 46.8679C58.7825 46.0865 58.1076 45.7845 57.3617 45.5892L55.4258 45.0741C54.005 44.7189 52.8506 43.7243 52.8506 41.5931C52.8506 39.0889 54.9108 38.0588 57.415 38.0588H58.0543C58.8358 38.0588 60.3809 38.2542 61.0913 38.5206V40.9005H60.967C60.3276 40.7229 58.7825 40.5275 58.0721 40.5275H57.5038C56.598 40.5275 55.8165 40.7051 55.8165 41.6109C55.8165 42.3213 56.3494 42.6055 56.9887 42.7653L58.9246 43.2981C60.7894 43.7954 61.7662 44.8965 61.7662 46.8857C61.7662 49.6563 59.7771 50.6864 57.0065 50.6864H56.3671C55.3903 50.6686 53.7741 50.4022 52.8861 50.1003Z" fill="white"/>
+  <path d="M28.9988 50.9712C25.5 50.9712 22.6406 48.0408 22.6406 44.4177C22.6406 40.8123 25.4823 37.8641 28.9988 37.8641C32.4976 37.8641 35.357 40.8123 35.357 44.4177C35.357 44.7551 35.3392 45.0926 35.2859 45.4122L35.2682 45.5188H25.3402L25.3757 45.6609C25.8907 47.2771 27.3471 48.3427 28.9988 48.3427C29.8868 48.3427 30.7393 48.023 31.4319 47.4369C31.4319 47.4369 31.6095 47.2771 31.6451 47.2593H34.7353L34.6465 47.4369C33.5454 49.6214 31.3787 50.9712 28.9988 50.9712ZM28.9988 40.4927C27.3471 40.4927 25.8907 41.576 25.3757 43.1922L25.3402 43.3343H32.6574L32.6219 43.1922C32.1068 41.576 30.6505 40.4927 28.9988 40.4927Z" fill="white"/>
+  <path d="M40.5781 34.6141V27.1548C40.5781 26.6042 40.6492 26.0536 40.7735 25.5386C40.9511 24.8282 41.253 24.1888 41.6437 23.6382C42.141 22.9634 42.8159 22.4305 43.6329 22.0576C44.5919 21.6313 45.7464 21.4182 47.0961 21.4182H47.3448V23.0344H47.0961C46.1193 23.0344 45.2668 23.1587 44.5919 23.4251C43.9881 23.656 43.4908 23.9757 43.1178 24.3842C42.7982 24.7394 42.5495 25.1834 42.3897 25.6984C42.2653 26.1247 42.1943 26.622 42.1943 27.1548V34.6141H40.5781Z" fill="white"/>
+  <path d="M54.9994 21.4542C51.3585 21.4542 48.3926 24.4912 48.3926 28.2209C48.3926 31.9505 51.3408 34.9875 54.9994 34.9875C58.658 34.9875 61.6062 31.9505 61.6062 28.2209C61.6062 24.4912 58.6402 21.4542 54.9994 21.4542ZM54.9994 33.1405C52.4597 33.1405 50.3817 30.9382 50.3817 28.2209C50.3817 25.5036 52.4597 23.3013 54.9994 23.3013C57.5391 23.3013 59.617 25.5036 59.617 28.2209C59.617 30.9382 57.5391 33.1405 54.9994 33.1405Z" fill="white"/>
+  <path d="M21.2731 31.2219C20.3319 32.5716 18.8222 33.3709 17.2061 33.3709C14.8617 33.3709 12.8015 31.6659 12.3042 29.3038L12.2865 29.215H20.9535H23.3689H23.7063C23.7773 28.7532 23.7596 28.2381 23.7596 28.2381C23.7596 28.2204 23.7596 28.2026 23.7596 28.1849C23.7596 24.4552 20.8114 21.4182 17.1883 21.4182C13.5652 21.4182 10.6348 24.4552 10.6348 28.1849C10.6348 31.9145 13.583 34.9515 17.1883 34.9515C19.657 34.9515 21.8948 33.5485 23.0314 31.2751L23.1913 30.9377H21.4152C21.3619 31.062 21.3087 31.1508 21.2731 31.2219ZM12.2332 27.5455C12.5529 24.9703 14.7019 23.0344 17.2061 23.0344C19.728 23.0344 21.8592 24.9703 22.1789 27.5455L22.1967 27.6165H12.2154L12.2332 27.5455Z" fill="white"/>
+  <path d="M31.965 34.97C31.2369 34.97 30.5442 34.8457 29.8871 34.5793C29.2477 34.3307 28.6794 33.9577 28.1999 33.4782C27.7203 32.9986 27.3296 32.4125 27.081 31.7732C26.8146 31.0983 26.708 30.3524 26.708 29.5709V21.7031H28.2176V29.4466C28.2176 30.0504 28.2887 30.6188 28.484 31.1338C28.6794 31.6133 28.9458 32.0573 29.301 32.4125C29.6384 32.7678 30.0469 33.0342 30.4909 33.2295C30.9527 33.4249 31.4322 33.5137 31.9473 33.5137C32.4623 33.5137 32.9596 33.4071 33.4214 33.2295C33.8831 33.0342 34.2739 32.7678 34.6291 32.4125C34.9843 32.0573 35.2507 31.6133 35.446 31.1338C35.6414 30.6188 35.7657 30.0504 35.7657 29.4466V21.7031H37.2754V29.5709C37.2754 30.3524 37.1155 31.0983 36.8313 31.7732C36.5649 32.4303 36.192 32.9986 35.6947 33.4782C35.2152 33.9577 34.6468 34.3307 34.0075 34.5793C33.4036 34.8457 32.6932 34.97 31.965 34.97Z" fill="white"/>
+</svg>
--- a/public/projects/evilspins.svg
+++ b/public/projects/evilspins.svg
--- a/public/projects/fitarena.png
+++ b/public/projects/fitarena.png
--- a/public/projects/groupama.svg
+++ b/public/projects/groupama.svg
@@ -0,0 +1,39 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   width="36.650944"
+   height="36.16"
+   viewBox="0 0 36.650944 36.16"
+   version="1.1"
+   id="svg1"
+   sodipodi:docname="groupama.svg"
+   inkscape:version="1.4.2 (ebf0e940d0, 2025-05-08)"
+   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">
+  <defs
+     id="defs1" />
+  <sodipodi:namedview
+     id="namedview1"
+     pagecolor="#505050"
+     bordercolor="#eeeeee"
+     borderopacity="1"
+     inkscape:showpageshadow="0"
+     inkscape:pageopacity="0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#505050"
+     inkscape:zoom="6.2894282"
+     inkscape:cx="103.26853"
+     inkscape:cy="47.460595"
+     inkscape:window-width="3440"
+     inkscape:window-height="1372"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg1" />
+  <path
+     fill="#0a6e46"
+     d="m 23.29,22.44 h 7.42 c -0.66,2.74 -4.44,8.53 -12.41,8.53 -7.17,0 -13.06,-5.96 -13.06,-12.89 0,-6.93 5.61,-12.89 13.06,-12.89 5.25,0 10.21,3.23 12.27,7.95 H 36.1 C 33.71,4.7 26.27,0 18.08,0 8.11,0 0,8.11 0,18.08 c 0,9.97 8.11,18.08 18.08,18.08 12.31,0 18.66,-9.83 18.57,-18.33 H 20.62 l 2.67,4.62 z M 17.98,8.6 15.6,17.82 h -3.97 l -2.67,4.62 h 8.99 L 20.62,17.82 18.24,8.6 Z"
+     id="path1"
+     sodipodi:nodetypes="ccsssccssscccccccccccc" />
+</svg>
--- a/public/projects/massivemusic.png
+++ b/public/projects/massivemusic.png
--- a/public/projects/michelin.png
+++ b/public/projects/michelin.png
--- a/public/projects/peaks.svg
+++ b/public/projects/peaks.svg
--- a/public/projects/potagercity.svg
+++ b/public/projects/potagercity.svg
--- a/public/projects/tyredating.png
+++ b/public/projects/tyredating.png
--- a/public/react_dark.svg
+++ b/public/react_dark.svg
--- a/public/reat_light.svg
+++ b/public/reat_light.svg
--- a/public/robots.txt
+++ b/public/robots.txt
@@ -0,0 +1,2 @@
+User-Agent: *
+Disallow:
--- a/public/tools/docker.svg
+++ b/public/tools/docker.svg
@@ -0,0 +1,52 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   class="docker_logo "
+   id="Layer_1"
+   data-name="Layer 1"
+   viewBox="0 0 674.98842 537.23019"
+   version="1.1"
+   sodipodi:docname="docker.svg"
+   width="674.9884"
+   height="537.23016"
+   inkscape:version="1.3.2 (091e20ef0f, 2023-11-25)"
+   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="namedview8"
+     pagecolor="#505050"
+     bordercolor="#eeeeee"
+     borderopacity="1"
+     inkscape:showpageshadow="0"
+     inkscape:pageopacity="0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#505050"
+     showgrid="false"
+     inkscape:zoom="0.31142373"
+     inkscape:cx="319.50038"
+     inkscape:cy="268.12343"
+     inkscape:window-width="1920"
+     inkscape:window-height="1011"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="Layer_1" />
+  <defs
+     id="defs1">
+    <style
+       id="style1">
+      .cls-1 {
+        fill: #1d63ed;
+        stroke-width: 0px;
+      }
+    </style>
+  </defs>
+  <path
+     class="cls-1"
+     d="m 664.00838,223.35 c -16.55,-11.14 -60.03,-15.89 -91.64,-7.38 -1.7,-31.49 -17.94,-58.03 -47.65,-81.17 l -10.99,-7.38 -7.33,11.07 c -14.4,21.86 -20.47,51 -18.33,77.49 1.7,16.32 7.37,34.66 18.33,47.97 -41.15,23.87 -79.07,18.45 -247.03,18.45 H 0.05837932 c -0.76,37.93 5.33999998,110.88 51.72999968,170.27 5.12,6.56 10.74,12.91 16.84,19.02 37.720001,37.77 94.710001,65.47 179.930001,65.54 130,0.12 241.39,-70.16 309.15,-240.07 22.3,0.37 81.15,3.99 109.95,-51.66 0.7,-0.94 7.33,-14.76 7.33,-14.76 l -10.98,-7.38 z m -494.72,-39.14 H 96.368379 v 72.92 h 72.920001 z m 94.21,0 h -72.92 v 72.92 h 72.92 z m 94.21,0 h -72.92 v 72.92 h 72.92 z m 94.21,0 h -72.92 v 72.92 h 72.92 z m -376.820001,0 H 2.1583793 v 72.92 H 75.078379 V 184.21 Z M 169.30838,92.1 H 96.388379 v 72.92 h 72.920001 z m 94.21,0 h -72.92 v 72.92 h 72.92 z m 94.21,0 h -72.92 v 72.92 h 72.92 z m -0.03,-92.1 h -72.92 v 72.92 h 72.92 z"
+     id="path1" />
+  <g
+     id="g8"
+     transform="translate(-0.00162068)" />
+</svg>
--- a/public/tools/javascript.svg
+++ b/public/tools/javascript.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" width="100" height="100" viewBox="0 0 48 48">
+<path fill="#ffd600" d="M6,42V6h36v36H6z"></path><path fill="#000001" d="M29.538 32.947c.692 1.124 1.444 2.201 3.037 2.201 1.338 0 2.04-.665 2.04-1.585 0-1.101-.726-1.492-2.198-2.133l-.807-.344c-2.329-.988-3.878-2.226-3.878-4.841 0-2.41 1.845-4.244 4.728-4.244 2.053 0 3.528.711 4.592 2.573l-2.514 1.607c-.553-.988-1.151-1.377-2.078-1.377-.946 0-1.545.597-1.545 1.377 0 .964.6 1.354 1.985 1.951l.807.344C36.452 29.645 38 30.839 38 33.523 38 36.415 35.716 38 32.65 38c-2.999 0-4.702-1.505-5.65-3.368L29.538 32.947zM17.952 33.029c.506.906 1.275 1.603 2.381 1.603 1.058 0 1.667-.418 1.667-2.043V22h3.333v11.101c0 3.367-1.953 4.899-4.805 4.899-2.577 0-4.437-1.746-5.195-3.368L17.952 33.029z"></path>
+</svg>
--- a/public/tools/nest.svg
+++ b/public/tools/nest.svg
--- a/public/tools/pinia.svg
+++ b/public/tools/pinia.svg
--- a/public/tools/react.svg
+++ b/public/tools/react.svg
@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="-11.5 -10.23174 23 20.46348">
+  <title>React Logo</title>
+  <circle cx="0" cy="0" r="2.05" fill="#61dafb"/>
+  <g stroke="#61dafb" stroke-width="1" fill="none">
+    <ellipse rx="11" ry="4.2"/>
+    <ellipse rx="11" ry="4.2" transform="rotate(60)"/>
+    <ellipse rx="11" ry="4.2" transform="rotate(120)"/>
+  </g>
+</svg>
--- a/public/tools/tailwind.svg
+++ b/public/tools/tailwind.svg
@@ -0,0 +1,3 @@
+
+
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 54 33"><g clip-path="url(#prefix__clip0)"><path fill="#38bdf8" fill-rule="evenodd" d="M27 0c-7.2 0-11.7 3.6-13.5 10.8 2.7-3.6 5.85-4.95 9.45-4.05 2.054.513 3.522 2.004 5.147 3.653C30.744 13.09 33.808 16.2 40.5 16.2c7.2 0 11.7-3.6 13.5-10.8-2.7 3.6-5.85 4.95-9.45 4.05-2.054-.513-3.522-2.004-5.147-3.653C36.756 3.11 33.692 0 27 0zM13.5 16.2C6.3 16.2 1.8 19.8 0 27c2.7-3.6 5.85-4.95 9.45-4.05 2.054.514 3.522 2.004 5.147 3.653C17.244 29.29 20.308 32.4 27 32.4c7.2 0 11.7-3.6 13.5-10.8-2.7 3.6-5.85 4.95-9.45 4.05-2.054-.513-3.522-2.004-5.147-3.653C23.256 19.31 20.192 16.2 13.5 16.2z" clip-rule="evenodd"/></g><defs><clipPath id="prefix__clip0"><path fill="#fff" d="M0 0h54v32.4H0z"/></clipPath></defs></svg>
--- a/public/tools/vue.svg
+++ b/public/tools/vue.svg
@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" class="logo" viewBox="0 0 128 128" width="24" height="24">
+  <path fill="#42b883" d="M78.8,10L64,35.4L49.2,10H0l64,110l64-110C128,10,78.8,10,78.8,10z"></path>
+  <path fill="#35495e" d="M78.8,10L64,35.4L49.2,10H25.6L64,76l38.4-66H78.8z"></path>
+</svg>
--- a/public/youtube.svg
+++ b/public/youtube.svg
@@ -0,0 +1,57 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   version="1.1"
+   id="svg1"
+   sodipodi:docname="youtube.svg"
+   width="25.177818"
+   height="17.624441"
+   inkscape:version="1.3.2 (091e20ef0f, 2023-11-25)"
+   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">
+  <defs
+     id="defs1" />
+  <sodipodi:namedview
+     id="namedview1"
+     pagecolor="#505050"
+     bordercolor="#eeeeee"
+     borderopacity="1"
+     inkscape:showpageshadow="0"
+     inkscape:pageopacity="0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#505050"
+     inkscape:zoom="13.548512"
+     inkscape:cx="13.322496"
+     inkscape:cy="8.6725392"
+     inkscape:window-width="1920"
+     inkscape:window-height="1011"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg1" />
+  <g
+     id="Page-1"
+     stroke="none"
+     stroke-width="1"
+     fill="none"
+     fill-rule="evenodd"
+     style="fill:#ff0000"
+     transform="matrix(1.2588908,0,0,1.2588908,3.6299617e-6,-3.1302942e-5)">
+    <g
+       id="Dribbble-Light-Preview"
+       transform="translate(-300,-7442)"
+       fill="#000000"
+       style="fill:#ff0000">
+      <g
+         id="icons"
+         transform="translate(56,160)"
+         style="fill:#ff0000">
+        <path
+           d="m 251.98843,7291.5859 v -5.6117 c 1.99221,0.9375 3.53517,1.843 5.36003,2.8193 -1.50511,0.8347 -3.36782,1.7712 -5.36003,2.7924 m 11.10257,-8.403 c -0.34366,-0.4528 -0.92937,-0.8048 -1.55293,-0.9215 -1.83283,-0.348 -13.2671,-0.349 -15.09893,0 -0.50004,0.094 -0.9453,0.3201 -1.32781,0.6722 -1.61169,1.4959 -1.10667,9.5179 -0.71819,10.8174 0.16336,0.5624 0.37454,0.9683 0.6405,1.2346 0.34266,0.352 0.81182,0.5943 1.35071,0.703 1.5091,0.3122 9.28369,0.4867 15.12185,0.047 0.53789,-0.094 1.01403,-0.344 1.38956,-0.711 1.49017,-1.49 1.38857,-9.9628 0.19524,-11.8416"
+           id="youtube-[#168]"
+           style="fill:#ff0000" />
+      </g>
+    </g>
+  </g>
+</svg>
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -0,0 +1,11 @@
+/** @type {import('tailwindcss').Config} */
+module.exports = {
+  content: [
+    "./components/**/*.{js,vue,ts}",
+    "./layouts/**/*.vue",
+    "./pages/**/*.vue",
+    "./plugins/**/*.{js,ts}",
+    "./app.vue",
+    "./error.vue",
+  ],
+};
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -0,0 +1,18 @@
+{
+  // https://nuxt.com/docs/guide/concepts/typescript
+  "files": [],
+  "references": [
+    {
+      "path": "./.nuxt/tsconfig.app.json"
+    },
+    {
+      "path": "./.nuxt/tsconfig.server.json"
+    },
+    {
+      "path": "./.nuxt/tsconfig.shared.json"
+    },
+    {
+      "path": "./.nuxt/tsconfig.node.json"
+    }
+  ]
+}
				`@@ -0,0 +1,3 @@`


				<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 54 33"><g clip-path="url(#prefix__clip0)"><path fill="#38bdf8" fill-rule="evenodd" d="M27 0c-7.2 0-11.7 3.6-13.5 10.8 2.7-3.6 5.85-4.95 9.45-4.05 2.054.513 3.522 2.004 5.147 3.653C30.744 13.09 33.808 16.2 40.5 16.2c7.2 0 11.7-3.6 13.5-10.8-2.7 3.6-5.85 4.95-9.45 4.05-2.054-.513-3.522-2.004-5.147-3.653C36.756 3.11 33.692 0 27 0zM13.5 16.2C6.3 16.2 1.8 19.8 0 27c2.7-3.6 5.85-4.95 9.45-4.05 2.054.514 3.522 2.004 5.147 3.653C17.244 29.29 20.308 32.4 27 32.4c7.2 0 11.7-3.6 13.5-10.8-2.7 3.6-5.85 4.95-9.45 4.05-2.054-.513-3.522-2.004-5.147-3.653C23.256 19.31 20.192 16.2 13.5 16.2z" clip-rule="evenodd"/></g><defs><clipPath id="prefix__clip0"><path fill="#fff" d="M0 0h54v32.4H0z"/></clipPath></defs></svg>