diff --git a/TP Blazor/Models/Item.cs b/TP Blazor/Models/Item.cs
new file mode 100644
index 0000000..602090d
--- /dev/null
+++ b/TP Blazor/Models/Item.cs	
@@ -0,0 +1,16 @@
+using System;
+namespace TP_Blazor.Models;
+
+public class Item
+{
+    public int Id { get; set; }
+    public string DisplayName { get; set; }
+    public string Name { get; set; }
+    public int StackSize { get; set; }
+    public int MaxDurability { get; set; }
+    public List<string> EnchantCategories { get; set; }
+    public List<string> RepairWith { get; set; }
+    public DateTime CreatedDate { get; set; }
+    public DateTime? UpdatedDate { get; set; }
+}
+
diff --git a/TP Blazor/Pages/Counter.razor b/TP Blazor/Pages/Counter.razor
index ef23cb3..a967704 100644
--- a/TP Blazor/Pages/Counter.razor	
+++ b/TP Blazor/Pages/Counter.razor	
@@ -8,11 +8,4 @@
 
 <button class="btn btn-primary" @onclick="IncrementCount">Click me</button>
 
-@code {
-    private int currentCount = 0;
 
-    private void IncrementCount()
-    {
-        currentCount++;
-    }
-}
diff --git a/TP Blazor/Pages/Counter.razor.cs b/TP Blazor/Pages/Counter.razor.cs
new file mode 100644
index 0000000..98df3b9
--- /dev/null
+++ b/TP Blazor/Pages/Counter.razor.cs	
@@ -0,0 +1,18 @@
+using System;
+namespace TP_Blazor.Pages
+{
+    public partial class Counter
+    {
+        public Counter()
+        {
+        }
+
+        private int currentCount = 0;
+
+        private void IncrementCount()
+        {
+            currentCount++;
+        }
+    }
+}
+
diff --git a/TP Blazor/Pages/DoctorWhoLayout.razor b/TP Blazor/Pages/DoctorWhoLayout.razor
new file mode 100644
index 0000000..6c58afa
--- /dev/null
+++ b/TP Blazor/Pages/DoctorWhoLayout.razor	
@@ -0,0 +1,17 @@
+@inherits LayoutComponentBase
+
+    <header>
+        <h1>Doctor Who&trade; Episode Database</h1>
+    </header>
+
+    <nav>
+        <a href="masterlist">Master Episode List</a>
+        <a href="search">Search</a>
+        <a href="new">Add Episode</a>
+    </nav>
+
+@Body
+
+<footer>
+    @TrademarkMessage
+</footer>
diff --git a/TP Blazor/Pages/DoctorWhoLayout.razor.cs b/TP Blazor/Pages/DoctorWhoLayout.razor.cs
new file mode 100644
index 0000000..10087cd
--- /dev/null
+++ b/TP Blazor/Pages/DoctorWhoLayout.razor.cs	
@@ -0,0 +1,13 @@
+using System;
+namespace TP_Blazor.Pages
+{
+    public partial class DoctorWhoLayout
+    {
+        public DoctorWhoLayout()
+        {
+        }
+
+        public string TrademarkMessage { get; set; } ="Doctor Who is a registered trademark of the BBC. " + "https://www.doctorwho.tv/";
+    }
+}
+
diff --git a/TP Blazor/Pages/Episode.razor b/TP Blazor/Pages/Episode.razor
new file mode 100644
index 0000000..ad6993d
--- /dev/null
+++ b/TP Blazor/Pages/Episode.razor	
@@ -0,0 +1,7 @@
+@page "/episodes"
+@layout DoctorWhoLayout
+
+<h3>Episodes</h3>
+
+
+
diff --git a/TP Blazor/Pages/Episode.razor.cs b/TP Blazor/Pages/Episode.razor.cs
new file mode 100644
index 0000000..036172f
--- /dev/null
+++ b/TP Blazor/Pages/Episode.razor.cs	
@@ -0,0 +1,11 @@
+using System;
+namespace TP_Blazor.Pages
+{
+    public partial class Episode
+    {
+        public Episode()
+        {
+        }
+    }
+}
+
diff --git a/TP Blazor/Pages/FetchData.razor b/TP Blazor/Pages/FetchData.razor
index 4bc2628..190ad9a 100644
--- a/TP Blazor/Pages/FetchData.razor	
+++ b/TP Blazor/Pages/FetchData.razor	
@@ -37,11 +37,3 @@ else
     </table>
 }
 
-@code {
-    private WeatherForecast[]? forecasts;
-
-    protected override async Task OnInitializedAsync()
-    {
-        forecasts = await ForecastService.GetForecastAsync(DateOnly.FromDateTime(DateTime.Now));
-    }
-}
diff --git a/TP Blazor/Pages/FetchData.razor.cs b/TP Blazor/Pages/FetchData.razor.cs
new file mode 100644
index 0000000..ad286c6
--- /dev/null
+++ b/TP Blazor/Pages/FetchData.razor.cs	
@@ -0,0 +1,19 @@
+using System;
+using TP_Blazor.Data;
+
+namespace TP_Blazor.Pages
+{
+    public partial class FetchData
+    {
+        public FetchData()
+        {
+        }
+        private WeatherForecast[]? forecasts;
+
+        protected override async Task OnInitializedAsync()
+        {
+            forecasts = await ForecastService.GetForecastAsync(DateOnly.FromDateTime(DateTime.Now));
+        }
+    }
+}
+
diff --git a/TP Blazor/Pages/List.razor b/TP Blazor/Pages/List.razor
new file mode 100644
index 0000000..756d0bb
--- /dev/null
+++ b/TP Blazor/Pages/List.razor	
@@ -0,0 +1,27 @@
+@page "/list"
+@using TP_Blazor.Models
+<h3>Liste</h3>
+
+@*@if (items!=null)
    {
        <table class="table">
            <thead>
                <tr>
+                    <th>Id</th>
+                    <th>Display Name</th>
+                    <th>Stack Size</th>
+                    <th>Maximum Durability</th>
+                    <th>Enchant Categories</th>
+                    <th>Repair With</th>
+                    <th>Created Date</th>
+                </tr>
            </thead>
            <tbody>
+                @foreach (var item in items)
+                {
+                    <tr>
+                        <td>@item.Id</td>
+                        <td>@item.DisplayName</td>
+                        <td>@item.StackSize</td>
+                        <td>@item.MaxDurability</td>
+                        <td>@(string.Join(", ", item.EnchantCategories))</td>
+                        <td>@(string.Join(", ", item.RepairWith))</td>
+                        <td>@item.CreatedDate.ToShortDateString()</td>
+                    </tr>
+                }
+            </tbody>
        </table>

    }*@

<DataGrid TItem="Item" Data="@items" PageSize="int.MaxValue" Responsive>
+</DataGrid>
\ No newline at end of file
diff --git a/TP Blazor/Pages/List.razor.cs b/TP Blazor/Pages/List.razor.cs
new file mode 100644
index 0000000..3173501
--- /dev/null
+++ b/TP Blazor/Pages/List.razor.cs	
@@ -0,0 +1,26 @@
+using System;
+using Microsoft.AspNetCore.Components;
+using TP_Blazor.Models;
+
+namespace TP_Blazor.Pages;
+
+public partial class List
+{
+    public List()
+    {
+    }
+
+    private Item[] items;
+
+    [Inject]
+    public HttpClient Http { get; set; }
+
+    [Inject]
+    public NavigationManager NavigationManager { get; set; }
+
+    protected override async Task OnInitializedAsync()
+    {
+        items = await Http.GetFromJsonAsync<Item[]>($"{NavigationManager.BaseUri}fake-data.json");
+    }
+}
+
diff --git a/TP Blazor/Pages/_Host.cshtml b/TP Blazor/Pages/_Host.cshtml
index bf8a605..b6b8f8c 100644
--- a/TP Blazor/Pages/_Host.cshtml	
+++ b/TP Blazor/Pages/_Host.cshtml	
@@ -10,9 +10,14 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <base href="~/" />
     <link rel="stylesheet" href="css/bootstrap/bootstrap.min.css" />
+
     <link href="css/site.css" rel="stylesheet" />
     <link href="TP Blazor.styles.css" rel="stylesheet" />
-    <link rel="icon" type="image/png" href="favicon.png"/>
+    <link rel="icon" type="image/png" href="favicon.png" />
+    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.4/css/all.css">
+    <link rel="stylesheet" href="_content/Blazorise.Icons.Material/blazorise.icons.material.css" />
+    <link href="_content/Blazorise/blazorise.css" rel="stylesheet" />
+    <link href="_content/Blazorise.Bootstrap/blazorise.bootstrap.css" rel="stylesheet" />
     <component type="typeof(HeadOutlet)" render-mode="ServerPrerendered" />
 </head>
 <body>
diff --git a/TP Blazor/Program.cs b/TP Blazor/Program.cs
index 84fac44..a9c4600 100644
--- a/TP Blazor/Program.cs	
+++ b/TP Blazor/Program.cs	
@@ -1,6 +1,10 @@
 using Microsoft.AspNetCore.Components;
 using Microsoft.AspNetCore.Components.Web;
 using TP_Blazor.Data;
+using Blazorise;
+using Blazorise.Icons.FontAwesome;
+using Microsoft.Extensions.DependencyInjection;
+using Blazorise.Bootstrap;
 
 var builder = WebApplication.CreateBuilder(args);
 
@@ -8,6 +12,10 @@ var builder = WebApplication.CreateBuilder(args);
 builder.Services.AddRazorPages();
 builder.Services.AddServerSideBlazor();
 builder.Services.AddSingleton<WeatherForecastService>();
+builder.Services.AddHttpClient();
+builder.Services.AddBlazorise()
+    .AddBootstrapComponents()
+    .AddFontAwesomeIcons();
 
 var app = builder.Build();
 
diff --git a/TP Blazor/Properties/launchSettings.json b/TP Blazor/Properties/launchSettings.json
index 6b6ebd5..64edb47 100644
--- a/TP Blazor/Properties/launchSettings.json	
+++ b/TP Blazor/Properties/launchSettings.json	
@@ -10,7 +10,6 @@
   "profiles": {
     "http": {
       "commandName": "Project",
-      "dotnetRunMessages": true,
       "launchBrowser": true,
       "applicationUrl": "http://localhost:5245",
       "environmentVariables": {
@@ -25,4 +24,4 @@
       }
     }
   }
-}
+}
\ No newline at end of file
diff --git a/TP Blazor/Shared/NavMenu.razor b/TP Blazor/Shared/NavMenu.razor
index df0d16a..86eabf2 100644
--- a/TP Blazor/Shared/NavMenu.razor	
+++ b/TP Blazor/Shared/NavMenu.razor	
@@ -15,25 +15,15 @@
             </NavLink>
         </div>
         <div class="nav-item px-3">
-            <NavLink class="nav-link" href="counter">
-                <span class="oi oi-plus" aria-hidden="true"></span> Counter
+            <NavLink class="nav-link" href="list" Match="NavLinkMatch.All">
+                <span class="oi oi-list-rich" aria-hidden="true"></span>Listes
             </NavLink>
         </div>
         <div class="nav-item px-3">
-            <NavLink class="nav-link" href="fetchdata">
-                <span class="oi oi-list-rich" aria-hidden="true"></span> Fetch data
+            <NavLink class="nav-link" href="counter">
+                <span class="oi oi-plus" aria-hidden="true"></span> Counter
             </NavLink>
         </div>
     </nav>
 </div>
 
-@code {
-    private bool collapseNavMenu = true;
-
-    private string? NavMenuCssClass => collapseNavMenu ? "collapse" : null;
-
-    private void ToggleNavMenu()
-    {
-        collapseNavMenu = !collapseNavMenu;
-    }
-}
diff --git a/TP Blazor/Shared/NavMenu.razor.cs b/TP Blazor/Shared/NavMenu.razor.cs
new file mode 100644
index 0000000..940c063
--- /dev/null
+++ b/TP Blazor/Shared/NavMenu.razor.cs	
@@ -0,0 +1,19 @@
+using System;
+namespace TP_Blazor.Shared
+{
+    public partial class NavMenu
+    {
+        public NavMenu()
+        {
+        }
+        private bool collapseNavMenu = true;
+
+        private string? NavMenuCssClass => collapseNavMenu ? "collapse" : null;
+
+        private void ToggleNavMenu()
+        {
+            collapseNavMenu = !collapseNavMenu;
+        }
+    }
+}
+
diff --git a/TP Blazor/Shared/SurveyPrompt.razor.cs b/TP Blazor/Shared/SurveyPrompt.razor.cs
new file mode 100644
index 0000000..2803f6d
--- /dev/null
+++ b/TP Blazor/Shared/SurveyPrompt.razor.cs	
@@ -0,0 +1,17 @@
+using System;
+namespace TP_Blazor.Shared
+{
+    public partial class SurveyPrompt
+    {
+        public SurveyPrompt()
+        {
+        }
+
+        private int currentCount = 0;
+        private void IncrementCount()
+        {
+            currentCount++;
+        }
+    }
+}
+
diff --git a/TP Blazor/TP Blazor.csproj b/TP Blazor/TP Blazor.csproj
index d58da0a..a053178 100644
--- a/TP Blazor/TP Blazor.csproj	
+++ b/TP Blazor/TP Blazor.csproj	
@@ -7,4 +7,19 @@
     <RootNamespace>TP_Blazor</RootNamespace>
   </PropertyGroup>
 
+  <PropertyGroup Condition=" '$(RunConfiguration)' == 'http' " />
+  <ItemGroup>
+    <None Remove="Blazorise.Icons.FontAwesome" />
+    <None Remove="Models\" />
+    <None Remove="Blazorise.DataGrid" />
+    <None Remove="Blazorise.Bootstrap" />
+  </ItemGroup>
+  <ItemGroup>
+    <PackageReference Include="Blazorise.Icons.FontAwesome" Version="1.1.5" />
+    <PackageReference Include="Blazorise.DataGrid" Version="1.1.5" />
+    <PackageReference Include="Blazorise.Bootstrap" Version="1.1.5" />
+  </ItemGroup>
+  <ItemGroup>
+    <Folder Include="Models\" />
+  </ItemGroup>
 </Project>
diff --git a/TP Blazor/_Imports.razor b/TP Blazor/_Imports.razor
index a58ff79..a029dcc 100644
--- a/TP Blazor/_Imports.razor	
+++ b/TP Blazor/_Imports.razor	
@@ -8,3 +8,4 @@
 @using Microsoft.JSInterop
 @using TP_Blazor
 @using TP_Blazor.Shared
+@using Blazorise.DataGrid
diff --git a/TP Blazor/wwwroot/fake-data.json b/TP Blazor/wwwroot/fake-data.json
new file mode 100644
index 0000000..c13429b
--- /dev/null
+++ b/TP Blazor/wwwroot/fake-data.json	
@@ -0,0 +1,227 @@
+[
+    {
+        "id": 1,
+        "displayname": "Zytrac",
+        "name": "zytrac",
+        "stacksize": 50,
+        "maxdurability": 33,
+        "enchantcategories": [
+            "breakable",
+            "digger"
+        ],
+        "repairwith": [
+            "warped_planks",
+            "dark_oak_planks"
+        ],
+        "createddate": "2018-10-31",
+        "updateddate": "2014-11-11"
+    },
+    {
+        "id": 2,
+        "displayname": "Printspan",
+        "name": "printspan",
+        "stacksize": 26,
+        "maxdurability": 63,
+        "enchantcategories": [
+            "weapon"
+        ],
+        "repairwith": [
+            "jungle_planks",
+            "jungle_planks"
+        ],
+        "createddate": "2015-11-23",
+        "updateddate": "2022-09-15"
+    },
+    {
+        "id": 3,
+        "displayname": "Vitricomp",
+        "name": "vitricomp",
+        "stacksize": 62,
+        "maxdurability": 79,
+        "enchantcategories": [
+            "armor_chest",
+            "breakable"
+        ],
+        "repairwith": [
+            "warped_planks"
+        ],
+        "createddate": "2022-08-11",
+        "updateddate": null
+    },
+    {
+        "id": 4,
+        "displayname": "Turnabout",
+        "name": "turnabout",
+        "stacksize": 36,
+        "maxdurability": 105,
+        "enchantcategories": [],
+        "repairwith": [
+            "crimson_planks"
+        ],
+        "createddate": "2021-05-04",
+        "updateddate": null
+    },
+    {
+        "id": 5,
+        "displayname": "Medesign",
+        "name": "medesign",
+        "stacksize": 13,
+        "maxdurability": 95,
+        "enchantcategories": [],
+        "repairwith": [
+            "dark_oak_planks",
+            "birch_planks"
+        ],
+        "createddate": "2018-01-27",
+        "updateddate": null
+    },
+    {
+        "id": 6,
+        "displayname": "Micronaut",
+        "name": "micronaut",
+        "stacksize": 29,
+        "maxdurability": 59,
+        "enchantcategories": [
+            "armor_head",
+            "armor_head"
+        ],
+        "repairwith": [
+            "spruce_planks"
+        ],
+        "createddate": "2022-04-15",
+        "updateddate": "2019-07-05"
+    },
+    {
+        "id": 7,
+        "displayname": "Webiotic",
+        "name": "webiotic",
+        "stacksize": 4,
+        "maxdurability": 96,
+        "enchantcategories": [
+            "armor_chest",
+            "vanishable"
+        ],
+        "repairwith": [
+            "warped_planks",
+            "crimson_planks"
+        ],
+        "createddate": "2021-05-12",
+        "updateddate": null
+    },
+    {
+        "id": 8,
+        "displayname": "Opticall",
+        "name": "opticall",
+        "stacksize": 37,
+        "maxdurability": 121,
+        "enchantcategories": [
+            "weapon",
+            "digger"
+        ],
+        "repairwith": [],
+        "createddate": "2020-04-29",
+        "updateddate": null
+    },
+    {
+        "id": 9,
+        "displayname": "Scenty",
+        "name": "scenty",
+        "stacksize": 19,
+        "maxdurability": 101,
+        "enchantcategories": [
+            "weapon",
+            "digger",
+            "armor"
+        ],
+        "repairwith": [],
+        "createddate": "2017-08-03",
+        "updateddate": "2017-01-26"
+    },
+    {
+        "id": 10,
+        "displayname": "Enquility",
+        "name": "enquility",
+        "stacksize": 57,
+        "maxdurability": 54,
+        "enchantcategories": [
+            "armor_head",
+            "digger"
+        ],
+        "repairwith": [],
+        "createddate": "2020-12-16",
+        "updateddate": null
+    },
+    {
+        "id": 11,
+        "displayname": "Zytrex",
+        "name": "zytrex",
+        "stacksize": 53,
+        "maxdurability": 99,
+        "enchantcategories": [
+            "weapon",
+            "weapon",
+            "armor_chest"
+        ],
+        "repairwith": [
+            "oak_planks"
+        ],
+        "createddate": "2014-08-12",
+        "updateddate": null
+    },
+    {
+        "id": 12,
+        "displayname": "Kyaguru",
+        "name": "kyaguru",
+        "stacksize": 25,
+        "maxdurability": 123,
+        "enchantcategories": [],
+        "repairwith": [
+            "dark_oak_planks",
+            "dark_oak_planks"
+        ],
+        "createddate": "2022-09-25",
+        "updateddate": null
+    },
+    {
+        "id": 13,
+        "displayname": "Digirang",
+        "name": "digirang",
+        "stacksize": 35,
+        "maxdurability": 119,
+        "enchantcategories": [
+            "vanishable",
+            "breakable"
+        ],
+        "repairwith": [],
+        "createddate": "2022-03-24",
+        "updateddate": null
+    },
+    {
+        "id": 14,
+        "displayname": "Marqet",
+        "name": "marqet",
+        "stacksize": 11,
+        "maxdurability": 40,
+        "enchantcategories": [
+            "breakable",
+            "weapon"
+        ],
+        "repairwith": [],
+        "createddate": "2018-12-14",
+        "updateddate": "2022-03-07"
+    },
+    {
+        "id": 15,
+        "displayname": "Helixo",
+        "name": "helixo",
+        "stacksize": 41,
+        "maxdurability": 57,
+        "enchantcategories": [],
+        "repairwith": [
+            "dark_oak_planks",
+            "oak_planks"
+        ],
+        "createddate": "2018-10-21",
+        "updateddate": null
+    }
+]
\ No newline at end of file