diff --git a/device-app/app/Http/Controllers/DeviceController.php b/device-app/app/Http/Controllers/DeviceController.php
new file mode 100644
index 0000000..9c01feb
--- /dev/null
+++ b/device-app/app/Http/Controllers/DeviceController.php
@@ -0,0 +1,24 @@
+<?php
+
+namespace App\Http\Controllers;
+
+use App\Models\Device;
+use Illuminate\Http\Request;
+
+class DeviceController extends Controller
+{
+    //
+    public function index()
+    {
+        return view('devices.index', [
+            'devices' => Device::all()
+        ]);
+    }
+
+    public function show(Device $device)
+    {
+        return view('devices.show', [
+            'device' => $device
+        ]);
+    }
+}
diff --git a/device-app/resources/views/components/device-card.blade.php b/device-app/resources/views/components/device-card.blade.php
new file mode 100644
index 0000000..dd691d8
--- /dev/null
+++ b/device-app/resources/views/components/device-card.blade.php
@@ -0,0 +1,4 @@
+@props(['device'])
+<div>
+    <a href="/devices/{{ $device['device_id'] }}">{{ $device->title }}</a>
+</div>
\ No newline at end of file
diff --git a/device-app/resources/views/deviceList.blade.php b/device-app/resources/views/devices/index.blade.php
similarity index 63%
rename from device-app/resources/views/deviceList.blade.php
rename to device-app/resources/views/devices/index.blade.php
index ab48492..0f076b0 100644
--- a/device-app/resources/views/deviceList.blade.php
+++ b/device-app/resources/views/devices/index.blade.php
@@ -5,12 +5,10 @@
     @unless(count($devices) == 0)
         <ul>
             @foreach ($devices as $device)
-                <li>
-                    <a href="/devices/{{ $device['device_id'] }}">{{ $device->title }}</a>
-                </li>
+                <x-device-card :device="$device" />
             @endforeach
         </ul>
     @else
         <p>No devices found</p>
     @endunless
-@endsection
\ No newline at end of file
+@endsection
diff --git a/device-app/resources/views/deviceDetail.blade.php b/device-app/resources/views/devices/show.blade.php
similarity index 97%
rename from device-app/resources/views/deviceDetail.blade.php
rename to device-app/resources/views/devices/show.blade.php
index 5543fca..dc468cd 100644
--- a/device-app/resources/views/deviceDetail.blade.php
+++ b/device-app/resources/views/devices/show.blade.php
@@ -12,4 +12,4 @@
         <li>{{ $device['serial_number'] }}</li>
         <li>{{ $device['image_url'] }}</li>
     </ul>
-@endsection
\ No newline at end of file
+@endsection
diff --git a/device-app/routes/web.php b/device-app/routes/web.php
index fda47db..716a9fa 100644
--- a/device-app/routes/web.php
+++ b/device-app/routes/web.php
@@ -1,5 +1,6 @@
 <?php
 
+use App\Http\Controllers\DeviceController;
 use Illuminate\Support\Facades\Route;
 use App\Models\Device;
 
@@ -18,15 +19,6 @@
     return view('welcome');
 });
 
-Route::get('/devices', function () {
-    //return view('deviceList');
-    return view('deviceList', [
-        'devices' => Device::all()
-    ]);
-});
+Route::get('/devices', [DeviceController::class, 'index']);
 
-Route::get('/devices/{device_id}', function ($device_id) {
-    return view('deviceDetail', [
-        'device' => Device::find($device_id)
-    ]);
-});
+Route::get('/devices/{device}', [DeviceController::class, 'show']);