diff --git a/.hooks/pre-commit b/.hooks/pre-commit
index bf07d2ada..7707579bf 100755
--- a/.hooks/pre-commit
+++ b/.hooks/pre-commit
@@ -1,14 +1,33 @@
 #!/bin/sh
 
+# set -x
+
+lines_before=`git stash list | wc -l`
+git stash push --keep-index -q
+lines_after=`git stash list | wc -l`
+
+cleanup() {
+	if [ $lines_before -lt $lines_after ]; then
+		git stash pop -q
+	fi
+}
+
+trap cleanup EXIT
+
 if [ -e 'vendor/bin/php-cs-fixer' ]; then
-	lines_before=`git stash list | wc -l`
-	git stash push --keep-index
-	lines_after=`git stash list | wc -l`
 
 	composer cs:check || { echo "The PHP code is not validly formatted."; exit 1; }
 	
-	if [ $lines_before -lt $lines_after ]; then
-		git stash pop
-	fi
 fi
 
+if [ -e 'node_modules/.bin/eslint' ]; then
+	npm run eslint || { echo 'The javascript code seems to be not satifying the eslint linter.'; exit 2; }
+fi
+
+if [ -e 'node_modules/.bin/prettier' ]; then
+	npm run prettier || { echo 'The javascript code seems to be not satifying the prettier code styler.'; exit 3; }
+fi
+
+if [ -e 'node_modules/.bin/stylelint' ]; then
+	npm run stylelint || { echo 'The CSS code seems to be not satifying the stylelint linter.'; exit 4; }
+fi
diff --git a/CHANGELOG.md b/CHANGELOG.md
index ecd689c6b..6408ceeb3 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -15,6 +15,8 @@
   [#839](https://github.com/nextcloud/cookbook/pull/839) @christianlupus
 - Fix bug in Makefile to simplify development
   [#839](https://github.com/nextcloud/cookbook/pull/839) @christianlupus
+- Update eslint and dependencies
+  [#848](https://github.com/nextcloud/cookbook/pull/848) @christianlupus
 
 
 ## 0.9.6 - 2021-10-18
diff --git a/package.json b/package.json
index c9b0a7a28..aab41e1eb 100644
--- a/package.json
+++ b/package.json
@@ -46,11 +46,11 @@
     "babel-loader": "^8.1.0",
     "compression-webpack-plugin": "^9.0.0",
     "css-loader": "^6.0.0",
-    "eslint": "^7.32.0",
-    "eslint-config-airbnb-base": "^14.2.1",
+    "eslint": "^8.2.0",
+    "eslint-config-airbnb-base": "^15.0.0",
     "eslint-config-prettier": "^8.0.0",
     "eslint-plugin-import": "^2.22.1",
-    "eslint-plugin-vue": "^7.5.0",
+    "eslint-plugin-vue": "^8.0.3",
     "file-loader": "^6.0.0",
     "lodash-webpack-plugin": "^0.11.5",
     "prettier": "^2.2.1",
diff --git a/src/components/AppIndex.vue b/src/components/AppIndex.vue
index 6570727ed..2d52fc8e2 100644
--- a/src/components/AppIndex.vue
+++ b/src/components/AppIndex.vue
@@ -8,7 +8,7 @@ import axios from "@nextcloud/axios"
 import RecipeList from "./RecipeList.vue"
 
 export default {
-    name: "Index",
+    name: "AppIndex",
     components: {
         RecipeList,
     },
diff --git a/src/components/AppMain.vue b/src/components/AppMain.vue
index 188fa4d72..63b9ac284 100644
--- a/src/components/AppMain.vue
+++ b/src/components/AppMain.vue
@@ -17,7 +17,7 @@ import AppControls from "./AppControls.vue"
 import AppNavi from "./AppNavi.vue"
 
 export default {
-    name: "Main",
+    name: "AppMain",
     components: {
         AppContent,
         AppControls,
diff --git a/src/components/AppNavi.vue b/src/components/AppNavi.vue
index 44b7943b7..d62caef2b 100644
--- a/src/components/AppNavi.vue
+++ b/src/components/AppNavi.vue
@@ -79,6 +79,7 @@
                     slot="counter"
                     >{{ cat.recipeCount }}</AppNavigationCounter
                 >
+                <!-- eslint-disable-next-line vue/no-lone-template -->
                 <template>
                     <AppNavigationItem
                         v-for="(rec, idy) in cat.recipes"
diff --git a/src/components/EditInputGroup.vue b/src/components/EditInputGroup.vue
index e925d38e1..46180c5d4 100644
--- a/src/components/EditInputGroup.vue
+++ b/src/components/EditInputGroup.vue
@@ -232,28 +232,25 @@ export default {
                 e.preventDefault()
                 const $li = e.currentTarget.closest("li")
                 const $ul = $li.closest("ul")
-                // eslint-disable-next-line camelcase
-                const $pressed_li_index = Array.prototype.indexOf.call(
+                const $pressedLiIndex = Array.prototype.indexOf.call(
                     $ul.childNodes,
                     $li
                 )
 
                 if (e.keyCode === 13 || e.keyCode === 10) {
                     if (
-                        // eslint-disable-next-line camelcase
-                        $pressed_li_index >=
+                        $pressedLiIndex >=
                         this.$refs["list-field"].length - 1
                     ) {
                         this.addNewEntry()
                     } else {
-                        // eslint-disable-next-line camelcase
-                        $ul.children[$pressed_li_index + 1]
+                        $ul.children[$pressedLiIndex + 1]
                             .getElementsByTagName("input")[0]
                             .focus()
                     }
                 } else if (this.referencePopupEnabled && e.key === "#") {
                     e.preventDefault()
-                    const elm = this.$refs["list-field"][$pressed_li_index]
+                    const elm = this.$refs["list-field"][$pressedLiIndex]
                     // Check if the letter before the hash
                     const cursorPos = elm.selectionStart
                     const content = elm.value
@@ -270,8 +267,7 @@ export default {
                         this.$parent.$emit("showRecipeReferencesPopup", {
                             context: this,
                         })
-                        // eslint-disable-next-line camelcase
-                        this.lastFocusedFieldIndex = $pressed_li_index
+                        this.lastFocusedFieldIndex = $pressedLiIndex
                         this.lastCursorPosition = cursorPos
                     }
                 }
diff --git a/src/components/RecipeList.vue b/src/components/RecipeList.vue
index 657f401a4..a0cecf602 100644
--- a/src/components/RecipeList.vue
+++ b/src/components/RecipeList.vue
@@ -16,10 +16,7 @@
                 :placeholder="t('cookbook', 'Select order')"
                 :options="recipeOrderingOptions"
             >
-                <template
-                    slot="placeholder"
-                    class="recipe-sorting-item-placeholder"
-                >
+                <template slot="placeholder">
                     <span class="icon-triangle-n" style="margin-right: -8px" />
                     <span class="ordering-item-icon icon-triangle-s" />
                     {{ t("cookbook", "Select order") }}
@@ -318,10 +315,6 @@ export default {
     margin-bottom: 0.75ex;
 }
 
-.recipe-sorting-item-placeholder {
-    display: block;
-}
-
 .ordering-item-icon {
     margin-right: 0.5em;
 }
diff --git a/src/components/SearchResults.vue b/src/components/SearchResults.vue
index c0d5d7b19..c4a083879 100644
--- a/src/components/SearchResults.vue
+++ b/src/components/SearchResults.vue
@@ -10,7 +10,7 @@ import axios from "@nextcloud/axios"
 import RecipeList from "./RecipeList.vue"
 
 export default {
-    name: "Search",
+    name: "SearchResult",
     components: {
         RecipeList,
     },