diff --git a/Blazor/Blazor/Pages/Chapters.razor b/Blazor/Blazor/Pages/Chapters.razor
index 3ba135f..641bdc5 100644
--- a/Blazor/Blazor/Pages/Chapters.razor
+++ b/Blazor/Blazor/Pages/Chapters.razor
@@ -1,13 +1,13 @@
 @page "/chapters"
 @using Blazor.Models
 <h3>Liste</h3>
-<DataGrid TItem="Item"
-          Data="@items"
+<DataGrid TItem="ChaptersModel"
+          Data="@chapters"
           ReadData="@OnReadData"
-          TotalItems="@totalItem"
+          TotalItems="@totalChapter"
           PageSize="10"
           ShowPager
           Responsive>
-    <DataGridColumn TItem="Item" Field="@nameof(ChaptersModel.Id)" Caption="#" />
-    <DataGridColumn TItem="Item" Field="@nameof(ChaptersModel.Name)" Caption="Display name" />
+    <DataGridColumn TItem="ChaptersModel" Field="@nameof(ChaptersModel.Id)" Caption="#" />
+    <DataGridColumn TItem="ChaptersModel" Field="@nameof(ChaptersModel.Name)" Caption="Name" />
 </DataGrid>
\ No newline at end of file
diff --git a/Blazor/Blazor/Pages/Chapters.razor.cs b/Blazor/Blazor/Pages/Chapters.razor.cs
index ae50696..21ff61e 100644
--- a/Blazor/Blazor/Pages/Chapters.razor.cs
+++ b/Blazor/Blazor/Pages/Chapters.razor.cs
@@ -6,9 +6,9 @@ using Microsoft.AspNetCore.Components;
 namespace Blazor.Pages;
 public partial class Chapters
 {
-    private List<ChaptersModel> items;
+    private List<ChaptersModel> chapters;
 
-    private int totalItem;
+    private int totalChapter;
 
     [Inject]
     public IWebHostEnvironment WebHostEnvironment { get; set; }
@@ -49,13 +49,13 @@ public partial class Chapters
         }
 
         // When you use a real API, we use this follow code
-        //var response = await Http.GetJsonAsync<Data[]>( $"http://my-api/api/data?page={e.Page}&pageSize={e.PageSize}" );
-        var response = (await LocalStorage.GetItemAsync<ChaptersModel[]>("data")).Skip((e.Page - 1) * e.PageSize).Take(e.PageSize).ToList();
+        //var response = await Http.GetFromJsonAsync<ChaptersModel[]>( $"https://trusting-panini.87-106-126-109.plesk.page/api/chapters?page={e.Page}&pageSize={e.PageSize}" );
+        var response = Http.GetFromJsonAsync<ChaptersModel[]>($"https://trusting-panini.87-106-126-109.plesk.page/api/chapters").Result;
 
         if (!e.CancellationToken.IsCancellationRequested)
         {
-            totalItem = (await LocalStorage.GetItemAsync<List<AdministratorsModel>>("data")).Count;
-            items = new List<ChaptersModel>(response); // an actual data for the current page
+            totalChapter = (await LocalStorage.GetItemAsync<List<ChaptersModel>>("data")).Count;
+            chapters = new List<ChaptersModel>(response); // an actual data for the current page
         }
     }
 }
\ No newline at end of file
diff --git a/Blazor/Blazor/_Imports.razor b/Blazor/Blazor/_Imports.razor
index 2945557..0bfa3cd 100644
--- a/Blazor/Blazor/_Imports.razor
+++ b/Blazor/Blazor/_Imports.razor
@@ -8,3 +8,4 @@
 @using Microsoft.JSInterop
 @using Blazor
 @using Blazor.Shared
+@using Blazorise.DataGrid