Added frontend and working fetching.

frontend/pages/progress.vue

@@ -5,44 +5,44 @@ const progress = getProgress();
 </script>
 
 <template>
-  <div class="m-auto">
+  <div class="h-screen grid place-items-center">
     <div v-if="progress">
-      <table class="table-auto text-left">
+      <table class="table-auto border-gray-300">
         <thead>
         <tr>
-          <th>Metric</th>
-          <th>Value</th>
+          <th class="px-4 py-2">Metric</th>
+          <th class="px-4 py-2">Value</th>
         </tr>
         </thead>
 
-        <tbody>
+        <tbody >
         <tr>
-          <td>Percentage of Ipv4 scanned</td>
-          <td>{{progress.percentageOfIpv4Scanned}}</td>
+          <td class="px-4 py-2">Percentage of Ipv4 scanned</td>
+          <td class="px-4 py-2">{{progress.percentageOfIpv4Scanned}}</td>
         </tr>
         <tr>
-          <td>Total filtered</td>
-          <td>{{progress.totalFiltered}}</td>
+          <td class="px-4 py-2">Total filtered</td>
+          <td class="px-4 py-2">{{progress.totalFiltered}}</td>
         </tr>
         <tr>
-          <td>Total Discarded</td>
-          <td>{{progress.totalDiscarded}}</td>
+          <td class="px-4 py-2">Total Discarded</td>
+          <td class="px-4 py-2">{{progress.totalDiscarded}}</td>
         </tr>
         <tr>
-          <td>Amount of Ipv4 left</td>
-          <td>{{progress.amountOfIpv4Left}}</td>
+          <td class="px-4 py-2">Amount of Ipv4 left</td>
+          <td class="px-4 py-2">{{progress.amountOfIpv4Left}}</td>
         </tr>
         <tr>
-          <td>Discarded db size</td>
-          <td>{{progress.discardedDbSize}}</td>
+          <td class="px-4 py-2">Discarded db size</td>
+          <td class="px-4 py-2">{{progress.discardedDbSize}}</td>
         </tr>
         <tr>
-          <td>Filtered db size</td>
-          <td>{{progress.filteredDbSize}}</td>
+          <td class="px-4 py-2">Filtered db size</td>
+          <td class="px-4 py-2">{{progress.filteredDbSize}}</td>
         </tr>
         <tr>
-          <td>Unfiltered db size</td>
-          <td>{{progress.myDbSize}}</td>
+          <td class="px-4 py-2">Unfiltered db size</td>
+          <td class="px-4 py-2">{{progress.myDbSize}}</td>
         </tr>
         </tbody>
       </table>