diff --git a/database/migrations/2020_03_11_190641_create_spreadsheets_table.php b/database/migrations/2020_03_11_190641_create_spreadsheets_table.php
index 3146c4dbecdefddc54ef20ffb1caba8e51a843bd..6eb726e351d0fcbb74e14c7ea8494f5e88887ac7 100644
--- a/database/migrations/2020_03_11_190641_create_spreadsheets_table.php
+++ b/database/migrations/2020_03_11_190641_create_spreadsheets_table.php
@@ -14,13 +14,13 @@ class CreateSpreadsheetsTable extends Migration
     public function up()
     {
         Schema::create('spreadsheets', function (Blueprint $table) {
-            $table->string('id');
+            $table->bigInteger('id')->unsigned();
             $table->string('cell');
             $table->string('value');
             $table->string('type');
 
             $table->primary(['id', 'cell']);
-            $table->foreign('id')->references('id_spreadsheet')->on('topics');
+            $table->foreign('id')->references('id')->on('topics');
         });
     }
 
diff --git a/public/css/app.css b/public/css/app.css
index 41395b9121d78dda793c3ea754da7c3c6ae99454..73d3d2b839a96a3ff7ea37a1fca2a7d94a776252 100644
--- a/public/css/app.css
+++ b/public/css/app.css
@@ -576,8 +576,8 @@ pre code {
 
 .container {
   width: 100%;
-  padding-right: 15px;
-  padding-left: 15px;
+  padding-right: 0px;
+  padding-left: 0px;
   margin-right: auto;
   margin-left: auto;
 }
@@ -5161,7 +5161,6 @@ input[type=button].btn-block {
   }
 
   .card-columns .card {
-    display: inline-block;
     width: 100%;
   }
 }
diff --git a/public/css/home.css b/public/css/home.css
new file mode 100644
index 0000000000000000000000000000000000000000..0573cd92651b5b44848354c9c3bc4ac50d5f5e4f
--- /dev/null
+++ b/public/css/home.css
@@ -0,0 +1,13 @@
+.profile {
+    display: inline-block;
+    text-align: center;
+}
+
+#name {
+    font-weight: bold;
+    margin-top: 5rem;
+}
+
+#edit {
+    margin-top: 2rem;
+}
\ No newline at end of file
diff --git a/public/img/course1.png b/public/img/course1.png
new file mode 100644
index 0000000000000000000000000000000000000000..5835f1b9e122b187fbd4b757753464059c69e091
Binary files /dev/null and b/public/img/course1.png differ
diff --git a/public/img/profile.jpg b/public/img/profile.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..c9d2de1809454045034632e4c766d4b11c3c0ee2
Binary files /dev/null and b/public/img/profile.jpg differ
diff --git a/resources/views/home.blade.php b/resources/views/home.blade.php
index 03b3b42b1531815307986be882b6575f667fe024..4823a63341fb050df0a56c181208ea38859c0abd 100644
--- a/resources/views/home.blade.php
+++ b/resources/views/home.blade.php
@@ -2,24 +2,103 @@
 
 @section('content')
 <div class="container">
-    <div class="row justify-content-center">
+    <div class="row justify-content">
         <div class="col-md-8">
             <div class="card">
-                <div class="card-header">Dashboard</div>
-
+                <div class="card-header">Kelasku</div>
+                <div class="card-columns card-body">
+                    <div class="card course" style="width: 14rem">
+                        <img src="img/course1.png" class="card-img-top" alt="No Picture">
+                        <div class="card-header">Pengenalan Spreadsheet</div>
+                        <a href="/1" class="stretched-link"></a>
+                    </div>
+                    <div class="card course" style="width: 14rem">
+                        <img src="img/course1.png" class="card-img-top" alt="No Picture">
+                        <div class="card-header">Pengenalan Spreadsheet 2</div>
+                        <a href="/2" class="stretched-link"></a>
+                    </div>
+                    <div class="card course" style="width: 14rem">
+                        <img src="img/course1.png" class="card-img-top" alt="No Picture">
+                        <div class="card-header">Pengenalan Spreadsheet</div>
+                        <a href="/3" class="stretched-link"></a>
+                    </div>
+                    <div class="card course" style="width: 14rem">
+                        <img src="img/course1.png" class="card-img-top" alt="No Picture">
+                        <div class="card-header">Pengenalan Spreadsheet 4</div>
+                        <a href="/4" class="stretched-link"></a>
+                    </div>
+                    <div class="card course" style="width: 14rem">
+                        <img src="img/course1.png" class="card-img-top" alt="No Picture">
+                        <div class="card-header">Pengenalan Spreadsheet 4</div>
+                        <a href="/4" class="stretched-link"></a>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <div class="col-md-4">
+            <div class="card">
+                <div class="card-header">Profil</div>
+                <div class="card-body profile">
+                    <img src="img/profile.jpg" style="width:120px;height:120px;" alt="No Picture"> <br/> <br/>
+                    <a id="name">Kurniandha Sukma Yunastrian</a> <br/>
+                    <a id="email">kurnia@gmail.com</a> <br/>
+                    <a id="role">Pengajar</a> <br/>
+                    <a id="edit" href="/edit_profile" class="btn btn-primary" role="button">Edit Profil</a>
+                </div>
+            </div>
+        </div>
+    </div>
+    <div class="py-4 row justify-content-center">
+        <div class="col-md-12">
+            <div class="card">
+                <div class="card-header">Kelas Tersedia</div>
                 <div class="card-body">
-                    @if (session('status'))
-                        <div class="alert alert-success" role="alert">
-                            {{ session('status') }}
-                        </div>
-                    @endif
+                    <div class="accordion" id="accordionExample">
+                        <div class="card">
+                            <div class="card-header" id="headingOne">
+                                <h5 class="mb-0">
+                                    <button class="btn btn-link stretched-link" type="button" data-toggle="collapse" data-target="#collapseOne" aria-expanded="false" aria-controls="collapseOne">
+                                        Spreadsheet Expert 1
+                                    </button>
+                                </h5>
+                            </div>
 
-                    You are logged in! halo
+                            <div id="collapseOne" class="collapse" aria-labelledby="headingOne" data-parent="#accordionExample">
+                                <div class="card-body">
+                                    Belajar tentang spreadsheet dengan level expert <br/>
+                                    Pengajar : <br/> <br/>
+                                    <a href="/enroll" class="btn btn-primary" role="button">Daftar Kelas</a>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="card">
+                            <div class="card-header" id="headingTwo">
+                                <h5 class="mb-0">
+                                    <button class="btn btn-link collapsed stretched-link" type="button" data-toggle="collapse" data-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
+                                        Expert 2
+                                    </button>
+                                </h5>
+                            </div>
+                            <div id="collapseTwo" class="collapse" aria-labelledby="headingTwo" data-parent="#accordionExample">
+                                <div class="card-body">
+                                    Belajar tentang spreadsheet dengan level expert part 2 <br/>
+                                    Pengajar : <br/> <br/>
+                                    <a href="/enroll" class="btn btn-primary" role="button">Daftar Kelas</a>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
                 </div>
-                <pagge></pagge>
-                jj
             </div>
         </div>
     </div>
 </div>
 @endsection
+
+<style>
+    courses {
+        display: block;
+        width: 100%;
+        height: 100%;
+    }
+</style>
\ No newline at end of file
diff --git a/resources/views/layouts/app.blade.php b/resources/views/layouts/app.blade.php
index 7bcfd316b00efaf35e0cfeb67d745797a9eaaf19..e47b1bc290edbe2f0991819a82d66ecabc6316c2 100644
--- a/resources/views/layouts/app.blade.php
+++ b/resources/views/layouts/app.blade.php
@@ -18,6 +18,7 @@
 
     <!-- Styles -->
     <link href="{{ asset('css/app.css') }}" rel="stylesheet">
+    <link href="{{ asset('css/home.css') }}" rel="stylesheet">
 </head>
 <body>
     <div id="app">
diff --git a/routes/web.php b/routes/web.php
index beedd6e78570278e7d0c6eccaacd471ec37213e8..582f65c3e81c8e4e74ca498d21e26a7a18bcdf8a 100644
--- a/routes/web.php
+++ b/routes/web.php
@@ -19,5 +19,7 @@ Route::get('/test', function () {
 });
 
 Auth::routes();
-
-Route::get('/home', 'HomeController@index')->name('home');
\ No newline at end of file
+Route::get('/home', function () {
+    return view('home');
+});
+// Route::get('/home', 'HomeController@index')->name('home');
\ No newline at end of file