Added ESLint support

.eslintrc.json

@@ -0,0 +1,41 @@
+{
+    "env": {
+        "browser": true,
+        "es2021": true,
+        "node": true
+    },
+    "extends": [
+        "airbnb",
+        "eslint:recommended",
+        "plugin:@typescript-eslint/recommended",
+        "plugin:react/recommended"
+    ],
+    "globals": {
+      "React": "readonly"
+    },
+    "parser": "@typescript-eslint/parser",
+    "parserOptions": {
+        "ecmaFeatures": {
+            "jsx": true
+        },
+        "ecmaVersion": 12,
+        "sourceType": "module"
+    },
+    "plugins": [
+        "react",
+        "@typescript-eslint"
+    ],
+    "rules": {
+      "comma-dangle": "off",
+      "react/jsx-filename-extension": [1, { "extensions": [".tsx"] }],
+      "react/jsx-props-no-spreading": "off"
+    },
+    "settings": {
+      "import/parsers": {
+        "@typescript-eslint/parser": [".ts", ".tsx"]
+      },
+      "import/resolver": {
+        "typescript": {}
+      }
+    }
+}

next-env.d.ts

@@ -1,2 +1,2 @@
-/// <reference types="next" />
+/// <reference types="next" />
-/// <reference types="next/types/global" />
+/// <reference types="next/types/global" />

next.config.js

@@ -1,3 +1,3 @@
-module.exports = {
+module.exports = {
-  reactStrictMode: true
+  reactStrictMode: true
-};
+};

package.json

@@ -6,6 +6,7 @@
     "dev": "next dev",
     "build": "next build",
     "start": "next start",
+    "eslint": "eslint .",
     "test": "echo \"Error: no test specified\" && exit 1"
   },
   "repository": {
@@ -23,6 +24,15 @@
   "devDependencies": {
     "@types/node": "^14.14.19",
     "@types/react": "^17.0.0",
+    "@typescript-eslint/eslint-plugin": "^4.11.1",
+    "@typescript-eslint/parser": "^4.11.1",
+    "eslint": "^7.17.0",
+    "eslint-config-airbnb": "^18.2.1",
+    "eslint-import-resolver-typescript": "^2.3.0",
+    "eslint-plugin-import": "^2.22.1",
+    "eslint-plugin-jsx-a11y": "^6.4.1",
+    "eslint-plugin-react": "^7.22.0",
+    "eslint-plugin-react-hooks": "^4.2.0",
     "typescript": "^4.1.3"
   }
 }

pages/_app.tsx

@@ -1,7 +1,8 @@
 import 'styles/globals.scss';
 
 import type { AppProps } from 'next/app';
+import type { ReactElement } from 'react';
 
-export default function MyApp({ Component, pageProps }: AppProps) {
+export default function MyApp({ Component, pageProps }: AppProps): ReactElement {
   return <Component {...pageProps} />;
-};
+}

pages/index.tsx

@@ -1,3 +1,5 @@
-export default function Home() {
+import type { ReactElement } from 'react';
+
+export default function Home(): ReactElement {
   return <h1>Hello, world!</h1>;
 }