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

front/MyINPulse-front/src/components/Header.vue

@@ -0,0 +1,26 @@
+<template>
+    <header>
+      <img src="./icons/logo inpulse.png" alt="INPulse" />
+    </header>
+  </template>
+  
+  <script lang="ts">
+  export default {
+    name: 'Header',
+  };
+  </script>
+  
+  <style scoped>
+  header img {
+    width: 100px;
+  }
+
+  header{
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 10px 20px;
+    background-color: #fff;
+    border-bottom: 2px solid #ddd;
+  }
+  </style>

front/MyINPulse-front/src/components/Project-comp.vue

@@ -0,0 +1,18 @@
+<template>
+    <div class="project">
+        <div class="project-header">
+            <h2>{{ projectName }}</h2>
+        </div>
+
+    </div>
+</template>
+
+
+<script lang="ts">
+export default {
+    name: 'Project',
+    props: {
+        projectName: String,
+    }
+}
+</script>