diff --git a/.idea/php.xml b/.idea/php.xml
index 995f835..8c7b72c 100644
--- a/.idea/php.xml
+++ b/.idea/php.xml
@@ -114,6 +114,8 @@
       <path value="$PROJECT_DIR$/skolehjem/vendor/phpdocumentor/reflection-docblock" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/phpdocumentor/type-resolver" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/composer" />
+      <path value="$PROJECT_DIR$/skolehjem/vendor/spatie/laravel-permission" />
+      <path value="$PROJECT_DIR$/skolehjem/vendor/laravel/ui" />
     </include_path>
   </component>
   <component name="PhpProjectSharedConfiguration" php_language_level="7.2" />
diff --git a/.idea/skolehjem-webapp.iml b/.idea/skolehjem-webapp.iml
index 2ebffb3..6b38422 100644
--- a/.idea/skolehjem-webapp.iml
+++ b/.idea/skolehjem-webapp.iml
@@ -33,6 +33,7 @@
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/laravel/framework" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/laravel/passport" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/laravel/tinker" />
+      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/laravel/ui" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/lcobucci/jwt" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/league/commonmark" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/league/event" />
@@ -85,6 +86,7 @@
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/sebastian/resource-operations" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/sebastian/type" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/sebastian/version" />
+      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/spatie/laravel-permission" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/swiftmailer/swiftmailer" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/symfony/console" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/symfony/css-selector" />
diff --git a/PERMS.ods b/PERMS.ods
index 7d77a48..ebc91fe 100644
Binary files a/PERMS.ods and b/PERMS.ods differ
diff --git a/skolehjem/composer.json b/skolehjem/composer.json
index d374acc..3e766ed 100644
--- a/skolehjem/composer.json
+++ b/skolehjem/composer.json
@@ -14,6 +14,7 @@
         "guzzlehttp/guzzle": "^6.3",
         "laravel/framework": "^7.0",
         "laravel/tinker": "^2.0",
+        "laravel/ui": "^2.0",
         "spatie/laravel-permission": "^3.13"
     },
     "require-dev": {
diff --git a/skolehjem/composer.lock b/skolehjem/composer.lock
index d00df13..1674d3c 100644
--- a/skolehjem/composer.lock
+++ b/skolehjem/composer.lock
@@ -4,7 +4,7 @@
         "Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies",
         "This file is @generated automatically"
     ],
-    "content-hash": "fae2156e51f62794f01852f540c65a73",
+    "content-hash": "b3303d351cc84815ab8de6cb27db9490",
     "packages": [
         {
             "name": "asm89/stack-cors",
@@ -959,6 +959,61 @@
             ],
             "time": "2020-04-07T15:01:31+00:00"
         },
+        {
+            "name": "laravel/ui",
+            "version": "v2.0.3",
+            "source": {
+                "type": "git",
+                "url": "https://github.com/laravel/ui.git",
+                "reference": "15368c5328efb7ce94f35ca750acde9b496ab1b1"
+            },
+            "dist": {
+                "type": "zip",
+                "url": "https://api.github.com/repos/laravel/ui/zipball/15368c5328efb7ce94f35ca750acde9b496ab1b1",
+                "reference": "15368c5328efb7ce94f35ca750acde9b496ab1b1",
+                "shasum": ""
+            },
+            "require": {
+                "illuminate/console": "^7.0",
+                "illuminate/filesystem": "^7.0",
+                "illuminate/support": "^7.0",
+                "php": "^7.2.5"
+            },
+            "require-dev": {
+                "mockery/mockery": "^1.0",
+                "phpunit/phpunit": "^8.0"
+            },
+            "type": "library",
+            "extra": {
+                "laravel": {
+                    "providers": [
+                        "Laravel\\Ui\\UiServiceProvider"
+                    ]
+                }
+            },
+            "autoload": {
+                "psr-4": {
+                    "Laravel\\Ui\\": "src/",
+                    "Illuminate\\Foundation\\Auth\\": "auth-backend/"
+                }
+            },
+            "notification-url": "https://packagist.org/downloads/",
+            "license": [
+                "MIT"
+            ],
+            "authors": [
+                {
+                    "name": "Taylor Otwell",
+                    "email": "taylor@laravel.com"
+                }
+            ],
+            "description": "Laravel UI utilities and presets.",
+            "keywords": [
+                "laravel",
+                "ui"
+            ],
+            "time": "2020-04-29T15:06:45+00:00"
+        },
         {
             "name": "league/commonmark",
             "version": "1.4.3",
diff --git a/skolehjem/package-lock.json b/skolehjem/package-lock.json
index 2b49358..9851b09 100644
--- a/skolehjem/package-lock.json
+++ b/skolehjem/package-lock.json
@@ -1303,72 +1303,47 @@
             "dev": true
         },
         "adjust-sourcemap-loader": {
-            "version": "2.0.0",
-            "resolved": "https://registry.npmjs.org/adjust-sourcemap-loader/-/adjust-sourcemap-loader-2.0.0.tgz",
-            "integrity": "sha512-4hFsTsn58+YjrU9qKzML2JSSDqKvN8mUGQ0nNIrfPi8hmIONT4L3uUaT6MKdMsZ9AjsU6D2xDkZxCkbQPxChrA==",
+            "version": "1.2.0",
+            "resolved": "https://registry.npmjs.org/adjust-sourcemap-loader/-/adjust-sourcemap-loader-1.2.0.tgz",
+            "integrity": "sha512-958oaHHVEXMvsY7v7cC5gEkNIcoaAVIhZ4mBReYVZJOTP9IgKmzLjIOhTtzpLMu+qriXvLsVjJ155EeInp45IQ==",
             "dev": true,
             "requires": {
-                "assert": "1.4.1",
-                "camelcase": "5.0.0",
-                "loader-utils": "1.2.3",
-                "object-path": "0.11.4",
-                "regex-parser": "2.2.10"
+                "assert": "^1.3.0",
+                "camelcase": "^1.2.1",
+                "loader-utils": "^1.1.0",
+                "lodash.assign": "^4.0.1",
+                "lodash.defaults": "^3.1.2",
+                "object-path": "^0.9.2",
+                "regex-parser": "^2.2.9"
             },
             "dependencies": {
-                "assert": {
-                    "version": "1.4.1",
-                    "resolved": "https://registry.npmjs.org/assert/-/assert-1.4.1.tgz",
-                    "integrity": "sha1-mZEtWRg2tab1s0XA8H7vwI/GXZE=",
-                    "dev": true,
-                    "requires": {
-                        "util": "0.10.3"
-                    }
-                },
                 "camelcase": {
-                    "version": "5.0.0",
-                    "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-5.0.0.tgz",
-                    "integrity": "sha512-faqwZqnWxbxn+F1d399ygeamQNy3lPp/H9H6rNrqYh4FSVCtcY+3cub1MxA8o9mDd55mM8Aghuu/kuyYA6VTsA==",
+                    "version": "1.2.1",
+                    "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-1.2.1.tgz",
+                    "integrity": "sha1-m7UwTS4LVmmLLHWLCKPqqdqlijk=",
                     "dev": true
                 },
-                "emojis-list": {
-                    "version": "2.1.0",
-                    "resolved": "https://registry.npmjs.org/emojis-list/-/emojis-list-2.1.0.tgz",
-                    "integrity": "sha1-TapNnbAPmBmIDHn6RXrlsJof04k=",
-                    "dev": true
-                },
-                "inherits": {
-                    "version": "2.0.1",
-                    "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.1.tgz",
-                    "integrity": "sha1-sX0I0ya0Qj5Wjv9xn5GwscvfafE=",
-                    "dev": true
-                },
-                "json5": {
-                    "version": "1.0.1",
-                    "resolved": "https://registry.npmjs.org/json5/-/json5-1.0.1.tgz",
-                    "integrity": "sha512-aKS4WQjPenRxiQsC93MNfjx+nbF4PAdYzmd/1JIj8HYzqfbu86beTuNgXDzPknWk0n0uARlyewZo4s++ES36Ow==",
+                "lodash.defaults": {
+                    "version": "3.1.2",
+                    "resolved": "https://registry.npmjs.org/lodash.defaults/-/lodash.defaults-3.1.2.tgz",
+                    "integrity": "sha1-xzCLGNv4vJNy1wGnNJPGEZK9Liw=",
                     "dev": true,
                     "requires": {
-                        "minimist": "^1.2.0"
-                    }
-                },
-                "loader-utils": {
-                    "version": "1.2.3",
-                    "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.2.3.tgz",
-                    "integrity": "sha512-fkpz8ejdnEMG3s37wGL07iSBDg99O9D5yflE9RGNH3hRdx9SOwYfnGYdZOUIZitN8E+E2vkq3MUMYMvPYl5ZZA==",
-                    "dev": true,
-                    "requires": {
-                        "big.js": "^5.2.2",
-                        "emojis-list": "^2.0.0",
-                        "json5": "^1.0.1"
-                    }
-                },
-                "util": {
-                    "version": "0.10.3",
-                    "resolved": "https://registry.npmjs.org/util/-/util-0.10.3.tgz",
-                    "integrity": "sha1-evsa/lCAUkZInj23/g7TeTNqwPk=",
-                    "dev": true,
-                    "requires": {
-                        "inherits": "2.0.1"
+                        "lodash.assign": "^3.0.0",
+                        "lodash.restparam": "^3.0.0"
+                    },
+                    "dependencies": {
+                        "lodash.assign": {
+                            "version": "3.2.0",
+                            "resolved": "https://registry.npmjs.org/lodash.assign/-/lodash.assign-3.2.0.tgz",
+                            "integrity": "sha1-POnwI0tLIiPilrj6CsH+6OvKZPo=",
+                            "dev": true,
+                            "requires": {
+                                "lodash._baseassign": "^3.0.0",
+                                "lodash._createassigner": "^3.0.0",
+                                "lodash.keys": "^3.0.0"
+                            }
+                        }
                     }
                 }
             }
@@ -1476,12 +1451,6 @@
                 "sprintf-js": "~1.0.2"
             }
         },
-        "arity-n": {
-            "version": "1.0.4",
-            "resolved": "https://registry.npmjs.org/arity-n/-/arity-n-1.0.4.tgz",
-            "integrity": "sha1-2edrEXM+CFacCEeuezmyhgswt0U=",
-            "dev": true
-        },
         "arr-diff": {
             "version": "4.0.0",
             "resolved": "https://registry.npmjs.org/arr-diff/-/arr-diff-4.0.0.tgz",
@@ -1881,6 +1850,12 @@
             "integrity": "sha1-aN/1++YMUes3cl6p4+0xDcwed24=",
             "dev": true
         },
+        "bootstrap": {
+            "version": "4.5.0",
+            "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-4.5.0.tgz",
+            "integrity": "sha512-Z93QoXvodoVslA+PWNdk23Hze4RBYIkpb5h8I2HY2Tu2h7A0LpAgLcyrhrSUyo2/Oxm2l1fRZPs1e5hnxnliXA==",
+            "dev": true
+        },
         "brace-expansion": {
             "version": "1.1.11",
             "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
@@ -2436,15 +2411,6 @@
             "integrity": "sha512-Rd3se6QB+sO1TwqZjscQrurpEPIfO0/yYnSin6Q/rD3mOutHvUrCAhJub3r90uNb+SESBuE0QYoB90YdfatsRg==",
             "dev": true
         },
-        "compose-function": {
-            "version": "3.0.3",
-            "resolved": "https://registry.npmjs.org/compose-function/-/compose-function-3.0.3.tgz",
-            "integrity": "sha1-ntZ18TzFRQHTCVCkhv9qe6OrGF8=",
-            "dev": true,
-            "requires": {
-                "arity-n": "^1.0.4"
-            }
-        },
         "compressible": {
             "version": "2.0.18",
             "resolved": "https://registry.npmjs.org/compressible/-/compressible-2.0.18.tgz",
@@ -2972,16 +2938,6 @@
             "integrity": "sha1-WW6WmP0MgOEgOMK4LW6xs1tiJNk=",
             "dev": true
         },
-        "d": {
-            "version": "1.0.1",
-            "resolved": "https://registry.npmjs.org/d/-/d-1.0.1.tgz",
-            "integrity": "sha512-m62ShEObQ39CfralilEQRjH6oAMtNCV1xJyEx5LpRYUVN+EviphDgUc/F3hnYbADmkiNs67Y+3ylmlG7Lnu+FA==",
-            "dev": true,
-            "requires": {
-                "es5-ext": "^0.10.50",
-                "type": "^1.0.1"
-            }
-        },
         "de-indent": {
             "version": "1.0.2",
             "resolved": "https://registry.npmjs.org/de-indent/-/de-indent-1.0.2.tgz",
@@ -3442,38 +3398,6 @@
                 "is-symbol": "^1.0.2"
             }
         },
-        "es5-ext": {
-            "version": "0.10.53",
-            "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.53.tgz",
-            "integrity": "sha512-Xs2Stw6NiNHWypzRTY1MtaG/uJlwCk8kH81920ma8mvN8Xq1gsfhZvpkImLQArw8AHnv8MT2I45J3c0R8slE+Q==",
-            "dev": true,
-            "requires": {
-                "es6-iterator": "~2.0.3",
-                "es6-symbol": "~3.1.3",
-                "next-tick": "~1.0.0"
-            }
-        },
-        "es6-iterator": {
-            "version": "2.0.3",
-            "resolved": "https://registry.npmjs.org/es6-iterator/-/es6-iterator-2.0.3.tgz",
-            "integrity": "sha1-p96IkUGgWpSwhUQDstCg+/qY87c=",
-            "dev": true,
-            "requires": {
-                "d": "1",
-                "es5-ext": "^0.10.35",
-                "es6-symbol": "^3.1.1"
-            }
-        },
-        "es6-symbol": {
-            "version": "3.1.3",
-            "resolved": "https://registry.npmjs.org/es6-symbol/-/es6-symbol-3.1.3.tgz",
-            "integrity": "sha512-NJ6Yn3FuDinBaBRWl/q5X/s4koRHBrgKAu+yGI6JCBeiu3qrcbJhwT2GeR/EXVfylRk8dpQVJoLEFhK+Mu31NA==",
-            "dev": true,
-            "requires": {
-                "d": "^1.0.1",
-                "ext": "^1.1.2"
-            }
-        },
         "es6-templates": {
             "version": "0.2.3",
             "resolved": "https://registry.npmjs.org/es6-templates/-/es6-templates-0.2.3.tgz",
@@ -3744,23 +3668,6 @@
                 }
             }
         },
-        "ext": {
-            "version": "1.4.0",
-            "resolved": "https://registry.npmjs.org/ext/-/ext-1.4.0.tgz",
-            "integrity": "sha512-Key5NIsUxdqKg3vIsdw9dSuXpPCQ297y6wBjL30edxwPgt2E44WcWBZey/ZvUc6sERLTxKdyCu4gZFmUbk1Q7A==",
-            "dev": true,
-            "requires": {
-                "type": "^2.0.0"
-            },
-            "dependencies": {
-                "type": {
-                    "version": "2.0.0",
-                    "resolved": "https://registry.npmjs.org/type/-/type-2.0.0.tgz",
-                    "integrity": "sha512-KBt58xCHry4Cejnc2ISQAF7QY+ORngsWfxezO68+12hKV6lQY8P/psIkcbjeHWn7MqcgciWJyCCevFMJdIXpow==",
-                    "dev": true
-                }
-            }
-        },
         "extend-shallow": {
             "version": "3.0.2",
             "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-3.0.2.tgz",
@@ -5169,6 +5076,12 @@
                 }
             }
         },
+        "jquery": {
+            "version": "3.5.1",
+            "resolved": "https://registry.npmjs.org/jquery/-/jquery-3.5.1.tgz",
+            "integrity": "sha512-XwIBPqcMn57FxfT+Go5pzySnm4KWkT1Tv7gjrpT1srtf8Weynl6R273VJ5GjkRb51IzMp5nbaPjJXMWeju2MKg==",
+            "dev": true
+        },
         "js-tokens": {
             "version": "4.0.0",
             "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
@@ -5371,12 +5284,98 @@
             "integrity": "sha512-8xOcRHvCjnocdS5cpwXQXVzmmh5e5+saE2QGoeQmbKmRS6J3VQppPOIt0MnmE+4xlZoumy0GPG0D0MVIQbNA1A==",
             "dev": true
         },
+        "lodash._baseassign": {
+            "version": "3.2.0",
+            "resolved": "https://registry.npmjs.org/lodash._baseassign/-/lodash._baseassign-3.2.0.tgz",
+            "integrity": "sha1-jDigmVAPIVrQnlnxci/QxSv+Ck4=",
+            "dev": true,
+            "requires": {
+                "lodash._basecopy": "^3.0.0",
+                "lodash.keys": "^3.0.0"
+            }
+        },
+        "lodash._basecopy": {
+            "version": "3.0.1",
+            "resolved": "https://registry.npmjs.org/lodash._basecopy/-/lodash._basecopy-3.0.1.tgz",
+            "integrity": "sha1-jaDmqHbPNEwK2KVIghEd08XHyjY=",
+            "dev": true
+        },
+        "lodash._bindcallback": {
+            "version": "3.0.1",
+            "resolved": "https://registry.npmjs.org/lodash._bindcallback/-/lodash._bindcallback-3.0.1.tgz",
+            "integrity": "sha1-5THCdkTPi1epnhftlbNcdIeJOS4=",
+            "dev": true
+        },
+        "lodash._createassigner": {
+            "version": "3.1.1",
+            "resolved": "https://registry.npmjs.org/lodash._createassigner/-/lodash._createassigner-3.1.1.tgz",
+            "integrity": "sha1-g4pbri/aymOsIt7o4Z+k5taXCxE=",
+            "dev": true,
+            "requires": {
+                "lodash._bindcallback": "^3.0.0",
+                "lodash._isiterateecall": "^3.0.0",
+                "lodash.restparam": "^3.0.0"
+            }
+        },
+        "lodash._getnative": {
+            "version": "3.9.1",
+            "resolved": "https://registry.npmjs.org/lodash._getnative/-/lodash._getnative-3.9.1.tgz",
+            "integrity": "sha1-VwvH3t5G1hzc3mh9ZdPuy6o6r/U=",
+            "dev": true
+        },
+        "lodash._isiterateecall": {
+            "version": "3.0.9",
+            "resolved": "https://registry.npmjs.org/lodash._isiterateecall/-/lodash._isiterateecall-3.0.9.tgz",
+            "integrity": "sha1-UgOte6Ql+uhCRg5pbbnPPmqsBXw=",
+            "dev": true
+        },
+        "lodash.assign": {
+            "version": "4.2.0",
+            "resolved": "https://registry.npmjs.org/lodash.assign/-/lodash.assign-4.2.0.tgz",
+            "integrity": "sha1-DZnzzNem0mHRm9rrkkUAXShYCOc=",
+            "dev": true
+        },
+        "lodash.defaults": {
+            "version": "4.2.0",
+            "resolved": "https://registry.npmjs.org/lodash.defaults/-/lodash.defaults-4.2.0.tgz",
+            "integrity": "sha1-0JF4cW/+pN3p5ft7N/bwgCJ0WAw=",
+            "dev": true
+        },
+        "lodash.isarguments": {
+            "version": "3.1.0",
+            "resolved": "https://registry.npmjs.org/lodash.isarguments/-/lodash.isarguments-3.1.0.tgz",
+            "integrity": "sha1-L1c9hcaiQon/AGY7SRwdM4/zRYo=",
+            "dev": true
+        },
+        "lodash.isarray": {
+            "version": "3.0.4",
+            "resolved": "https://registry.npmjs.org/lodash.isarray/-/lodash.isarray-3.0.4.tgz",
+            "integrity": "sha1-eeTriMNqgSKvhvhEqpvNhRtfu1U=",
+            "dev": true
+        },
+        "lodash.keys": {
+            "version": "3.1.2",
+            "resolved": "https://registry.npmjs.org/lodash.keys/-/lodash.keys-3.1.2.tgz",
+            "integrity": "sha1-TbwEcrFWvlCgsoaFXRvQsMZWCYo=",
+            "dev": true,
+            "requires": {
+                "lodash._getnative": "^3.0.0",
+                "lodash.isarguments": "^3.0.0",
+                "lodash.isarray": "^3.0.0"
+            }
+        },
         "lodash.memoize": {
             "version": "4.1.2",
             "resolved": "https://registry.npmjs.org/lodash.memoize/-/lodash.memoize-4.1.2.tgz",
             "integrity": "sha1-vMbEmkKihA7Zl/Mj6tpezRguC/4=",
             "dev": true
         },
+        "lodash.restparam": {
+            "version": "3.6.1",
+            "resolved": "https://registry.npmjs.org/lodash.restparam/-/lodash.restparam-3.6.1.tgz",
+            "integrity": "sha1-k2pOMJ7zMKdkXtQUWYbIWuWyCAU=",
+            "dev": true
+        },
         "lodash.uniq": {
             "version": "4.5.0",
             "resolved": "https://registry.npmjs.org/lodash.uniq/-/lodash.uniq-4.5.0.tgz",
@@ -5791,12 +5790,6 @@
             "integrity": "sha512-iyam8fBuCUpWeKPGpaNMetEocMt364qkCsfL9JuhjXX6dRnguRVOfk2GZaDpPjcOKiiXCPINZC1GczQ7iTq3Zw==",
             "dev": true
         },
-        "next-tick": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/next-tick/-/next-tick-1.0.0.tgz",
-            "integrity": "sha1-yobR/ogoFpsBICCOPchCS524NCw=",
-            "dev": true
-        },
         "nice-try": {
             "version": "1.0.5",
             "resolved": "https://registry.npmjs.org/nice-try/-/nice-try-1.0.5.tgz",
@@ -6003,9 +5996,9 @@
             "dev": true
         },
         "object-path": {
-            "version": "0.11.4",
-            "resolved": "https://registry.npmjs.org/object-path/-/object-path-0.11.4.tgz",
-            "integrity": "sha1-NwrnUvvzfePqcKhhwju6iRVpGUk=",
+            "version": "0.9.2",
+            "resolved": "https://registry.npmjs.org/object-path/-/object-path-0.9.2.tgz",
+            "integrity": "sha1-D9mnT8X60a45aLWGvaXGMr1sBaU=",
             "dev": true
         },
         "object-visit": {
@@ -6447,6 +6440,12 @@
                 "find-up": "^2.1.0"
             }
         },
+        "popper.js": {
+            "version": "1.16.1",
+            "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1.tgz",
+            "integrity": "sha512-Wb4p1J4zyFTbM+u6WuO4XstYx4Ky9Cewe4DWrel7B0w6VVICvPwdOpotjzcf6eD8TsckVnIMNONQyPIUFOUbCQ==",
+            "dev": true
+        },
         "portfinder": {
             "version": "1.0.26",
             "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.26.tgz",
@@ -7562,74 +7561,27 @@
             "dev": true
         },
         "resolve-url-loader": {
-            "version": "3.1.1",
-            "resolved": "https://registry.npmjs.org/resolve-url-loader/-/resolve-url-loader-3.1.1.tgz",
-            "integrity": "sha512-K1N5xUjj7v0l2j/3Sgs5b8CjrrgtC70SmdCuZiJ8tSyb5J+uk3FoeZ4b7yTnH6j7ngI+Bc5bldHJIa8hYdu2gQ==",
+            "version": "2.3.2",
+            "resolved": "https://registry.npmjs.org/resolve-url-loader/-/resolve-url-loader-2.3.2.tgz",
+            "integrity": "sha512-sc/UVgiADdoTc+4cGPB7cUCnlEkzlxD1NXHw4oa9qA0fp30H8mAQ2ePJBP9MQ029DUuhEPouhNdvzT37pBCV0g==",
             "dev": true,
             "requires": {
-                "adjust-sourcemap-loader": "2.0.0",
-                "camelcase": "5.3.1",
-                "compose-function": "3.0.3",
-                "convert-source-map": "1.7.0",
-                "es6-iterator": "2.0.3",
-                "loader-utils": "1.2.3",
-                "postcss": "7.0.21",
-                "rework": "1.0.1",
-                "rework-visit": "1.0.0",
-                "source-map": "0.6.1"
+                "adjust-sourcemap-loader": "^1.1.0",
+                "camelcase": "^4.1.0",
+                "convert-source-map": "^1.5.1",
+                "loader-utils": "^1.1.0",
+                "lodash.defaults": "^4.0.0",
+                "rework": "^1.0.1",
+                "rework-visit": "^1.0.0",
+                "source-map": "^0.5.7",
+                "urix": "^0.1.0"
             },
             "dependencies": {
-                "emojis-list": {
-                    "version": "2.1.0",
-                    "resolved": "https://registry.npmjs.org/emojis-list/-/emojis-list-2.1.0.tgz",
-                    "integrity": "sha1-TapNnbAPmBmIDHn6RXrlsJof04k=",
+                "camelcase": {
+                    "version": "4.1.0",
+                    "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-4.1.0.tgz",
+                    "integrity": "sha1-1UVjW+HjPFQmScaRc+Xeas+uNN0=",
                     "dev": true
-                },
-                "json5": {
-                    "version": "1.0.1",
-                    "resolved": "https://registry.npmjs.org/json5/-/json5-1.0.1.tgz",
-                    "integrity": "sha512-aKS4WQjPenRxiQsC93MNfjx+nbF4PAdYzmd/1JIj8HYzqfbu86beTuNgXDzPknWk0n0uARlyewZo4s++ES36Ow==",
-                    "dev": true,
-                    "requires": {
-                        "minimist": "^1.2.0"
-                    }
-                },
-                "loader-utils": {
-                    "version": "1.2.3",
-                    "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.2.3.tgz",
-                    "integrity": "sha512-fkpz8ejdnEMG3s37wGL07iSBDg99O9D5yflE9RGNH3hRdx9SOwYfnGYdZOUIZitN8E+E2vkq3MUMYMvPYl5ZZA==",
-                    "dev": true,
-                    "requires": {
-                        "big.js": "^5.2.2",
-                        "emojis-list": "^2.0.0",
-                        "json5": "^1.0.1"
-                    }
-                },
-                "postcss": {
-                    "version": "7.0.21",
-                    "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.21.tgz",
-                    "integrity": "sha512-uIFtJElxJo29QC753JzhidoAhvp/e/Exezkdhfmt8AymWT6/5B7W1WmponYWkHk2eg6sONyTch0A3nkMPun3SQ==",
-                    "dev": true,
-                    "requires": {
-                        "chalk": "^2.4.2",
-                        "source-map": "^0.6.1",
-                        "supports-color": "^6.1.0"
-                    }
-                },
-                "source-map": {
-                    "version": "0.6.1",
-                    "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
-                    "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
-                    "dev": true
-                },
-                "supports-color": {
-                    "version": "6.1.0",
-                    "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-6.1.0.tgz",
-                    "integrity": "sha512-qe1jfm1Mg7Nq/NSh6XE24gPXROEVsWHxC1LIx//XNlD9iw7YZQGjZNjYN7xGaEG6iKdA8EtNFW6R0gjnVXp+wQ==",
-                    "dev": true,
-                    "requires": {
-                        "has-flag": "^3.0.0"
-                    }
                 }
             }
         },
@@ -8864,12 +8816,6 @@
             "integrity": "sha1-oVe6QC2iTpv5V/mqadUk7tQpAaY=",
             "dev": true
         },
-        "type": {
-            "version": "1.2.0",
-            "resolved": "https://registry.npmjs.org/type/-/type-1.2.0.tgz",
-            "integrity": "sha512-+5nt5AAniqsCnu2cEQQdpzCAh33kVx8n0VoFidKpB1dVVLAN/F+bgVOqOJqOnEnrhp222clB5p3vUlD+1QAnfg==",
-            "dev": true
-        },
         "type-is": {
             "version": "1.6.18",
             "resolved": "https://registry.npmjs.org/type-is/-/type-is-1.6.18.tgz",
@@ -9178,6 +9124,12 @@
             "integrity": "sha512-2ham8XPWTONajOR0ohOKOHXkm3+gaBmGut3SRuu75xLd/RRaY6vqgh8NBYYk7+RW3u5AtzPQZG8F10LHkl0lAQ==",
             "dev": true
         },
+        "vue": {
+            "version": "2.6.11",
+            "resolved": "https://registry.npmjs.org/vue/-/vue-2.6.11.tgz",
+            "integrity": "sha512-VfPwgcGABbGAue9+sfrD4PuwFar7gPb1yl1UK1MwXoQPAw0BKSqWfoYCT/ThFrdEVWoI51dBuyCoiNU9bZDZxQ==",
+            "dev": true
+        },
         "vue-hot-reload-api": {
             "version": "2.3.4",
             "resolved": "https://registry.npmjs.org/vue-hot-reload-api/-/vue-hot-reload-api-2.3.4.tgz",
diff --git a/skolehjem/package.json b/skolehjem/package.json
index c8d7d3e..8ed93d1 100644
--- a/skolehjem/package.json
+++ b/skolehjem/package.json
@@ -11,12 +11,16 @@
     },
     "devDependencies": {
         "axios": "^0.19",
+        "bootstrap": "^4.0.0",
         "cross-env": "^7.0",
+        "jquery": "^3.2",
         "laravel-mix": "^5.0.1",
         "lodash": "^4.17.13",
-        "resolve-url-loader": "^3.1.0",
-        "sass": "^1.15.2",
+        "popper.js": "^1.12",
+        "resolve-url-loader": "^2.3.1",
+        "sass": "^1.20.1",
         "sass-loader": "^8.0.0",
-        "vue-template-compiler": "^2.6.11"
+        "vue": "^2.5.17",
+        "vue-template-compiler": "^2.6.10"
     }
 }
diff --git a/skolehjem/resources/js/app.js b/skolehjem/resources/js/app.js
index 40c55f6..aa19e31 100644
--- a/skolehjem/resources/js/app.js
+++ b/skolehjem/resources/js/app.js
@@ -1 +1,32 @@
+/**
+ * First we will load all of this project's JavaScript dependencies which
+ * includes Vue and other libraries. It is a great starting point when
+ * building robust, powerful web applications using Vue and Laravel.
+ */
+
 require('./bootstrap');
+
+window.Vue = require('vue');
+
+/**
+ * The following block of code may be used to automatically register your
+ * Vue components. It will recursively scan this directory for the Vue
+ * components and automatically register them with their "basename".
+ *
+ * Eg. ./components/ExampleComponent.vue -> <example-component></example-component>
+ */
+
+// const files = require.context('./', true, /\.vue$/i)
+// files.keys().map(key => Vue.component(key.split('/').pop().split('.')[0], files(key).default))
+
+Vue.component('example-component', require('./components/ExampleComponent.vue').default);
+
+/**
+ * Next, we will create a fresh Vue application instance and attach it to
+ * the page. Then, you may begin adding components to this application
+ * or customize the JavaScript scaffolding to fit your unique needs.
+ */
+
+const app = new Vue({
+    el: '#app',
+});
diff --git a/skolehjem/resources/js/bootstrap.js b/skolehjem/resources/js/bootstrap.js
index 6922577..63605fa 100644
--- a/skolehjem/resources/js/bootstrap.js
+++ b/skolehjem/resources/js/bootstrap.js
@@ -1,5 +1,18 @@
 window._ = require('lodash');
 
+/**
+ * We'll load jQuery and the Bootstrap jQuery plugin which provides support
+ * for JavaScript based Bootstrap features such as modals and tabs. This
+ * code may be modified to fit the specific needs of your application.
+ */
+
+try {
+    window.Popper = require('popper.js').default;
+    window.$ = window.jQuery = require('jquery');
+
+    require('bootstrap');
+} catch (e) {}
+
 /**
  * We'll load the axios HTTP library which allows us to easily issue requests
  * to our Laravel back-end. This library automatically handles sending the
diff --git a/skolehjem/resources/js/components/ExampleComponent.vue b/skolehjem/resources/js/components/ExampleComponent.vue
new file mode 100644
index 0000000..3fb9f9a
--- /dev/null
+++ b/skolehjem/resources/js/components/ExampleComponent.vue
@@ -0,0 +1,23 @@
+<template>
+    <div class="container">
+        <div class="row justify-content-center">
+            <div class="col-md-8">
+                <div class="card">
+                    <div class="card-header">Example Component</div>
+
+                    <div class="card-body">
+                        I'm an example component.
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+    export default {
+        mounted() {
+            console.log('Component mounted.')
+        }
+    }
+</script>
diff --git a/skolehjem/resources/sass/_variables.scss b/skolehjem/resources/sass/_variables.scss
new file mode 100644
index 0000000..0407ab5
--- /dev/null
+++ b/skolehjem/resources/sass/_variables.scss
@@ -0,0 +1,19 @@
+// Body
+$body-bg: #f8fafc;
+
+// Typography
+$font-family-sans-serif: 'Nunito', sans-serif;
+$font-size-base: 0.9rem;
+$line-height-base: 1.6;
+
+// Colors
+$blue: #3490dc;
+$indigo: #6574cd;
+$purple: #9561e2;
+$pink: #f66d9b;
+$red: #e3342f;
+$orange: #f6993f;
+$yellow: #ffed4a;
+$green: #38c172;
+$teal: #4dc0b5;
+$cyan: #6cb2eb;
diff --git a/skolehjem/resources/sass/app.scss b/skolehjem/resources/sass/app.scss
index d01275c..3193ffa 100644
--- a/skolehjem/resources/sass/app.scss
+++ b/skolehjem/resources/sass/app.scss
@@ -1,5 +1,8 @@
-//
+// Fonts
+@import url('https://fonts.googleapis.com/css?family=Nunito');
 
-* {
-    margin: 0;
-}
+// Variables
+@import 'variables';
+
+// Bootstrap
+@import '~bootstrap/scss/bootstrap';