improve project setup

Author: rezkiy37

.eslintrc.json

@@ -1,31 +1,70 @@
 {
+    "root": true,
     "env": {
         "browser": true,
         "es2021": true,
         "jest": true
     },
-    "extends": [
-        "eslint:recommended",
-        "plugin:@typescript-eslint/recommended",
-        "plugin:react/recommended",
-        "prettier"
-    ],
+    "extends": ["eslint:recommended", "airbnb", "plugin:@typescript-eslint/recommended", "plugin:react/jsx-runtime", "plugin:jsx-a11y/recommended", "plugin:react/recommended", "prettier"],
     "parser": "@typescript-eslint/parser",
     "parserOptions": {
         "ecmaVersion": "latest",
         "sourceType": "module"
     },
-    "ignorePatterns": [
-        "dist/**.*",
-        "node_modules/**",
-        ".git/**",
-        "webpack.config.js"
-    ],
-    "plugins": [
-        "@typescript-eslint",
-        "react"
+    "ignorePatterns": ["dist", "node_modules", ".git", "webpack.config.js"],
+    "plugins": ["@typescript-eslint", "react", "jsx-a11y"],
+    "rules": {
+        "arrow-parens": [
+            "error",
+            "as-needed",
+            {
+                "requireForBlockBody": true
+            }
+        ],
+        "no-invalid-this": "error",
+        "react/function-component-definition": [
+            "error",
+            {
+                "namedComponents": "function-declaration",
+                "unnamedComponents": "arrow-function"
+            }
+        ],
+        "no-restricted-syntax": [
+            "error",
+            // The following four selectors prevent the usage of async/await
+            {
+                "selector": "AwaitExpression",
+                "message": "async/await is not allowed"
+            },
+            {
+                "selector": "FunctionDeclaration[async=true]",
+                "message": "async functions are not allowed"
+            },
+            {
+                "selector": "FunctionExpression[async=true]",
+                "message": "async functions are not allowed"
+            },
+            {
+                "selector": "ArrowFunctionExpression[async=true]",
+                "message": "async functions are not allowed"
+            },
+            {
+                "selector": "MethodDefinition[async=true]",
+                "message": "async methods are not allowed"
+            }
+        ]
+    },
+    "overrides": [
+        {
+            "files": ["*.ts", "*.tsx"],
+            "plugins": ["@typescript-eslint"],
+            "extends": ["plugin:@typescript-eslint/recommended-type-checked", "airbnb-typescript", "prettier"],
+            "parser": "@typescript-eslint/parser",
+            "parserOptions": {
+                "project": "./tsconfig.json"
+            }
+        }
     ],
-    "rules": {},
     "settings": {
         "react": {
             "version": "detect"

.gitignore

@@ -1,2 +1,10 @@
-node_modules
-dist
+# OSX
+.DS_Store
+
+# node.js
+node_modules/
+npm-debug.log
+dist/
+
+# NPM file created by GitHub actions
+.npmrc

.prettierignore

@@ -1,7 +1,10 @@
+# The GH actions don't seem to compile and verify themselves well when Prettier is applied to them
 dist
 package.json
 package-lock.json
 *.html
 *.css
 *.scss
 *.md
+*.yml
+*.yaml

babel.config.json

@@ -0,0 +1,13 @@
+{
+    "presets": [
+        "@babel/preset-env",
+        [
+            "@babel/preset-react",
+            {
+                "runtime": "automatic"
+            }
+        ],
+        "@babel/preset-typescript"
+    ],
+    "sourceMaps": true
+}