diff --git a/PokemonSleep.Web/Controllers/HomeController.cs b/PokemonSleep.Web/Controllers/HomeController.cs
index 179578b..98c357c 100644
--- a/PokemonSleep.Web/Controllers/HomeController.cs
+++ b/PokemonSleep.Web/Controllers/HomeController.cs
@@ -1,5 +1,7 @@
 using Microsoft.AspNetCore.Mvc;
+using Newtonsoft.Json;
 using PokemonSleep.Web.Models;
+using PokemonSleep.Web.Service.IService;
 using System.Diagnostics;
 
 namespace PokemonSleep.Web.Controllers
@@ -7,15 +9,42 @@ namespace PokemonSleep.Web.Controllers
     public class HomeController : Controller
     {
         private readonly ILogger<HomeController> _logger;
+        private readonly IPokemonService _pokemonService;
+        private readonly IPokemonNatureService _natureService;
+        private readonly IPokemonSubskillService _subskillService;
 
-        public HomeController(ILogger<HomeController> logger)
+        public HomeController(ILogger<HomeController> logger, IPokemonService pokemonService, IPokemonNatureService natureService, IPokemonSubskillService subskillService)
         {
+            _pokemonService = pokemonService;
+            _natureService = natureService;
+            _subskillService = subskillService;
             _logger = logger;
         }
 
-        public IActionResult Index()
+
+        public async Task<IActionResult> Index()
         {
-            return View();
+            PokemonSleepDto? list = new();
+
+            ResponseDto? presponse = await _pokemonService.GetAllPokemonAsync();
+            ResponseDto? nresponse = await _natureService.GetAllPokemonNaturesAsync();
+            ResponseDto? sresponse = await _subskillService.GetAllPokemonSubskillsAsync();
+
+            if (presponse != null && presponse.IsSuccess)
+            {
+                list.pokemonList = JsonConvert.DeserializeObject<List<PokemonDto>>(Convert.ToString(presponse.Result));
+            }
+            if (nresponse != null && nresponse.IsSuccess)
+            {
+                list.natureList = JsonConvert.DeserializeObject<List<PokemonNatureDto>>(Convert.ToString(nresponse.Result));
+            }
+            if (sresponse != null && sresponse.IsSuccess)
+            {
+                list.subskillList = JsonConvert.DeserializeObject<List<PokemonSubskillDto>>(Convert.ToString(sresponse.Result));
+            }
+
+
+            return View(list);
         }
 
         public IActionResult Privacy()
diff --git a/PokemonSleep.Web/Controllers/PokemonController.cs b/PokemonSleep.Web/Controllers/PokemonController.cs
index 6c384e2..be141e6 100644
--- a/PokemonSleep.Web/Controllers/PokemonController.cs
+++ b/PokemonSleep.Web/Controllers/PokemonController.cs
@@ -28,12 +28,18 @@ namespace PokemonSleep.Web.Controllers
             if (presponse != null && presponse.IsSuccess)
             {
                 list.pokemonList = JsonConvert.DeserializeObject<List<PokemonDto>>(Convert.ToString(presponse.Result));
-                list.natureList = JsonConvert.DeserializeObject<List<PokemonNatureDto>>(Convert.ToString(nresponse.Result));
-                list.subskillList = JsonConvert.DeserializeObject<List<PokemonSubskillDto>>(Convert.ToString(sresponse.Result));
             }
-            
+			if (nresponse != null && nresponse.IsSuccess)
+			{
+				list.natureList = JsonConvert.DeserializeObject<List<PokemonNatureDto>>(Convert.ToString(nresponse.Result));
+			}
+			if (sresponse != null && sresponse.IsSuccess)
+			{
+				list.subskillList = JsonConvert.DeserializeObject<List<PokemonSubskillDto>>(Convert.ToString(sresponse.Result));
+			}
 
-            return View(list);
+
+			return View(list);
         }
     }
 }
diff --git a/PokemonSleep.Web/PokemonSleep.Web.csproj b/PokemonSleep.Web/PokemonSleep.Web.csproj
index a97e685..03c3b65 100644
--- a/PokemonSleep.Web/PokemonSleep.Web.csproj
+++ b/PokemonSleep.Web/PokemonSleep.Web.csproj
@@ -10,4 +10,8 @@
     <PackageReference Include="Newtonsoft.Json" Version="13.0.3" />
   </ItemGroup>
 
+  <ItemGroup>
+    <ProjectReference Include="..\PokemonSleepAPI\PokemonSleepAPI.csproj" />
+  </ItemGroup>
+
 </Project>
diff --git a/PokemonSleep.Web/Service/IService/IPokeAPI.cs b/PokemonSleep.Web/Service/IService/IPokeAPI.cs
new file mode 100644
index 0000000..48af417
--- /dev/null
+++ b/PokemonSleep.Web/Service/IService/IPokeAPI.cs
@@ -0,0 +1,14 @@
+using PokemonSleep.Web.Models;
+using PokemonSleepAPI.Models;
+using System.Threading.Tasks;
+
+namespace PokemonSleep.Web.Service.IService
+{
+	public interface IPokeAPI 
+	{
+		Task<ResponseDto?> GetPokemonAsync(string species);
+		Task<Pokemon> GetPokemonByUrlAsync(string url);
+		Task<List<Pokemon>> GetAllPokemonWithDetailsAsync();
+
+	}
+}
diff --git a/PokemonSleep.Web/Views/Home/Index.cshtml b/PokemonSleep.Web/Views/Home/Index.cshtml
index bcfd79a..b3285a4 100644
--- a/PokemonSleep.Web/Views/Home/Index.cshtml
+++ b/PokemonSleep.Web/Views/Home/Index.cshtml
@@ -2,7 +2,41 @@
     ViewData["Title"] = "Home Page";
 }
 
+@model PokemonSleepDto
+
 <div class="text-center">
     <h1 class="display-4">Welcome</h1>
     <p>Learn about <a href="https://learn.microsoft.com/aspnet/core">building Web apps with ASP.NET Core</a>.</p>
+    <button>Add Pokemon</button>
+</div>
+<div style ="margin: auto; width: 600px; max-width: 50%; ">
+    <table class="table" style="text-align: center; border: 1px solid purple;">
+        <thead style="border-bottom: 1px solid purple;">
+            <tr>
+                <th scope="col" style="width: 50%;"></th>
+                <th scope="col">#</th>
+                <th scope="col">Pokemon</th>
+                <th scope="col">Sleep Type</th>
+                <th scope="col" style="padding-right: 30px;">Speciality</th>
+            </tr>
+        </thead>
+        <tbody>
+            @foreach (var pokemon in Model.pokemonList)
+            {
+                string URL = "https://www.serebii.net/pokemonsleep/pokemon/" + pokemon.Id + ".png";
+                string ShinyURL = "https://www.serebii.net/pokemonsleep/pokemon/shiny/" + pokemon.Id + ".png";
+
+                <tr style=" text-align: center; margin:0; padding: 0; border-bottom: 1px solid purple;">
+                    <td style="display: block; margin:0; padding: 0;">
+                        <img style=" width: 90px; height: 90px;  " src=@URL />
+                        <img style=" width: 90px; height: 90px;  " src=@ShinyURL />
+                    </td>
+                    <th scope="row">@pokemon.Id</th>
+                    <td> @pokemon.Name</td>
+                    <td>@pokemon.SleepType</td>
+                    <td style="padding-right: 30px;">@pokemon.Speciality</td>
+                </tr>
+            }
+        </tbody>
+    </table>
 </div>
diff --git a/PokemonSleep.Web/Views/Pokemon/PokemonIndex.cshtml b/PokemonSleep.Web/Views/Pokemon/PokemonIndex.cshtml
index 3a1431c..0dd78f6 100644
--- a/PokemonSleep.Web/Views/Pokemon/PokemonIndex.cshtml
+++ b/PokemonSleep.Web/Views/Pokemon/PokemonIndex.cshtml
@@ -1,4 +1,5 @@
 @model PokemonSleepDto
+
 <div class="card shadow border-0 mt-4">
 	<div class="card-header bg-secondary bg-gradient ml-0 py-3">
 		<div class="row">
@@ -34,12 +35,18 @@
 			<tbody>
 
 				<tr>
+                    <!--<td><img src="https://www.serebii.net/pokemonsleep/pokemon/{pokemon.Id}.png" alt="Girl in a jacket" width="300" height="300"></td> -->
 					<td>
 						<select class="form-control form-control-lg">
 							<option value="" disabled selected>Choose your Pokémon...</option>
 							@foreach(var pokemon in Model.pokemonList)
 							{
-								<option>@pokemon.Id @pokemon.Name</option>
+								string URL = "https://www.serebii.net/pokemonsleep/pokemon/" + pokemon.Id + ".png";
+									
+										<img style=" width: 30px; height: 30px; border: 1px solid green; " src=@URL />
+										<option>@pokemon.Id @pokemon.Name</option>
+								
+								
 							}
 						</select>
 					</td>
@@ -113,3 +120,4 @@
 
 </div>
 
+
diff --git a/PokemonSleepAPI/Data/PokemonDbContext.cs b/PokemonSleepAPI/Data/PokemonDbContext.cs
index 85606ac..f262363 100644
--- a/PokemonSleepAPI/Data/PokemonDbContext.cs
+++ b/PokemonSleepAPI/Data/PokemonDbContext.cs
@@ -25,7 +25,7 @@ namespace PokemonSleepAPI.Data
                 SleepType = "Dozing",
                 Speciality = "Ingredients"
 
-            });
+			});
             modelBuilder.Entity<Pokemon>().HasData(new Pokemon
             {
                 Id = 2,
diff --git a/PokemonSleepAPI/Models/Dto/PokemonDto.cs b/PokemonSleepAPI/Models/Dto/PokemonDto.cs
index 470ae59..950641e 100644
--- a/PokemonSleepAPI/Models/Dto/PokemonDto.cs
+++ b/PokemonSleepAPI/Models/Dto/PokemonDto.cs
@@ -6,5 +6,6 @@
         public string Name { get; set; }
         public string SleepType { get; set; }
         public string Speciality { get; set; }
+
     }
 }