diff --git a/app/Http/Controllers/Install/Requirements.php b/app/Http/Controllers/Install/Requirements.php
index 064f18b4f..357787322 100644
--- a/app/Http/Controllers/Install/Requirements.php
+++ b/app/Http/Controllers/Install/Requirements.php
@@ -30,7 +30,7 @@ class Requirements extends Controller
                 flash($requirement)->error()->important();
             }
 
-            return view('install.requirements.show');
+            return view('install.requirements.show', compact('requirements'));
         }
     }
 }
diff --git a/resources/assets/js/views/install/Requirements.vue b/resources/assets/js/views/install/Requirements.vue
index 3daf6a832..1cfc7474d 100644
--- a/resources/assets/js/views/install/Requirements.vue
+++ b/resources/assets/js/views/install/Requirements.vue
@@ -1,3 +1,64 @@
 <template>
-  <p>This is the Database</p>
-</template>
\ No newline at end of file
+    <div class="card">
+        <div class="card-header wizard-header p-3">
+            <el-steps finish-status="success" align-center>
+                <el-step title="Language"></el-step>
+                <el-step title="Database"></el-step>
+                <el-step title="Admin"></el-step>
+            </el-steps>
+        </div>
+
+        <div class="card-body">
+            <el-alert
+                v-for="requirement in requirements"
+                :key="requirement"
+                :title="requirement"
+                :closable="false"
+                type="error"
+                effect="dark">
+            </el-alert>
+        </div>
+
+        <div class="card-footer">
+            <div class="row save-buttons">
+                <div class="col-md-12">
+                    <button type="button" @click="onRefresh" class="btn btn-icon btn-success button-submit header-button-top">
+                        <span class="btn-inner--text">
+                            Refresh &nbsp;
+                        </span>
+                        <span class="btn-inner--icon">
+                            <i class="fas fa-sync"></i>
+                        </span>
+                    </button>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+    import axios from "axios";
+    import {Step, Steps, Alert} from 'element-ui';
+
+    export default {
+        name: 'requirements',
+
+        components: {
+            [Step.name]: Step,
+            [Steps.name]: Steps,
+            [Alert.name]: Alert,
+        },
+
+        data() {
+            return {
+                requirements: flash_requirements,
+            }
+        },
+
+        methods: {
+            onRefresh() {
+                window.location.reload();
+            }
+        }
+    }
+</script>
diff --git a/resources/views/install/requirements/show.blade.php b/resources/views/install/requirements/show.blade.php
index 53ac0a8bf..e7e2b9ee9 100644
--- a/resources/views/install/requirements/show.blade.php
+++ b/resources/views/install/requirements/show.blade.php
@@ -1,3 +1,9 @@
 @extends('layouts.install')
 
 @section('header', trans('install.steps.requirements'))
+
+@push('scripts_start')
+    <script type="text/javascript">
+        var flash_requirements = {!! ($requirements) ? json_encode($requirements) : '[]' !!};
+    </script>
+@endpush
diff --git a/resources/views/layouts/install.blade.php b/resources/views/layouts/install.blade.php
index 8406c25d7..50ca3ff80 100644
--- a/resources/views/layouts/install.blade.php
+++ b/resources/views/layouts/install.blade.php
@@ -1,5 +1,6 @@
 <html>
     @include('partials.install.head')
+
     <body class="installation-page">
 
         <div class="main-content">
