From 097592128cf2e6075c3088b48ef468afc41e7f7b Mon Sep 17 00:00:00 2001 From: Giovanni-Josserand Date: Sat, 30 Aug 2025 00:05:29 +0200 Subject: [PATCH 1/4] add of proxy for local test --- vite.config.js | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/vite.config.js b/vite.config.js index 8b0f57b..128a60b 100644 --- a/vite.config.js +++ b/vite.config.js @@ -4,4 +4,12 @@ import react from '@vitejs/plugin-react' // https://vite.dev/config/ export default defineConfig({ plugins: [react()], + server: { + proxy: { + '/api': { + target: 'http://localhost:8000', + changeOrigin: true, + }, + } + } }) -- 2.47.2 From 54046d210bf65fb5fcae5c438caeeef4fdb01311 Mon Sep 17 00:00:00 2001 From: Giovanni-Josserand Date: Sat, 30 Aug 2025 00:09:23 +0200 Subject: [PATCH 2/4] update of skills section to use db --- src/components/Skills.jsx | 62 ++++++++++++++++++++++++--------------- 1 file changed, 38 insertions(+), 24 deletions(-) diff --git a/src/components/Skills.jsx b/src/components/Skills.jsx index 5fef275..b5593d8 100644 --- a/src/components/Skills.jsx +++ b/src/components/Skills.jsx @@ -1,35 +1,49 @@ +import React, { useState, useEffect } from 'react'; import SkillCard from "./SkillCard.jsx"; import "../styles/Skills.css"; function Skills() { + const [skills, setSkills] = useState([]); + const [error, setError] = useState(null); + + useEffect(() => { + const fetchProjects = async () => { + try { + const response = await fetch('/api/skills'); + if (!response.ok) { + throw new Error(`Erreur HTTP: ${response.status}`); + } + const data = await response.json(); + setSkills(data.data); + } catch (err) { + setError(err.message); + } + }; + fetchProjects(); + }, []); + + if (error) { + return
Erreur lors de la récupération des données : {error}
; + } + + const uniqueSkillTypes = [...new Set(skills.map(skill => skill.type))]; + + return (

Skills

-
-

Languages

-
- - - - - - - - + {uniqueSkillTypes.map(type => ( +
+

{type}

+
+ {skills + .filter(skill => skill.type === type) + .map(skill => ( + + ))} +
-
-
-

Librairies

-
- -
-
-
-

Tools

-
- -
-
+ ))}
) } -- 2.47.2 From 4b533241255bb00554a3d7df333c5af9713fce38 Mon Sep 17 00:00:00 2001 From: Giovanni-Josserand Date: Sun, 31 Aug 2025 00:22:50 +0200 Subject: [PATCH 3/4] update of experiences section to use DB --- src/components/Experiences.jsx | 60 ++++++++++++++++------------- src/components/SingleExperience.jsx | 6 +-- src/components/Skills.jsx | 4 +- 3 files changed, 38 insertions(+), 32 deletions(-) diff --git a/src/components/Experiences.jsx b/src/components/Experiences.jsx index a42d751..ee5f922 100644 --- a/src/components/Experiences.jsx +++ b/src/components/Experiences.jsx @@ -1,39 +1,45 @@ import '../styles/Experiences.css'; import SingleExperience from './SingleExperience'; +import React, {useEffect, useState} from "react"; function Experiences() { - const experiencesData = [ - { - role: "Web Development Intern", - company: "Pandora", - duration: "April 2024", - location: "Rennes (Ille-et-Vilaine), France", - tasks: [ - "Development of a dynamic website with database integration (HTML, CSS, PHP, SQL)", - "Created a reusable interface used as an internal learning resource", - "Introduction to GitHub Actions" - ] - }, - { - role: "IT Support Intern", - company: "INRAE", - duration: "April 2023", - location: "Rennes (Ille-et-Vilaine), France", - tasks: [ - "Introduction to ProxMox Backup and UpdateEngine tools", - "Preparation of two workstations", - "Setup of a Wi-Fi hotspot using a Raspberry Pi", - "Installation of a RAID 1 system" - ] - } - ]; + const [experiences, setExperiences] = useState([]); + const [experienceTasks, setExperienceTasks] = useState([]); + const [error, setError] = useState(null); + + useEffect(() => { + const fetchExperiencesAndTasks = async () => { + try { + let response = await fetch('/api/experiences'); + if (!response.ok) { + throw new Error(`Erreur HTTP: ${response.status}`); + } + let data = await response.json(); + setExperiences(data.data); + + response = await fetch('/api/experienceTasks'); + if (!response.ok) { + throw new Error(`Erreur HTTP: ${response.status}`); + } + data = await response.json(); + setExperienceTasks(data.data); + } catch (err) { + setError(err.message); + } + }; + fetchExperiencesAndTasks(); + }, []); + + if (error) { + return
Erreur lors de la récupération des données : {error}
; + } return (

Experiences

- {experiencesData.map((exp) => ( - + {experiences.map((exp) => ( + task.experience_id === exp.id)}/> ))}
diff --git a/src/components/SingleExperience.jsx b/src/components/SingleExperience.jsx index 0e74bab..fe7c040 100644 --- a/src/components/SingleExperience.jsx +++ b/src/components/SingleExperience.jsx @@ -1,6 +1,6 @@ import '../styles/SingleExperience.css'; -function SingleExperience({ experience }) { +function SingleExperience({ experience, tasks }) { return (
@@ -11,8 +11,8 @@ function SingleExperience({ experience }) {

{experience.role}

    - {experience.tasks.map((task, index) => ( -
  • {task}
    • + {tasks.map((task) => ( +
  • {task.description}
    • ))}
diff --git a/src/components/Skills.jsx b/src/components/Skills.jsx index b5593d8..2d7dfdf 100644 --- a/src/components/Skills.jsx +++ b/src/components/Skills.jsx @@ -7,7 +7,7 @@ function Skills() { const [error, setError] = useState(null); useEffect(() => { - const fetchProjects = async () => { + const fetchSkills = async () => { try { const response = await fetch('/api/skills'); if (!response.ok) { @@ -19,7 +19,7 @@ function Skills() { setError(err.message); } }; - fetchProjects(); + fetchSkills(); }, []); if (error) { -- 2.47.2 From ff5344147efbc1d38f33e15eb69b587534d39cb3 Mon Sep 17 00:00:00 2001 From: Giovanni-Josserand Date: Sun, 31 Aug 2025 18:21:48 +0200 Subject: [PATCH 4/4] update of projects section to use DB --- src/components/Projects.jsx | 51 ++++++++++++++++++------------------- 1 file changed, 25 insertions(+), 26 deletions(-) diff --git a/src/components/Projects.jsx b/src/components/Projects.jsx index f939bb3..70b66da 100644 --- a/src/components/Projects.jsx +++ b/src/components/Projects.jsx @@ -1,29 +1,28 @@ import SingleProject from "./SingleProject.jsx"; import "../styles/Projects.css" +import React, {useEffect, useState} from "react"; function Projects() { - const codevProject = { - title: "Codev", - image: "codev", - color: "orange", - nbImage: 5, - skills: ['HTML', 'CSS', 'PHP', 'JavaScript', 'SQL'], - description: "A collaborative platform where developers can create, share, and grow coding projects. Built for solo makers or teams, it features real-time messaging and a centralized workspace." - } - const SAECProject = { - title: "SAE C++", - image: "SAE_C++", - color: "purple", - nbImage: 3, - skills: ['C++', 'Git'], - description: "A C++ program developed for creating and managing treasure hunt records, with a web interface that allows browsing and consulting the entries." - } - const proxmoxProject = { - title: "Proxmox", - image: "proxmox", - color: "green", - nbImage: 5, - skills: [], - description: "A Proxmox-based infrastructure that consolidates my personal cloud, home automation, code hosting, media services and web hosting into a single, self-hosted environment." + const [projects, setProjects] = useState([]); + const [error, setError] = useState(null); + + useEffect(() => { + const fetchProjects = async () => { + try { + const response = await fetch('/api/projects'); + if (!response.ok) { + throw new Error(`Erreur HTTP: ${response.status}`); + } + const data = await response.json(); + setProjects(data.data); + } catch (err) { + setError(err.message); + } + }; + fetchProjects(); + }, []); + + if (error) { + return
Erreur lors de la récupération des données : {error}
; } @@ -31,9 +30,9 @@ function Projects() {

Projects

- - - + {projects.map(project => ( + + ))}

-- 2.47.2