header for the site, and making the 1st layout for the components, still trying to figure out the framework

front/MyINPulse-front/src/App.vue

@@ -1,11 +1,48 @@
 <script setup lang="ts">
 import { RouterLink, RouterView } from 'vue-router'
 import HelloWorld from './components/HelloWorld.vue'
+import Header from './components/Header.vue';
+import ProjectComp from './components/Project-comp.vue';
 </script>
 
 <template>
   <RouterView />
+  <Header />
+  <div id="main">
+      <ProjectComp 
+        v-for="(project, index) in projects" 
+        :key="index"
+        :projectName="project.name"
+      />
+    </div>
 </template>
 
 <style scoped>
 </style>
+
+<script lang="ts">
+export default {
+  name: 'App',
+  components: {
+    Header,
+    ProjectComp,
+  },
+  data() {
+    return {
+      projects: [
+        {
+          name: 'Projet Alpha',
+          //link: './project-alpha.html',
+          //members: ['Alice', 'Bob', 'Charlie'],
+        },
+        {
+          name: 'Projet Beta',
+          //link: './project-beta.html',
+          //members: ['David', 'Eve', 'Frank'],
+        },
+      ],
+    };
+  },
+};
+
+</script>