From 93d2b1e42e8115e79447f3820b3ed53bb3514a96 Mon Sep 17 00:00:00 2001 From: YeongseoYoon Date: Sat, 14 Dec 2024 23:42:51 +0900 Subject: [PATCH 01/42] =?UTF-8?q?feat:=20TypeScript=EB=A1=9C=20=EC=A0=84?= =?UTF-8?q?=ED=99=98=20=EB=B0=8F=20tsconfig=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- index.hash.html | 2 +- index.html | 2 +- package-lock.json | 376 +++++++++++++++++++ package.json | 3 + playwright.config.js => playwright.config.ts | 0 src/main.hash.js | 1 - src/main.hash.ts | 1 + src/{setupTests.js => setupTests.ts} | 0 tsconfig.json | 19 + vite.config.js => vite.config.ts | 0 10 files changed, 401 insertions(+), 3 deletions(-) rename playwright.config.js => playwright.config.ts (100%) delete mode 100644 src/main.hash.js create mode 100644 src/main.hash.ts rename src/{setupTests.js => setupTests.ts} (100%) create mode 100644 tsconfig.json rename vite.config.js => vite.config.ts (100%) diff --git a/index.hash.html b/index.hash.html index 461e8365..066dc0b4 100644 --- a/index.hash.html +++ b/index.hash.html @@ -8,6 +8,6 @@
- + diff --git a/index.html b/index.html index 0005b871..b5dc14ea 100644 --- a/index.html +++ b/index.html @@ -8,6 +8,6 @@
- + diff --git a/package-lock.json b/package-lock.json index 8a563559..90dbaf38 100644 --- a/package-lock.json +++ b/package-lock.json @@ -12,6 +12,8 @@ "@playwright/test": "^1.49.1", "@testing-library/jest-dom": "^6.6.3", "@testing-library/user-event": "^14.5.2", + "@typescript-eslint/eslint-plugin": "^8.18.0", + "@typescript-eslint/parser": "^8.18.0", "@vitest/ui": "^2.1.8", "eslint": "^9.16.0", "eslint-config-prettier": "^9.1.0", @@ -21,6 +23,7 @@ "jsdom": "^25.0.1", "lint-staged": "^15.2.11", "prettier": "^3.4.2", + "typescript": "^5.7.2", "vite": "^6.0.3", "vitest": "^2.1.8" } @@ -733,6 +736,41 @@ "integrity": "sha512-gv3ZRaISU3fjPAgNsriBRqGWQL6quFx04YMPW/zD8XMLsU32mhCCbfbO6KZFLjvYpCZ8zyDEgqsgf+PwPaM7GQ==", "dev": true }, + "node_modules/@nodelib/fs.scandir": { + "version": "2.1.5", + "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz", + "integrity": "sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==", + "dev": true, + "dependencies": { + "@nodelib/fs.stat": "2.0.5", + "run-parallel": "^1.1.9" + }, + "engines": { + "node": ">= 8" + } + }, + "node_modules/@nodelib/fs.stat": { + "version": "2.0.5", + "resolved": "https://registry.npmjs.org/@nodelib/fs.stat/-/fs.stat-2.0.5.tgz", + "integrity": "sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==", + "dev": true, + "engines": { + "node": ">= 8" + } + }, + "node_modules/@nodelib/fs.walk": { + "version": "1.2.8", + "resolved": "https://registry.npmjs.org/@nodelib/fs.walk/-/fs.walk-1.2.8.tgz", + "integrity": "sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==", + "dev": true, + "dependencies": { + "@nodelib/fs.scandir": "2.1.5", + "fastq": "^1.6.0" + }, + "engines": { + "node": ">= 8" + } + }, "node_modules/@pkgr/core": { "version": "0.1.1", "resolved": "https://registry.npmjs.org/@pkgr/core/-/core-0.1.1.tgz", @@ -1119,6 +1157,202 @@ "integrity": "sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==", "dev": true }, + "node_modules/@typescript-eslint/eslint-plugin": { + "version": "8.18.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.18.0.tgz", + "integrity": "sha512-NR2yS7qUqCL7AIxdJUQf2MKKNDVNaig/dEB0GBLU7D+ZdHgK1NoH/3wsgO3OnPVipn51tG3MAwaODEGil70WEw==", + "dev": true, + "dependencies": { + "@eslint-community/regexpp": "^4.10.0", + "@typescript-eslint/scope-manager": "8.18.0", + "@typescript-eslint/type-utils": "8.18.0", + "@typescript-eslint/utils": "8.18.0", + "@typescript-eslint/visitor-keys": "8.18.0", + "graphemer": "^1.4.0", + "ignore": "^5.3.1", + "natural-compare": "^1.4.0", + "ts-api-utils": "^1.3.0" + }, + "engines": { + "node": "^18.18.0 || ^20.9.0 || >=21.1.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/typescript-eslint" + }, + "peerDependencies": { + "@typescript-eslint/parser": "^8.0.0 || ^8.0.0-alpha.0", + "eslint": "^8.57.0 || ^9.0.0", + "typescript": ">=4.8.4 <5.8.0" + } + }, + "node_modules/@typescript-eslint/parser": { + "version": "8.18.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-8.18.0.tgz", + "integrity": "sha512-hgUZ3kTEpVzKaK3uNibExUYm6SKKOmTU2BOxBSvOYwtJEPdVQ70kZJpPjstlnhCHcuc2WGfSbpKlb/69ttyN5Q==", + "dev": true, + "dependencies": { + "@typescript-eslint/scope-manager": "8.18.0", + "@typescript-eslint/types": "8.18.0", + "@typescript-eslint/typescript-estree": "8.18.0", + "@typescript-eslint/visitor-keys": "8.18.0", + "debug": "^4.3.4" + }, + "engines": { + "node": "^18.18.0 || ^20.9.0 || >=21.1.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/typescript-eslint" + }, + "peerDependencies": { + "eslint": "^8.57.0 || ^9.0.0", + "typescript": ">=4.8.4 <5.8.0" + } + }, + "node_modules/@typescript-eslint/scope-manager": { + "version": "8.18.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.18.0.tgz", + "integrity": "sha512-PNGcHop0jkK2WVYGotk/hxj+UFLhXtGPiGtiaWgVBVP1jhMoMCHlTyJA+hEj4rszoSdLTK3fN4oOatrL0Cp+Xw==", + "dev": true, + "dependencies": { + "@typescript-eslint/types": "8.18.0", + "@typescript-eslint/visitor-keys": "8.18.0" + }, + "engines": { + "node": "^18.18.0 || ^20.9.0 || >=21.1.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/typescript-eslint" + } + }, + "node_modules/@typescript-eslint/type-utils": { + "version": "8.18.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-8.18.0.tgz", + "integrity": "sha512-er224jRepVAVLnMF2Q7MZJCq5CsdH2oqjP4dT7K6ij09Kyd+R21r7UVJrF0buMVdZS5QRhDzpvzAxHxabQadow==", + "dev": true, + "dependencies": { + "@typescript-eslint/typescript-estree": "8.18.0", + "@typescript-eslint/utils": "8.18.0", + "debug": "^4.3.4", + "ts-api-utils": "^1.3.0" + }, + "engines": { + "node": "^18.18.0 || ^20.9.0 || >=21.1.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/typescript-eslint" + }, + "peerDependencies": { + "eslint": "^8.57.0 || ^9.0.0", + "typescript": ">=4.8.4 <5.8.0" + } + }, + "node_modules/@typescript-eslint/types": { + "version": "8.18.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.18.0.tgz", + "integrity": "sha512-FNYxgyTCAnFwTrzpBGq+zrnoTO4x0c1CKYY5MuUTzpScqmY5fmsh2o3+57lqdI3NZucBDCzDgdEbIaNfAjAHQA==", + "dev": true, + "engines": { + "node": "^18.18.0 || ^20.9.0 || >=21.1.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/typescript-eslint" + } + }, + "node_modules/@typescript-eslint/typescript-estree": { + "version": "8.18.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.18.0.tgz", + "integrity": "sha512-rqQgFRu6yPkauz+ms3nQpohwejS8bvgbPyIDq13cgEDbkXt4LH4OkDMT0/fN1RUtzG8e8AKJyDBoocuQh8qNeg==", + "dev": true, + "dependencies": { + "@typescript-eslint/types": "8.18.0", + "@typescript-eslint/visitor-keys": "8.18.0", + "debug": "^4.3.4", + "fast-glob": "^3.3.2", + "is-glob": "^4.0.3", + "minimatch": "^9.0.4", + "semver": "^7.6.0", + "ts-api-utils": "^1.3.0" + }, + "engines": { + "node": "^18.18.0 || ^20.9.0 || >=21.1.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/typescript-eslint" + }, + "peerDependencies": { + "typescript": ">=4.8.4 <5.8.0" + } + }, + "node_modules/@typescript-eslint/typescript-estree/node_modules/brace-expansion": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz", + "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==", + "dev": true, + "dependencies": { + "balanced-match": "^1.0.0" + } + }, + "node_modules/@typescript-eslint/typescript-estree/node_modules/minimatch": { + "version": "9.0.5", + "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz", + "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==", + "dev": true, + "dependencies": { + "brace-expansion": "^2.0.1" + }, + "engines": { + "node": ">=16 || 14 >=14.17" + }, + "funding": { + "url": "https://github.com/sponsors/isaacs" + } + }, + "node_modules/@typescript-eslint/utils": { + "version": "8.18.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.18.0.tgz", + "integrity": "sha512-p6GLdY383i7h5b0Qrfbix3Vc3+J2k6QWw6UMUeY5JGfm3C5LbZ4QIZzJNoNOfgyRe0uuYKjvVOsO/jD4SJO+xg==", + "dev": true, + "dependencies": { + "@eslint-community/eslint-utils": "^4.4.0", + "@typescript-eslint/scope-manager": "8.18.0", + "@typescript-eslint/types": "8.18.0", + "@typescript-eslint/typescript-estree": "8.18.0" + }, + "engines": { + "node": "^18.18.0 || ^20.9.0 || >=21.1.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/typescript-eslint" + }, + "peerDependencies": { + "eslint": "^8.57.0 || ^9.0.0", + "typescript": ">=4.8.4 <5.8.0" + } + }, + "node_modules/@typescript-eslint/visitor-keys": { + "version": "8.18.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.18.0.tgz", + "integrity": "sha512-pCh/qEA8Lb1wVIqNvBke8UaRjJ6wrAWkJO5yyIbs8Yx6TNGYyfNjOo61tLv+WwLvoLPp4BQ8B7AHKijl8NGUfw==", + "dev": true, + "dependencies": { + "@typescript-eslint/types": "8.18.0", + "eslint-visitor-keys": "^4.2.0" + }, + "engines": { + "node": "^18.18.0 || ^20.9.0 || >=21.1.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/typescript-eslint" + } + }, "node_modules/@vitest/expect": { "version": "2.1.8", "resolved": "https://registry.npmjs.org/@vitest/expect/-/expect-2.1.8.tgz", @@ -1970,6 +2204,34 @@ "integrity": "sha512-VxPP4NqbUjj6MaAOafWeUn2cXWLcCtljklUtZf0Ind4XQ+QPtmA0b18zZy0jIQx+ExRVCR/ZQpBmik5lXshNsw==", "dev": true }, + "node_modules/fast-glob": { + "version": "3.3.2", + "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.2.tgz", + "integrity": "sha512-oX2ruAFQwf/Orj8m737Y5adxDQO0LAB7/S5MnxCdTNDd4p6BsyIVsv9JQsATbTSq8KHRpLwIHbVlUNatxd+1Ow==", + "dev": true, + "dependencies": { + "@nodelib/fs.stat": "^2.0.2", + "@nodelib/fs.walk": "^1.2.3", + "glob-parent": "^5.1.2", + "merge2": "^1.3.0", + "micromatch": "^4.0.4" + }, + "engines": { + "node": ">=8.6.0" + } + }, + "node_modules/fast-glob/node_modules/glob-parent": { + "version": "5.1.2", + "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz", + "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==", + "dev": true, + "dependencies": { + "is-glob": "^4.0.1" + }, + "engines": { + "node": ">= 6" + } + }, "node_modules/fast-json-stable-stringify": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz", @@ -1982,6 +2244,15 @@ "integrity": "sha512-DCXu6Ifhqcks7TZKY3Hxp3y6qphY5SJZmrWMDrKcERSOXWQdMhU9Ig/PYrzyw/ul9jOIyh0N4M0tbC5hodg8dw==", "dev": true }, + "node_modules/fastq": { + "version": "1.17.1", + "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.17.1.tgz", + "integrity": "sha512-sRVD3lWVIXWg6By68ZN7vho9a1pQcN/WBFaAAsDDFzlJjvoGx0P8z7V1t72grFJfJhu3YPZBuu25f7Kaw2jN1w==", + "dev": true, + "dependencies": { + "reusify": "^1.0.4" + } + }, "node_modules/fdir": { "version": "6.4.2", "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.4.2.tgz", @@ -2137,6 +2408,12 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/graphemer": { + "version": "1.4.0", + "resolved": "https://registry.npmjs.org/graphemer/-/graphemer-1.4.0.tgz", + "integrity": "sha512-EtKwoO6kxCL9WO5xipiHTZlSzBm7WLT627TqC/uVRd0HKmq8NXyebnNYxDoBi7wt8eTWrUrKXCOVaFq9x1kgag==", + "dev": true + }, "node_modules/has-flag": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz", @@ -2616,6 +2893,15 @@ "integrity": "sha512-abv/qOcuPfk3URPfDzmZU1LKmuw8kT+0nIHvKrKgFrwifol/doWcdA4ZqsWQ8ENrFKkd67Mfpo/LovbIUsbt3w==", "dev": true }, + "node_modules/merge2": { + "version": "1.4.1", + "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz", + "integrity": "sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==", + "dev": true, + "engines": { + "node": ">= 8" + } + }, "node_modules/micromatch": { "version": "4.0.8", "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.8.tgz", @@ -3073,6 +3359,26 @@ "node": ">=6" } }, + "node_modules/queue-microtask": { + "version": "1.2.3", + "resolved": "https://registry.npmjs.org/queue-microtask/-/queue-microtask-1.2.3.tgz", + "integrity": "sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==", + "dev": true, + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/feross" + }, + { + "type": "patreon", + "url": "https://www.patreon.com/feross" + }, + { + "type": "consulting", + "url": "https://feross.org/support" + } + ] + }, "node_modules/react-is": { "version": "17.0.2", "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz", @@ -3140,6 +3446,16 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/reusify": { + "version": "1.0.4", + "resolved": "https://registry.npmjs.org/reusify/-/reusify-1.0.4.tgz", + "integrity": "sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==", + "dev": true, + "engines": { + "iojs": ">=1.0.0", + "node": ">=0.10.0" + } + }, "node_modules/rfdc": { "version": "1.4.1", "resolved": "https://registry.npmjs.org/rfdc/-/rfdc-1.4.1.tgz", @@ -3190,6 +3506,29 @@ "integrity": "sha512-TrEMa7JGdVm0UThDJSx7ddw5nVm3UJS9o9CCIZ72B1vSyEZoziDqBYP3XIoi/12lKrJR8rE3jeFHMok2F/Mnsg==", "dev": true }, + "node_modules/run-parallel": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz", + "integrity": "sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==", + "dev": true, + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/feross" + }, + { + "type": "patreon", + "url": "https://www.patreon.com/feross" + }, + { + "type": "consulting", + "url": "https://feross.org/support" + } + ], + "dependencies": { + "queue-microtask": "^1.2.2" + } + }, "node_modules/safer-buffer": { "version": "2.1.2", "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz", @@ -3208,6 +3547,18 @@ "node": ">=v12.22.7" } }, + "node_modules/semver": { + "version": "7.6.3", + "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.3.tgz", + "integrity": "sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==", + "dev": true, + "bin": { + "semver": "bin/semver.js" + }, + "engines": { + "node": ">=10" + } + }, "node_modules/shebang-command": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz", @@ -3548,6 +3899,18 @@ "node": ">=18" } }, + "node_modules/ts-api-utils": { + "version": "1.4.3", + "resolved": "https://registry.npmjs.org/ts-api-utils/-/ts-api-utils-1.4.3.tgz", + "integrity": "sha512-i3eMG77UTMD0hZhgRS562pv83RC6ukSAC2GMNWc+9dieh/+jDM5u5YG+NHX6VNDRHQcHwmsTHctP9LhbC3WxVw==", + "dev": true, + "engines": { + "node": ">=16" + }, + "peerDependencies": { + "typescript": ">=4.2.0" + } + }, "node_modules/tslib": { "version": "2.8.1", "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz", @@ -3566,6 +3929,19 @@ "node": ">= 0.8.0" } }, + "node_modules/typescript": { + "version": "5.7.2", + "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.7.2.tgz", + "integrity": "sha512-i5t66RHxDvVN40HfDd1PsEThGNnlMCMT3jMUuoh9/0TaqWevNontacunWyN02LA9/fIbEWlcHZcgTKb9QoaLfg==", + "dev": true, + "bin": { + "tsc": "bin/tsc", + "tsserver": "bin/tsserver" + }, + "engines": { + "node": ">=14.17" + } + }, "node_modules/uri-js": { "version": "4.4.1", "resolved": "https://registry.npmjs.org/uri-js/-/uri-js-4.4.1.tgz", diff --git a/package.json b/package.json index e535bf69..dfd5d19b 100644 --- a/package.json +++ b/package.json @@ -31,6 +31,8 @@ "@playwright/test": "^1.49.1", "@testing-library/jest-dom": "^6.6.3", "@testing-library/user-event": "^14.5.2", + "@typescript-eslint/eslint-plugin": "^8.18.0", + "@typescript-eslint/parser": "^8.18.0", "@vitest/ui": "^2.1.8", "eslint": "^9.16.0", "eslint-config-prettier": "^9.1.0", @@ -40,6 +42,7 @@ "jsdom": "^25.0.1", "lint-staged": "^15.2.11", "prettier": "^3.4.2", + "typescript": "^5.7.2", "vite": "^6.0.3", "vitest": "^2.1.8" } diff --git a/playwright.config.js b/playwright.config.ts similarity index 100% rename from playwright.config.js rename to playwright.config.ts diff --git a/src/main.hash.js b/src/main.hash.js deleted file mode 100644 index 3ef381e0..00000000 --- a/src/main.hash.js +++ /dev/null @@ -1 +0,0 @@ -import "./main.js"; diff --git a/src/main.hash.ts b/src/main.hash.ts new file mode 100644 index 00000000..d5b2e84e --- /dev/null +++ b/src/main.hash.ts @@ -0,0 +1 @@ +import "./main.ts"; diff --git a/src/setupTests.js b/src/setupTests.ts similarity index 100% rename from src/setupTests.js rename to src/setupTests.ts diff --git a/tsconfig.json b/tsconfig.json new file mode 100644 index 00000000..eac16d14 --- /dev/null +++ b/tsconfig.json @@ -0,0 +1,19 @@ +{ + "compilerOptions": { + "target": "ESNext", + "useDefineForClassFields": true, + "module": "ESNext", + "lib": ["ESNext", "DOM"], + "moduleResolution": "Node", + "strict": true, + "resolveJsonModule": true, + "isolatedModules": true, + "esModuleInterop": true, + "noEmit": true, + "noUnusedLocals": true, + "noUnusedParameters": true, + "noImplicitReturns": true, + "skipLibCheck": true + }, + "include": ["src"] +} diff --git a/vite.config.js b/vite.config.ts similarity index 100% rename from vite.config.js rename to vite.config.ts From 9ecb80c61bbdbb4d26e99140657f9fecf20138f5 Mon Sep 17 00:00:00 2001 From: YeongseoYoon Date: Sat, 14 Dec 2024 23:44:12 +0900 Subject: [PATCH 02/42] =?UTF-8?q?feat:=20=EB=A9=94=EC=9D=B8=20=ED=8E=98?= =?UTF-8?q?=EC=9D=B4=EC=A7=80,=20=EB=A1=9C=EA=B7=B8=EC=9D=B8=20=ED=8E=98?= =?UTF-8?q?=EC=9D=B4=EC=A7=80,=20=ED=94=84=EB=A1=9C=ED=95=84=20=ED=8E=98?= =?UTF-8?q?=EC=9D=B4=EC=A7=80=20=EB=B0=8F=20=EC=97=90=EB=9F=AC=20=ED=8E=98?= =?UTF-8?q?=EC=9D=B4=EC=A7=80=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Footer.ts | 0 src/main.js | 241 --------------------------------------- src/main.ts | 5 + src/pages/ErrorPage.ts | 17 +++ src/pages/LoginPage.ts | 25 ++++ src/pages/MainPage.ts | 113 ++++++++++++++++++ src/pages/ProfilePage.ts | 84 ++++++++++++++ 7 files changed, 244 insertions(+), 241 deletions(-) create mode 100644 src/components/Footer.ts delete mode 100644 src/main.js create mode 100644 src/main.ts create mode 100644 src/pages/ErrorPage.ts create mode 100644 src/pages/LoginPage.ts create mode 100644 src/pages/MainPage.ts create mode 100644 src/pages/ProfilePage.ts diff --git a/src/components/Footer.ts b/src/components/Footer.ts new file mode 100644 index 00000000..e69de29b diff --git a/src/main.js b/src/main.js deleted file mode 100644 index 036c2a38..00000000 --- a/src/main.js +++ /dev/null @@ -1,241 +0,0 @@ -const MainPage = () => ` -
-
-
-

항해플러스

-
- - - -
-
- - -
- -
- -
-
- 프로필 -
-

홍길동

-

5분 전

-
-
-

오늘 날씨가 정말 좋네요. 다들 좋은 하루 보내세요!

-
- - - -
-
- -
-
- 프로필 -
-

김철수

-

15분 전

-
-
-

새로운 프로젝트를 시작했어요. 열심히 코딩 중입니다!

-
- - - -
-
- -
-
- 프로필 -
-

이영희

-

30분 전

-
-
-

오늘 점심 메뉴 추천 받습니다. 뭐가 좋을까요?

-
- - - -
-
- -
-
- 프로필 -
-

박민수

-

1시간 전

-
-
-

주말에 등산 가실 분 계신가요? 함께 가요!

-
- - - -
-
- -
-
- 프로필 -
-

정수연

-

2시간 전

-
-
-

새로 나온 영화 재미있대요. 같이 보러 갈 사람?

-
- - - -
-
-
-
- -
-

© 2024 항해플러스. All rights reserved.

-
-
-
-`; - -const ErrorPage = () => ` -
-
-

항해플러스

-

404

-

페이지를 찾을 수 없습니다

-

- 요청하신 페이지가 존재하지 않거나 이동되었을 수 있습니다. -

- - 홈으로 돌아가기 - -
-
-`; - -const LoginPage = () => ` -
-
-

항해플러스

-
-
- -
-
- -
- -
-
- 비밀번호를 잊으셨나요? -
-
-
- -
-
-
-`; - -const ProfilePage = () => ` -
-
-
-
-

항해플러스

-
- - - -
-
-

- 내 프로필 -

-
-
- - -
-
- - -
-
- - -
- -
-
-
- -
-

© 2024 항해플러스. All rights reserved.

-
-
-
-
-`; - -document.body.innerHTML = ` - ${MainPage()} - ${ProfilePage()} - ${LoginPage()} - ${ErrorPage()} -`; diff --git a/src/main.ts b/src/main.ts new file mode 100644 index 00000000..8491473a --- /dev/null +++ b/src/main.ts @@ -0,0 +1,5 @@ +import MainPage from "./pages/MainPage"; + +document.body.innerHTML = ` + ${MainPage()} +`; diff --git a/src/pages/ErrorPage.ts b/src/pages/ErrorPage.ts new file mode 100644 index 00000000..6182b3f3 --- /dev/null +++ b/src/pages/ErrorPage.ts @@ -0,0 +1,17 @@ +const ErrorPage = () => ` +
+
+

항해플러스

+

404

+

페이지를 찾을 수 없습니다

+

+ 요청하신 페이지가 존재하지 않거나 이동되었을 수 있습니다. +

+ + 홈으로 돌아가기 + +
+
+`; + +export default ErrorPage; diff --git a/src/pages/LoginPage.ts b/src/pages/LoginPage.ts new file mode 100644 index 00000000..8dffeef5 --- /dev/null +++ b/src/pages/LoginPage.ts @@ -0,0 +1,25 @@ +const LoginPage = () => ` +
+
+

항해플러스

+
+
+ +
+
+ +
+ +
+
+ 비밀번호를 잊으셨나요? +
+
+
+ +
+
+
+`; + +export default LoginPage; diff --git a/src/pages/MainPage.ts b/src/pages/MainPage.ts new file mode 100644 index 00000000..64e286f3 --- /dev/null +++ b/src/pages/MainPage.ts @@ -0,0 +1,113 @@ +const MainPage = () => ` +
+
+
+

항해플러스

+
+ + + +
+
+ + +
+ +
+ +
+
+ 프로필 +
+

홍길동

+

5분 전

+
+
+

오늘 날씨가 정말 좋네요. 다들 좋은 하루 보내세요!

+
+ + + +
+
+ +
+
+ 프로필 +
+

김철수

+

15분 전

+
+
+

새로운 프로젝트를 시작했어요. 열심히 코딩 중입니다!

+
+ + + +
+
+ +
+
+ 프로필 +
+

이영희

+

30분 전

+
+
+

오늘 점심 메뉴 추천 받습니다. 뭐가 좋을까요?

+
+ + + +
+
+ +
+
+ 프로필 +
+

박민수

+

1시간 전

+
+
+

주말에 등산 가실 분 계신가요? 함께 가요!

+
+ + + +
+
+ +
+
+ 프로필 +
+

정수연

+

2시간 전

+
+
+

새로 나온 영화 재미있대요. 같이 보러 갈 사람?

+
+ + + +
+
+
+
+ +
+

© 2024 항해플러스. All rights reserved.

+
+
+
+`; + +export default MainPage; diff --git a/src/pages/ProfilePage.ts b/src/pages/ProfilePage.ts new file mode 100644 index 00000000..34f5cece --- /dev/null +++ b/src/pages/ProfilePage.ts @@ -0,0 +1,84 @@ +const ProfilePage = () => ` +
+
+
+
+

항해플러스

+
+ + + +
+
+

+ 내 프로필 +

+
+
+ + +
+
+ + +
+
+ + +
+ +
+
+
+ +
+

© 2024 항해플러스. All rights reserved.

+
+
+
+
+`; + +export default ProfilePage; From b6493209fe9e0d5a02ebedf432d0149c5568af42 Mon Sep 17 00:00:00 2001 From: YeongseoYoon Date: Sun, 15 Dec 2024 00:44:50 +0900 Subject: [PATCH 03/42] =?UTF-8?q?feat:=20=EB=9D=BC=EC=9A=B0=ED=84=B0=20?= =?UTF-8?q?=EC=83=9D=EC=84=B1=20=ED=95=A8=EC=88=98=20createRouter=20?= =?UTF-8?q?=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/core/createRouter.ts | 39 +++++++++++++++++++++++++++++++++++++++ 1 file changed, 39 insertions(+) create mode 100644 src/core/createRouter.ts diff --git a/src/core/createRouter.ts b/src/core/createRouter.ts new file mode 100644 index 00000000..4b7d31cb --- /dev/null +++ b/src/core/createRouter.ts @@ -0,0 +1,39 @@ +import { Routes } from "../routes"; + +const createRouter = (container: HTMLElement, routes: Routes) => { + const render = (path: string) => { + const component = routes[path] || routes["*"]; + container.innerHTML = component(); + }; + + const navigate = (path: string) => { + window.history.pushState({}, "", path); + render(path); + }; + + const init = () => { + render(window.location.pathname); + + window.addEventListener("popstate", () => { + render(window.location.pathname); + }); + + document.addEventListener("click", (e) => { + const target = e.target as HTMLElement; + + if (target.matches("[data-link]")) { + e.preventDefault(); + const path = target.getAttribute("href") || "/"; + navigate(path); + } + }); + }; + + return { + render, + navigate, + init, + }; +}; + +export default createRouter; From 9571b81e199760c2fadaea1a43fc6202b307371e Mon Sep 17 00:00:00 2001 From: YeongseoYoon Date: Sun, 15 Dec 2024 00:45:06 +0900 Subject: [PATCH 04/42] =?UTF-8?q?feat:=20=EB=9D=BC=EC=9A=B0=ED=8C=85=20?= =?UTF-8?q?=EA=B8=B0=EB=8A=A5=EC=9D=84=20=EC=9C=84=ED=95=9C=20routes.ts=20?= =?UTF-8?q?=ED=8C=8C=EC=9D=BC=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/routes.ts | 15 +++++++++++++++ 1 file changed, 15 insertions(+) create mode 100644 src/routes.ts diff --git a/src/routes.ts b/src/routes.ts new file mode 100644 index 00000000..114a336e --- /dev/null +++ b/src/routes.ts @@ -0,0 +1,15 @@ +import ErrorPage from "./pages/ErrorPage"; +import LoginPage from "./pages/LoginPage"; +import MainPage from "./pages/MainPage"; +import ProfilePage from "./pages/ProfilePage"; + +export type Routes = { + [key: string]: () => string; +}; + +export const routes: Routes = { + "/": MainPage, + "/login": LoginPage, + "/profile": ProfilePage, + "*": ErrorPage, +}; From e18926acbd949b5678efabe8ba41326053ceac9e Mon Sep 17 00:00:00 2001 From: YeongseoYoon Date: Sun, 15 Dec 2024 00:45:24 +0900 Subject: [PATCH 05/42] =?UTF-8?q?feat:=20=EB=A9=94=EC=9D=B8=20=ED=8E=98?= =?UTF-8?q?=EC=9D=B4=EC=A7=80=EC=97=90=20=EB=9D=BC=EC=9A=B0=ED=84=B0=20?= =?UTF-8?q?=EC=B4=88=EA=B8=B0=ED=99=94=20=EA=B8=B0=EB=8A=A5=20=EC=B6=94?= =?UTF-8?q?=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/main.ts | 16 ++++++++++++---- 1 file changed, 12 insertions(+), 4 deletions(-) diff --git a/src/main.ts b/src/main.ts index 8491473a..0537bec6 100644 --- a/src/main.ts +++ b/src/main.ts @@ -1,5 +1,13 @@ -import MainPage from "./pages/MainPage"; +import createRouter from "./core/createRouter"; +import { routes } from "./routes"; -document.body.innerHTML = ` - ${MainPage()} -`; +document.addEventListener("DOMContentLoaded", () => { + const container = document.querySelector("#root"); + + if (!container) { + throw new Error("Couldn't find root element!"); + } + + const { init } = createRouter(container, routes); + init(); +}); From 7c5c3bd11f23768f55bf80362c2a98d4605e6a00 Mon Sep 17 00:00:00 2001 From: YeongseoYoon Date: Sun, 15 Dec 2024 00:45:33 +0900 Subject: [PATCH 06/42] =?UTF-8?q?feat:=20=EB=82=B4=EB=B9=84=EA=B2=8C?= =?UTF-8?q?=EC=9D=B4=EC=85=98=20=EB=A7=81=ED=81=AC=EC=97=90=20data-link=20?= =?UTF-8?q?=EC=86=8D=EC=84=B1=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/MainPage.ts | 6 +++--- src/pages/ProfilePage.ts | 6 +++--- src/{ => shared}/components/Footer.ts | 0 3 files changed, 6 insertions(+), 6 deletions(-) rename src/{ => shared}/components/Footer.ts (100%) diff --git a/src/pages/MainPage.ts b/src/pages/MainPage.ts index 64e286f3..359342bc 100644 --- a/src/pages/MainPage.ts +++ b/src/pages/MainPage.ts @@ -7,9 +7,9 @@ const MainPage = () => ` diff --git a/src/pages/ProfilePage.ts b/src/pages/ProfilePage.ts index 34f5cece..4f592ac8 100644 --- a/src/pages/ProfilePage.ts +++ b/src/pages/ProfilePage.ts @@ -8,9 +8,9 @@ const ProfilePage = () => ` diff --git a/src/components/Footer.ts b/src/shared/components/Footer.ts similarity index 100% rename from src/components/Footer.ts rename to src/shared/components/Footer.ts From 7b03c0ed7ba10fd081bdf8028941c6a94fa8006b Mon Sep 17 00:00:00 2001 From: YeongseoYoon Date: Sun, 15 Dec 2024 00:50:32 +0900 Subject: [PATCH 07/42] =?UTF-8?q?feat:=20=EB=A9=94=EC=9D=B8=20=ED=8E=98?= =?UTF-8?q?=EC=9D=B4=EC=A7=80=EC=99=80=20=ED=94=84=EB=A1=9C=ED=95=84=20?= =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=EC=97=90=20=ED=97=A4=EB=8D=94=20?= =?UTF-8?q?=EB=B0=8F=20=ED=91=B8=ED=84=B0=20=EC=BB=B4=ED=8F=AC=EB=84=8C?= =?UTF-8?q?=ED=8A=B8=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/MainPage.ts | 19 +++++-------------- src/pages/ProfilePage.ts | 19 +++++-------------- src/shared/components/Footer.ts | 7 +++++++ src/shared/components/Header.ts | 15 +++++++++++++++ 4 files changed, 32 insertions(+), 28 deletions(-) create mode 100644 src/shared/components/Header.ts diff --git a/src/pages/MainPage.ts b/src/pages/MainPage.ts index 359342bc..fcbc63d9 100644 --- a/src/pages/MainPage.ts +++ b/src/pages/MainPage.ts @@ -1,17 +1,10 @@ +import Footer from "../shared/components/Footer"; +import Header from "../shared/components/Header"; + const MainPage = () => `
-
-

항해플러스

-
- - + ${Header()}
@@ -103,9 +96,7 @@ const MainPage = () => `
-
-

© 2024 항해플러스. All rights reserved.

-
+ ${Footer()}
`; diff --git a/src/pages/ProfilePage.ts b/src/pages/ProfilePage.ts index 4f592ac8..105a4c78 100644 --- a/src/pages/ProfilePage.ts +++ b/src/pages/ProfilePage.ts @@ -1,18 +1,11 @@ +import Footer from "../shared/components/Footer"; +import Header from "../shared/components/Header"; + const ProfilePage = () => `
-
-

항해플러스

-
- - + ${Header()}
@@ -73,9 +66,7 @@ const ProfilePage = () => `
-
-

© 2024 항해플러스. All rights reserved.

-
+ ${Footer()}
diff --git a/src/shared/components/Footer.ts b/src/shared/components/Footer.ts index e69de29b..7aecbae3 100644 --- a/src/shared/components/Footer.ts +++ b/src/shared/components/Footer.ts @@ -0,0 +1,7 @@ +const Footer = () => ` +
+

© 2024 항해플러스. All rights reserved.

+
+`; + +export default Footer; diff --git a/src/shared/components/Header.ts b/src/shared/components/Header.ts new file mode 100644 index 00000000..e9093280 --- /dev/null +++ b/src/shared/components/Header.ts @@ -0,0 +1,15 @@ +const Header = () => ` +
+

항해플러스

+
+ + +`; + +export default Header; From d9ab53bcf4e3b80c48a09b8347bae90f741a9fbf Mon Sep 17 00:00:00 2001 From: YeongseoYoon Date: Sun, 15 Dec 2024 00:55:31 +0900 Subject: [PATCH 08/42] =?UTF-8?q?feat:=20ErrorPage=EB=A5=BC=20NotFoundPage?= =?UTF-8?q?=EB=A1=9C=20=EC=9D=B4=EB=A6=84=20=EB=B3=80=EA=B2=BD=20=EB=B0=8F?= =?UTF-8?q?=20=EB=9D=BC=EC=9A=B0=ED=8C=85=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/{ErrorPage.ts => NotFoundPage.ts} | 4 ++-- src/routes.ts | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) rename src/pages/{ErrorPage.ts => NotFoundPage.ts} (92%) diff --git a/src/pages/ErrorPage.ts b/src/pages/NotFoundPage.ts similarity index 92% rename from src/pages/ErrorPage.ts rename to src/pages/NotFoundPage.ts index 6182b3f3..a401678f 100644 --- a/src/pages/ErrorPage.ts +++ b/src/pages/NotFoundPage.ts @@ -1,4 +1,4 @@ -const ErrorPage = () => ` +const NotFoundPage = () => `

항해플러스

@@ -14,4 +14,4 @@ const ErrorPage = () => `
`; -export default ErrorPage; +export default NotFoundPage; diff --git a/src/routes.ts b/src/routes.ts index 114a336e..853f86e9 100644 --- a/src/routes.ts +++ b/src/routes.ts @@ -1,4 +1,4 @@ -import ErrorPage from "./pages/ErrorPage"; +import NotFoundPage from "./pages/NotFoundPage"; import LoginPage from "./pages/LoginPage"; import MainPage from "./pages/MainPage"; import ProfilePage from "./pages/ProfilePage"; @@ -11,5 +11,5 @@ export const routes: Routes = { "/": MainPage, "/login": LoginPage, "/profile": ProfilePage, - "*": ErrorPage, + "*": NotFoundPage, }; From 3dfb7caaf64d2a914176db2cc4e3b94dbf2fc20c Mon Sep 17 00:00:00 2001 From: YeongseoYoon Date: Sun, 15 Dec 2024 11:02:06 +0900 Subject: [PATCH 09/42] =?UTF-8?q?feat:=20=EB=A1=9C=EA=B7=B8=EC=9D=B8=20?= =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=EC=97=90=20=EB=A1=9C=EA=B7=B8?= =?UTF-8?q?=EC=9D=B8=20=EC=B2=98=EB=A6=AC=20=EA=B8=B0=EB=8A=A5=20=EC=B6=94?= =?UTF-8?q?=EA=B0=80=20=EB=B0=8F=20=EC=9D=B4=EB=B2=A4=ED=8A=B8=20=EB=A6=AC?= =?UTF-8?q?=EC=8A=A4=EB=84=88=20=EC=84=A4=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/LoginPage.ts | 33 ++++++++++++++++++++++++++++++--- 1 file changed, 30 insertions(+), 3 deletions(-) diff --git a/src/pages/LoginPage.ts b/src/pages/LoginPage.ts index 8dffeef5..cc5ca5cd 100644 --- a/src/pages/LoginPage.ts +++ b/src/pages/LoginPage.ts @@ -1,8 +1,34 @@ -const LoginPage = () => ` +import { useRouter } from "../main"; + +const setupLoginPage = () => { + const form = document.getElementById("login-form"); + if (form) { + form.addEventListener("submit", (event) => { + event.preventDefault(); + handleLogin(form); + }); + } +}; + +const handleLogin = (form: HTMLElement) => { + const router = useRouter(); + const email = (form.querySelector('input[type="text"]') as HTMLInputElement) + ?.value; + const password = ( + form.querySelector('input[type="password"]') as HTMLInputElement + )?.value; + + localStorage.setItem("user", JSON.stringify({ email, password })); + + router.navigate("/"); +}; + +const LoginPage = () => { + return /* html */ `

항해플러스

-
+
@@ -21,5 +47,6 @@ const LoginPage = () => `
`; +}; -export default LoginPage; +export { LoginPage, setupLoginPage }; From 6700a388418719f6fbb26a7c2c44bcd4d0da115c Mon Sep 17 00:00:00 2001 From: YeongseoYoon Date: Sun, 15 Dec 2024 11:02:25 +0900 Subject: [PATCH 10/42] =?UTF-8?q?feat:=20=EB=9D=BC=EC=9A=B0=ED=84=B0=20?= =?UTF-8?q?=EC=84=A4=EC=A0=95=EC=9D=84=20=EA=B0=9C=EC=84=A0=ED=95=98?= =?UTF-8?q?=EC=97=AC=20=EA=B0=81=20=EA=B2=BD=EB=A1=9C=EC=97=90=20setUp=20?= =?UTF-8?q?=EB=A9=94=EC=84=9C=EB=93=9C=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/core/createRouter.ts | 5 +++-- src/routes.ts | 27 +++++++++++++++++++++------ 2 files changed, 24 insertions(+), 8 deletions(-) diff --git a/src/core/createRouter.ts b/src/core/createRouter.ts index 4b7d31cb..77c05374 100644 --- a/src/core/createRouter.ts +++ b/src/core/createRouter.ts @@ -2,8 +2,9 @@ import { Routes } from "../routes"; const createRouter = (container: HTMLElement, routes: Routes) => { const render = (path: string) => { - const component = routes[path] || routes["*"]; - container.innerHTML = component(); + const route = routes[path] || routes["*"]; + container.innerHTML = route.component(); + route.setUp(); }; const navigate = (path: string) => { diff --git a/src/routes.ts b/src/routes.ts index 853f86e9..bf623e62 100644 --- a/src/routes.ts +++ b/src/routes.ts @@ -1,15 +1,30 @@ import NotFoundPage from "./pages/NotFoundPage"; -import LoginPage from "./pages/LoginPage"; +import { LoginPage, setupLoginPage } from "./pages/LoginPage"; import MainPage from "./pages/MainPage"; import ProfilePage from "./pages/ProfilePage"; export type Routes = { - [key: string]: () => string; + [key: string]: { + setUp: () => void; + component: () => string; + }; }; export const routes: Routes = { - "/": MainPage, - "/login": LoginPage, - "/profile": ProfilePage, - "*": NotFoundPage, + "/": { + setUp: () => {}, + component: MainPage, + }, + "/login": { + setUp: setupLoginPage, + component: LoginPage, + }, + "/profile": { + setUp: () => {}, + component: ProfilePage, + }, + "*": { + setUp: () => {}, + component: NotFoundPage, + }, }; From c24193dbf6c82f549b30c864d0f390f340dcc97b Mon Sep 17 00:00:00 2001 From: YeongseoYoon Date: Sun, 15 Dec 2024 11:03:11 +0900 Subject: [PATCH 11/42] =?UTF-8?q?feat:=20=EB=9D=BC=EC=9A=B0=ED=84=B0=20?= =?UTF-8?q?=EC=B4=88=EA=B8=B0=ED=99=94=20=EB=A1=9C=EC=A7=81=20=EA=B0=9C?= =?UTF-8?q?=EC=84=A0=20=EB=B0=8F=20useRouter=20=ED=9B=85=20=EC=B6=94?= =?UTF-8?q?=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/main.ts | 14 ++++++++++++-- 1 file changed, 12 insertions(+), 2 deletions(-) diff --git a/src/main.ts b/src/main.ts index 0537bec6..f4a5cd36 100644 --- a/src/main.ts +++ b/src/main.ts @@ -1,6 +1,8 @@ import createRouter from "./core/createRouter"; import { routes } from "./routes"; +let router: ReturnType; + document.addEventListener("DOMContentLoaded", () => { const container = document.querySelector("#root"); @@ -8,6 +10,14 @@ document.addEventListener("DOMContentLoaded", () => { throw new Error("Couldn't find root element!"); } - const { init } = createRouter(container, routes); - init(); + router = createRouter(container, routes); + router.init(); }); + +export const useRouter = () => { + if (!router) { + throw new Error("Router not initialized!"); + } + + return router; +}; From bce998c640994bc919a18e2bf695817fd8b13b0a Mon Sep 17 00:00:00 2001 From: YeongseoYoon Date: Sun, 15 Dec 2024 11:03:17 +0900 Subject: [PATCH 12/42] =?UTF-8?q?feat:=20=ED=97=A4=EB=8D=94=20=EC=BB=B4?= =?UTF-8?q?=ED=8F=AC=EB=84=8C=ED=8A=B8=EC=97=90=20=EB=A1=9C=EA=B7=B8?= =?UTF-8?q?=EC=9D=B8=20=EC=83=81=ED=83=9C=EC=97=90=20=EB=94=B0=EB=A5=B8=20?= =?UTF-8?q?=EB=84=A4=EB=B9=84=EA=B2=8C=EC=9D=B4=EC=85=98=20=EB=A7=81?= =?UTF-8?q?=ED=81=AC=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/shared/components/Header.ts | 24 ++++++++++++++++++------ 1 file changed, 18 insertions(+), 6 deletions(-) diff --git a/src/shared/components/Header.ts b/src/shared/components/Header.ts index e9093280..cfa620e9 100644 --- a/src/shared/components/Header.ts +++ b/src/shared/components/Header.ts @@ -1,15 +1,27 @@ -const Header = () => ` +const Header = () => { + const isLoggedIn = !!localStorage.getItem("user"); + + return `

항해플러스

`; +}; export default Header; From 9420991c70c0ecae28644e2fa85abd5043fc8b9d Mon Sep 17 00:00:00 2001 From: YeongseoYoon Date: Sun, 15 Dec 2024 11:22:52 +0900 Subject: [PATCH 13/42] =?UTF-8?q?feat:=20=EB=A1=9C=EA=B7=B8=EC=95=84?= =?UTF-8?q?=EC=9B=83=20=EA=B8=B0=EB=8A=A5=20=EC=B6=94=EA=B0=80=20=EB=B0=8F?= =?UTF-8?q?=20=ED=97=A4=EB=8D=94=20=EC=BB=B4=ED=8F=AC=EB=84=8C=ED=8A=B8=20?= =?UTF-8?q?=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/shared/components/Header.ts | 47 ++++++++++++++++++++++----------- 1 file changed, 32 insertions(+), 15 deletions(-) diff --git a/src/shared/components/Header.ts b/src/shared/components/Header.ts index cfa620e9..a1948c49 100644 --- a/src/shared/components/Header.ts +++ b/src/shared/components/Header.ts @@ -1,27 +1,44 @@ +import { useRouter } from "../../main"; + +const handleLogout = () => { + const router = useRouter(); + localStorage.removeItem("user"); + router.navigate("/login"); +}; + +const setupHeader = () => { + const logoutButton = document.getElementById("logout-button"); + if (logoutButton) { + logoutButton.addEventListener("click", () => { + handleLogout(); + }); + } +}; + const Header = () => { const isLoggedIn = !!localStorage.getItem("user"); - return ` + return /* html */ `

항해플러스

`; }; -export default Header; +export { Header, setupHeader }; From 06e77fee4345c7d4f3cc71fdead0c7099cd82650 Mon Sep 17 00:00:00 2001 From: YeongseoYoon Date: Sun, 15 Dec 2024 11:23:00 +0900 Subject: [PATCH 14/42] =?UTF-8?q?feat:=20=ED=97=A4=EB=8D=94=20=EC=84=A4?= =?UTF-8?q?=EC=A0=95=20=EB=A1=9C=EC=A7=81=EC=9D=84=20=EB=9D=BC=EC=9A=B0?= =?UTF-8?q?=ED=84=B0=EC=9D=98=20setUp=20=EB=A9=94=EC=84=9C=EB=93=9C?= =?UTF-8?q?=EC=97=90=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/routes.ts | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/src/routes.ts b/src/routes.ts index bf623e62..f062b7df 100644 --- a/src/routes.ts +++ b/src/routes.ts @@ -2,6 +2,7 @@ import NotFoundPage from "./pages/NotFoundPage"; import { LoginPage, setupLoginPage } from "./pages/LoginPage"; import MainPage from "./pages/MainPage"; import ProfilePage from "./pages/ProfilePage"; +import { setupHeader } from "./shared/components/Header"; export type Routes = { [key: string]: { @@ -12,7 +13,9 @@ export type Routes = { export const routes: Routes = { "/": { - setUp: () => {}, + setUp: () => { + setupHeader(); + }, component: MainPage, }, "/login": { @@ -20,7 +23,9 @@ export const routes: Routes = { component: LoginPage, }, "/profile": { - setUp: () => {}, + setUp: () => { + setupHeader(); + }, component: ProfilePage, }, "*": { From bb114102c75f5b7b1289f73db6c4c249cee4a97f Mon Sep 17 00:00:00 2001 From: YeongseoYoon Date: Sun, 15 Dec 2024 11:23:05 +0900 Subject: [PATCH 15/42] =?UTF-8?q?feat:=20=ED=97=A4=EB=8D=94=20=EC=BB=B4?= =?UTF-8?q?=ED=8F=AC=EB=84=8C=ED=8A=B8=EC=9D=98=20=EA=B0=80=EC=A0=B8?= =?UTF-8?q?=EC=98=A4=EA=B8=B0=20=EB=B0=A9=EC=8B=9D=EC=9D=84=20=EC=88=98?= =?UTF-8?q?=EC=A0=95=ED=95=98=EC=97=AC=20=EA=B5=AC=EC=A1=B0=20=EB=B6=84?= =?UTF-8?q?=ED=95=B4=20=ED=95=A0=EB=8B=B9=20=EC=82=AC=EC=9A=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/MainPage.ts | 2 +- src/pages/ProfilePage.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/pages/MainPage.ts b/src/pages/MainPage.ts index fcbc63d9..10a03cb9 100644 --- a/src/pages/MainPage.ts +++ b/src/pages/MainPage.ts @@ -1,5 +1,5 @@ import Footer from "../shared/components/Footer"; -import Header from "../shared/components/Header"; +import { Header } from "../shared/components/Header"; const MainPage = () => `
diff --git a/src/pages/ProfilePage.ts b/src/pages/ProfilePage.ts index 105a4c78..36463bcd 100644 --- a/src/pages/ProfilePage.ts +++ b/src/pages/ProfilePage.ts @@ -1,5 +1,5 @@ import Footer from "../shared/components/Footer"; -import Header from "../shared/components/Header"; +import { Header } from "../shared/components/Header"; const ProfilePage = () => `
From e4aff0dd01781005771e4616dbd31c29bcfb61bd Mon Sep 17 00:00:00 2001 From: YeongseoYoon Date: Sun, 15 Dec 2024 11:30:45 +0900 Subject: [PATCH 16/42] =?UTF-8?q?feat:=20=EB=A1=9C=EA=B7=B8=EC=9D=B8=20?= =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=EC=9D=98=20=EC=9E=85=EB=A0=A5=20?= =?UTF-8?q?=ED=95=84=EB=93=9C=EC=97=90=20=ED=95=84=EC=88=98=20=EC=86=8D?= =?UTF-8?q?=EC=84=B1=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/LoginPage.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/pages/LoginPage.ts b/src/pages/LoginPage.ts index cc5ca5cd..f0997ab1 100644 --- a/src/pages/LoginPage.ts +++ b/src/pages/LoginPage.ts @@ -30,10 +30,10 @@ const LoginPage = () => {

항해플러스

- +
- +
From dd684c2aaf8e6a83e5f327449b2c384243de4114 Mon Sep 17 00:00:00 2001 From: YeongseoYoon Date: Sun, 15 Dec 2024 19:57:13 +0900 Subject: [PATCH 17/42] =?UTF-8?q?feat:=20=ED=94=84=EB=A1=9C=ED=95=84=20?= =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=EC=97=90=20=EC=82=AC=EC=9A=A9?= =?UTF-8?q?=EC=9E=90=20=EB=8D=B0=EC=9D=B4=ED=84=B0=20=EC=B2=98=EB=A6=AC=20?= =?UTF-8?q?=EB=A1=9C=EC=A7=81=20=EC=B6=94=EA=B0=80=20=EB=B0=8F=20=ED=8F=BC?= =?UTF-8?q?=20=EC=A0=9C=EC=B6=9C=20=EC=9D=B4=EB=B2=A4=ED=8A=B8=20=ED=95=B8?= =?UTF-8?q?=EB=93=A4=EB=A7=81=20=EA=B5=AC=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/ProfilePage.ts | 43 +++++++++++++++++++++++++++++++--------- src/routes.ts | 3 ++- 2 files changed, 36 insertions(+), 10 deletions(-) diff --git a/src/pages/ProfilePage.ts b/src/pages/ProfilePage.ts index 36463bcd..b4d544c2 100644 --- a/src/pages/ProfilePage.ts +++ b/src/pages/ProfilePage.ts @@ -1,7 +1,35 @@ import Footer from "../shared/components/Footer"; import { Header } from "../shared/components/Header"; -const ProfilePage = () => ` +const setUpProfilePage = () => { + const form = document.getElementById("profile-form") as HTMLFormElement; + if (form) { + form.addEventListener("submit", (event) => { + event.preventDefault(); + handleProfile(form); + }); + } +}; + +const handleProfile = (form: HTMLFormElement) => { + const formData = new FormData(form); + const userData = { + username: formData.get("username"), + email: formData.get("email"), + bio: formData.get("bio"), + }; + + const originUser = JSON.parse(localStorage.getItem("user") || "{}"); + localStorage.setItem( + "user", + JSON.stringify({ + ...originUser, + ...userData, + }), + ); +}; + +const ProfilePage = () => /* html */ `
@@ -12,13 +40,12 @@ const ProfilePage = () => `

내 프로필

-
+
+ >사용자 이름 ` + >이메일 ` + >자기소개 + >${user.bio || ""}
`; - +}; export { ProfilePage, setUpProfilePage }; From 41fb7f28d5264426b7dc719631d8fe248f97dca2 Mon Sep 17 00:00:00 2001 From: YeongseoYoon Date: Sun, 15 Dec 2024 20:12:46 +0900 Subject: [PATCH 19/42] =?UTF-8?q?feat:=20=EB=9D=BC=EC=9A=B0=ED=84=B0?= =?UTF-8?q?=EC=97=90=20=EC=9D=B8=EC=A6=9D=20=EC=B2=B4=ED=81=AC=20=EB=A1=9C?= =?UTF-8?q?=EC=A7=81=20=EC=B6=94=EA=B0=80=20=EB=B0=8F=20=EB=B3=B4=ED=98=B8?= =?UTF-8?q?=EB=90=9C=20=EA=B2=BD=EB=A1=9C=20=EC=84=A4=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/core/createRouter.ts | 24 +++++++++++++++++------- src/routes.ts | 5 +++++ 2 files changed, 22 insertions(+), 7 deletions(-) diff --git a/src/core/createRouter.ts b/src/core/createRouter.ts index 77c05374..fba5f6a3 100644 --- a/src/core/createRouter.ts +++ b/src/core/createRouter.ts @@ -1,15 +1,25 @@ import { Routes } from "../routes"; const createRouter = (container: HTMLElement, routes: Routes) => { - const render = (path: string) => { - const route = routes[path] || routes["*"]; + const checkAuth = (pathname: string) => { + const route = routes[pathname]; + if (route?.isProtectedRoute && !localStorage.getItem("user")) { + navigate("/login"); + return "/login"; + } + return pathname; + }; + + const render = (pathname: string) => { + const checkedPath = checkAuth(pathname); + const route = routes[checkedPath] || routes["*"]; container.innerHTML = route.component(); route.setUp(); }; - const navigate = (path: string) => { - window.history.pushState({}, "", path); - render(path); + const navigate = (pathname: string) => { + window.history.pushState({}, "", pathname); + render(pathname); }; const init = () => { @@ -24,8 +34,8 @@ const createRouter = (container: HTMLElement, routes: Routes) => { if (target.matches("[data-link]")) { e.preventDefault(); - const path = target.getAttribute("href") || "/"; - navigate(path); + const pathname = target.getAttribute("href") || "/"; + navigate(pathname); } }); }; diff --git a/src/routes.ts b/src/routes.ts index b864a82c..dbd353b4 100644 --- a/src/routes.ts +++ b/src/routes.ts @@ -8,6 +8,7 @@ export type Routes = { [key: string]: { setUp: () => void; component: () => string; + isProtectedRoute?: boolean; }; }; @@ -17,10 +18,12 @@ export const routes: Routes = { setupHeader(); }, component: MainPage, + isProtectedRoute: false, }, "/login": { setUp: setupLoginPage, component: LoginPage, + isProtectedRoute: false, }, "/profile": { setUp: () => { @@ -28,9 +31,11 @@ export const routes: Routes = { setUpProfilePage(); }, component: ProfilePage, + isProtectedRoute: true, }, "*": { setUp: () => {}, component: NotFoundPage, + isProtectedRoute: false, }, }; From 8787f1bccc5a029a178f6e3d536bd56eaa0f89e8 Mon Sep 17 00:00:00 2001 From: YeongseoYoon Date: Sun, 15 Dec 2024 20:58:14 +0900 Subject: [PATCH 20/42] =?UTF-8?q?feat:=20=EB=A1=9C=EA=B7=B8=EC=9D=B8=20?= =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=EC=97=90=EC=84=9C=20=EC=9D=B8?= =?UTF-8?q?=EC=A6=9D=EB=90=9C=20=EC=82=AC=EC=9A=A9=EC=9E=90=EC=9D=98=20?= =?UTF-8?q?=EB=A6=AC=EB=8B=A4=EC=9D=B4=EB=A0=89=EC=85=98=20=EB=A1=9C?= =?UTF-8?q?=EC=A7=81=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/core/createRouter.ts | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/core/createRouter.ts b/src/core/createRouter.ts index fba5f6a3..11b95cda 100644 --- a/src/core/createRouter.ts +++ b/src/core/createRouter.ts @@ -7,6 +7,10 @@ const createRouter = (container: HTMLElement, routes: Routes) => { navigate("/login"); return "/login"; } + if (pathname === "/login" && !!localStorage.getItem("user")) { + navigate("/"); + return "/"; + } return pathname; }; From f11879df665f9d89f2571543df3a6821ccec3e04 Mon Sep 17 00:00:00 2001 From: YeongseoYoon Date: Sun, 15 Dec 2024 21:34:11 +0900 Subject: [PATCH 21/42] =?UTF-8?q?feat:=20=EB=A1=9C=EA=B7=B8=EC=9D=B8=20?= =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=EC=97=90=EC=84=9C=20=ED=8F=BC=20?= =?UTF-8?q?=EB=8D=B0=EC=9D=B4=ED=84=B0=20=EC=B2=98=EB=A6=AC=20=EB=A1=9C?= =?UTF-8?q?=EC=A7=81=20=EA=B0=9C=EC=84=A0=20=EB=B0=8F=20HTMLFormElement=20?= =?UTF-8?q?=ED=83=80=EC=9E=85=20=EC=A7=80=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/LoginPage.ts | 22 ++++++++++++---------- 1 file changed, 12 insertions(+), 10 deletions(-) diff --git a/src/pages/LoginPage.ts b/src/pages/LoginPage.ts index f0997ab1..fb4566b2 100644 --- a/src/pages/LoginPage.ts +++ b/src/pages/LoginPage.ts @@ -1,7 +1,7 @@ import { useRouter } from "../main"; const setupLoginPage = () => { - const form = document.getElementById("login-form"); + const form = document.getElementById("login-form") as HTMLFormElement; if (form) { form.addEventListener("submit", (event) => { event.preventDefault(); @@ -10,15 +10,17 @@ const setupLoginPage = () => { } }; -const handleLogin = (form: HTMLElement) => { +const handleLogin = (form: HTMLFormElement) => { const router = useRouter(); - const email = (form.querySelector('input[type="text"]') as HTMLInputElement) - ?.value; - const password = ( - form.querySelector('input[type="password"]') as HTMLInputElement - )?.value; - localStorage.setItem("user", JSON.stringify({ email, password })); + const formData = new FormData(form); + + const loginData = { + email: formData.get("email"), + password: formData.get("password"), + }; + + localStorage.setItem("user", JSON.stringify(loginData)); router.navigate("/"); }; @@ -30,10 +32,10 @@ const LoginPage = () => {

항해플러스

- +
- +
From b7205d9fac3c8457cf5c803f0530e4ea6e7e43f5 Mon Sep 17 00:00:00 2001 From: YeongseoYoon Date: Sun, 15 Dec 2024 21:37:41 +0900 Subject: [PATCH 22/42] =?UTF-8?q?feat:=20=ED=97=A4=EB=8D=94=20=EC=BB=B4?= =?UTF-8?q?=ED=8F=AC=EB=84=8C=ED=8A=B8=EC=97=90=EC=84=9C=20=EB=82=B4?= =?UTF-8?q?=EB=B9=84=EA=B2=8C=EC=9D=B4=EC=85=98=20=EB=A7=81=ED=81=AC?= =?UTF-8?q?=EC=9D=98=20=ED=99=9C=EC=84=B1=ED=99=94=20=EC=83=81=ED=83=9C?= =?UTF-8?q?=EC=97=90=20=EB=94=B0=EB=A5=B8=20=EC=83=89=EC=83=81=20=EB=B3=80?= =?UTF-8?q?=EA=B2=BD=20=EB=A1=9C=EC=A7=81=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/shared/components/Header.ts | 31 ++++++++++++++++++------------- 1 file changed, 18 insertions(+), 13 deletions(-) diff --git a/src/shared/components/Header.ts b/src/shared/components/Header.ts index a1948c49..c7b48353 100644 --- a/src/shared/components/Header.ts +++ b/src/shared/components/Header.ts @@ -17,6 +17,11 @@ const setupHeader = () => { const Header = () => { const isLoggedIn = !!localStorage.getItem("user"); + const activeColor = "text-blue-600"; + const deactiveColor = "text-gray-600"; + const getNavColor = (path: string) => { + return window.location.pathname === path ? activeColor : deactiveColor; + }; return /* html */ `
@@ -24,19 +29,19 @@ const Header = () => {
`; }; From 90af70bea882f39f344cab288e533120f915622d Mon Sep 17 00:00:00 2001 From: YeongseoYoon Date: Sun, 15 Dec 2024 21:49:12 +0900 Subject: [PATCH 23/42] =?UTF-8?q?refactor:=20=EC=9D=B4=EB=B2=A4=ED=8A=B8?= =?UTF-8?q?=20=EC=9C=84=EC=9E=84=20=EB=B0=A9=EC=8B=9D=EC=9C=BC=EB=A1=9C=20?= =?UTF-8?q?=EB=9D=BC=EC=9A=B0=ED=8C=85=20=EB=B0=A9=EC=8B=9D=20=EC=88=98?= =?UTF-8?q?=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/core/createRouter.ts | 16 +++++++++++++--- src/pages/MainPage.ts | 2 +- src/pages/ProfilePage.ts | 2 +- src/routes.ts | 7 +------ src/shared/components/Header.ts | 21 ++------------------- 5 files changed, 18 insertions(+), 30 deletions(-) diff --git a/src/core/createRouter.ts b/src/core/createRouter.ts index 11b95cda..021172f5 100644 --- a/src/core/createRouter.ts +++ b/src/core/createRouter.ts @@ -18,7 +18,7 @@ const createRouter = (container: HTMLElement, routes: Routes) => { const checkedPath = checkAuth(pathname); const route = routes[checkedPath] || routes["*"]; container.innerHTML = route.component(); - route.setUp(); + route.setUp && route.setUp(); }; const navigate = (pathname: string) => { @@ -36,10 +36,20 @@ const createRouter = (container: HTMLElement, routes: Routes) => { document.addEventListener("click", (e) => { const target = e.target as HTMLElement; - if (target.matches("[data-link]")) { + const linkElement = target.closest("[data-link]"); + if (linkElement instanceof HTMLElement) { e.preventDefault(); - const pathname = target.getAttribute("href") || "/"; + const pathname = linkElement.getAttribute("href") || "/"; navigate(pathname); + return; + } + + const logoutButton = target.closest('[data-action="logout"]'); + if (logoutButton) { + e.preventDefault(); + localStorage.removeItem("user"); + navigate("/login"); + return; } }); }; diff --git a/src/pages/MainPage.ts b/src/pages/MainPage.ts index 10a03cb9..fcbc63d9 100644 --- a/src/pages/MainPage.ts +++ b/src/pages/MainPage.ts @@ -1,5 +1,5 @@ import Footer from "../shared/components/Footer"; -import { Header } from "../shared/components/Header"; +import Header from "../shared/components/Header"; const MainPage = () => `
diff --git a/src/pages/ProfilePage.ts b/src/pages/ProfilePage.ts index 3bd788f9..74ac9cac 100644 --- a/src/pages/ProfilePage.ts +++ b/src/pages/ProfilePage.ts @@ -1,5 +1,5 @@ import Footer from "../shared/components/Footer"; -import { Header } from "../shared/components/Header"; +import Header from "../shared/components/Header"; const setUpProfilePage = () => { const form = document.getElementById("profile-form") as HTMLFormElement; diff --git a/src/routes.ts b/src/routes.ts index dbd353b4..c415ca64 100644 --- a/src/routes.ts +++ b/src/routes.ts @@ -2,11 +2,10 @@ import NotFoundPage from "./pages/NotFoundPage"; import { LoginPage, setupLoginPage } from "./pages/LoginPage"; import MainPage from "./pages/MainPage"; import { ProfilePage, setUpProfilePage } from "./pages/ProfilePage"; -import { setupHeader } from "./shared/components/Header"; export type Routes = { [key: string]: { - setUp: () => void; + setUp?: () => void; component: () => string; isProtectedRoute?: boolean; }; @@ -14,9 +13,6 @@ export type Routes = { export const routes: Routes = { "/": { - setUp: () => { - setupHeader(); - }, component: MainPage, isProtectedRoute: false, }, @@ -27,7 +23,6 @@ export const routes: Routes = { }, "/profile": { setUp: () => { - setupHeader(); setUpProfilePage(); }, component: ProfilePage, diff --git a/src/shared/components/Header.ts b/src/shared/components/Header.ts index c7b48353..910f2b4d 100644 --- a/src/shared/components/Header.ts +++ b/src/shared/components/Header.ts @@ -1,20 +1,3 @@ -import { useRouter } from "../../main"; - -const handleLogout = () => { - const router = useRouter(); - localStorage.removeItem("user"); - router.navigate("/login"); -}; - -const setupHeader = () => { - const logoutButton = document.getElementById("logout-button"); - if (logoutButton) { - logoutButton.addEventListener("click", () => { - handleLogout(); - }); - } -}; - const Header = () => { const isLoggedIn = !!localStorage.getItem("user"); const activeColor = "text-blue-600"; @@ -35,7 +18,7 @@ const Header = () => { isLoggedIn ? `
  • 프로필
    • -
  • 로그아웃
    • +
  • 로그아웃
    • ` : `
  • 로그인
    • @@ -46,4 +29,4 @@ const Header = () => { `; }; -export { Header, setupHeader }; +export default Header; From aa8cd461309c48490b3eb1a282bf0d99390c7fce Mon Sep 17 00:00:00 2001 From: YeongseoYoon Date: Sun, 15 Dec 2024 22:23:59 +0900 Subject: [PATCH 24/42] =?UTF-8?q?fix:=20=EB=A1=9C=EA=B7=B8=EC=9D=B8=20?= =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=EC=97=90=EC=84=9C=20=EC=9D=B4?= =?UTF-8?q?=EB=A9=94=EC=9D=BC=20=ED=95=84=EB=93=9C=EB=A5=BC=20=EC=82=AC?= =?UTF-8?q?=EC=9A=A9=EC=9E=90=20=EC=9D=B4=EB=A6=84=EC=9C=BC=EB=A1=9C=20?= =?UTF-8?q?=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/LoginPage.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/pages/LoginPage.ts b/src/pages/LoginPage.ts index fb4566b2..4e89f0a6 100644 --- a/src/pages/LoginPage.ts +++ b/src/pages/LoginPage.ts @@ -16,7 +16,7 @@ const handleLogin = (form: HTMLFormElement) => { const formData = new FormData(form); const loginData = { - email: formData.get("email"), + username: formData.get("username"), password: formData.get("password"), }; @@ -32,7 +32,7 @@ const LoginPage = () => {

    항해플러스

    - +
    From 53ed3fb77cb0ba5713f76b4e37b459e92daec0fc Mon Sep 17 00:00:00 2001 From: YeongseoYoon Date: Sun, 15 Dec 2024 22:24:50 +0900 Subject: [PATCH 25/42] =?UTF-8?q?fix:=20role=3D"navigation"=20=EC=B6=94?= =?UTF-8?q?=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/shared/components/Header.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/shared/components/Header.ts b/src/shared/components/Header.ts index 910f2b4d..34c7a5df 100644 --- a/src/shared/components/Header.ts +++ b/src/shared/components/Header.ts @@ -11,14 +11,14 @@ const Header = () => {

    항해플러스

    -