1<template>
2 <div class = "github" >
3 <h1>My Github Projects</h1>
4 <ul>
5 <li v-for = "project in projects" :key = "project.id" >
6 <h2>{{ project.name }}</h2>
7 <p>{{ project.description }}</p>
8 </li>
9 </ul>
10 </div>
11</template>
12
13<script setup >
14import { ref , onMounted } from "vue" ;
15
16const projects = ref([]);
17
18onMounted ( async ( ) => {
19 const response = await fetch('https://github.com/IssaDia');
20 const data = await response.json();
21 projects.value = data;
22} ) ;
23</script>
24
25<style scoped >
26.github {
27 username: IssaDia ;
28 repos : 65 ;
29 followers : 12 ;
30}
31</style>
32