Add linting and code formatting

web/.eslintrc.js

@@ -0,0 +1,27 @@
+module.exports = {
+  env: {
+    browser: true,
+    es2021: true,
+  },
+  extends: [
+    "plugin:react/recommended",
+    "airbnb",
+    "prettier",
+    "prettier/@typescript-eslint",
+    "prettier/react",
+  ],
+  parser: "@typescript-eslint/parser",
+  parserOptions: {
+    ecmaFeatures: {
+      jsx: true,
+    },
+    ecmaVersion: 12,
+    sourceType: "module",
+  },
+  plugins: ["react", "@typescript-eslint"],
+  rules: {
+    "react/react-in-jsx-scope": "off",
+    "react/jsx-filename-extension": [1, { extensions: [".js", ".jsx", ".tsx"] }],
+    "react/jsx-props-no-spreading": "off",
+  },
+};

web/.prettierignore

@@ -0,0 +1,3 @@
+# Ignore artifacts:
+node_modules
+out

web/.prettierrc

@@ -0,0 +1,4 @@
+{
+  "tabWidth": 2,
+  "useTabs": false
+}

web/package.json

@@ -8,6 +8,7 @@
     "start": "next start"
   },
   "dependencies": {
+    "@ant-design/icons": "^4.2.2",
     "antd": "^4.6.6",
     "next": "9.5.3",
     "react": "16.13.1",
@@ -17,6 +18,17 @@
   "devDependencies": {
     "@types/node": "^14.11.2",
     "@types/react": "^16.9.49",
+    "@typescript-eslint/eslint-plugin": "^4.3.0",
+    "@typescript-eslint/parser": "^4.3.0",
+    "eslint": "^7.10.0",
+    "eslint-config-airbnb": "^18.2.0",
+    "eslint-config-prettier": "^6.12.0",
+    "eslint-plugin-import": "^2.22.1",
+    "eslint-plugin-jsx-a11y": "^6.3.1",
+    "eslint-plugin-prettier": "^3.1.4",
+    "eslint-plugin-react": "^7.21.2",
+    "eslint-plugin-react-hooks": "^4.1.2",
+    "prettier": "^2.1.2",
     "typescript": "^4.0.3"
   }
 }

web/pages/index.tsx

@@ -1,7 +1,6 @@
-import Head from 'next/head'
-
 import { Card, Alert, Statistic, Row, Col } from "antd";
 import { LikeOutlined } from "@ant-design/icons";
+
 const { Meta } = Card;
 
 export default function Home() {