From 74b1992a5a38565cea41fd8fd5de237c678b4de8 Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Sun, 13 Dec 2020 12:02:25 +0900 Subject: [PATCH 01/52] =?UTF-8?q?=EC=97=AD=20=EA=B4=80=EB=A6=AC=20?= =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=20=EA=B8=B0=EB=8A=A5=20=EB=AA=A9?= =?UTF-8?q?=EB=A1=9D=20=EC=9E=91=EC=84=B1?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- README.md | 37 ++++++++++++++++++++++++++++++++++--- 1 file changed, 34 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index e97a1d649..56f3bdf3b 100644 --- a/README.md +++ b/README.md @@ -2,21 +2,41 @@ ## πŸš€ κΈ°λŠ₯ μš”κ΅¬μ‚¬ν•­ +### 1. μ—­ 관리 νŽ˜μ΄μ§€ + +#### 1) μ—­μ˜ 이름 μœ νš¨μ„± 검사 + +- μ€‘λ³΅λœ μ—­ 이름 κΈˆμ§€ +- μ—­ 이름 2κΈ€μž 이상 +- μ—­ 이름 곡백 κΈˆμ§€ +- μ—­ 이름 ν•œκΈ€λ§Œ κ°€λŠ₯ +- μ—­μ˜ 이름 μ˜¬λ°”λ₯΄μ§€ μ•Šμ„ μ‹œ alert λ©”μ‹œμ§€ 좜λ ₯ + +#### 2) μ§€ν•˜μ²  μ—­ λͺ©λ‘ 관리 + +- μ§€ν•˜μ²  μ—­ λ“±λ‘ν•˜κΈ° +- μ§€ν•˜μ²  μ—­ μ‚­μ œν•˜κΈ° + +## πŸš€ κΈ°λŠ₯ μš”κ΅¬μ‚¬ν•­ + ### μ§€ν•˜μ²  μ—­ κ΄€λ ¨ κΈ°λŠ₯ + - μ§€ν•˜μ²  역을 λ“±λ‘ν•˜κ³  μ‚­μ œν•  수 μžˆλ‹€. (단, 노선에 λ“±λ‘λœ 역은 μ‚­μ œν•  수 μ—†λ‹€) - μ€‘λ³΅λœ μ§€ν•˜μ²  μ—­ 이름이 등둝될 수 μ—†λ‹€. - μ§€ν•˜μ²  역은 2κΈ€μž 이상이어야 ν•œλ‹€. - μ§€ν•˜μ²  μ—­μ˜ λͺ©λ‘μ„ μ‘°νšŒν•  수 μžˆλ‹€. ### μ§€ν•˜μ²  λ…Έμ„  κ΄€λ ¨ κΈ°λŠ₯ + - μ§€ν•˜μ²  노선을 λ“±λ‘ν•˜κ³  μ‚­μ œν•  수 μžˆλ‹€. - μ€‘λ³΅λœ μ§€ν•˜μ²  λ…Έμ„  이름이 등둝될 수 μ—†λ‹€. - λ…Έμ„  등둝 μ‹œ 상행 쒅점역과 ν•˜ν–‰ 쒅점역을 μž…λ ₯λ°›λŠ”λ‹€. - μ§€ν•˜μ²  λ…Έμ„ μ˜ λͺ©λ‘μ„ μ‘°νšŒν•  수 μžˆλ‹€. ### μ§€ν•˜μ²  ꡬ간 μΆ”κ°€ κΈ°λŠ₯ + - μ§€ν•˜μ²  노선에 ꡬ간을 μΆ”κ°€ν•˜λŠ” κΈ°λŠ₯은 노선에 역을 μΆ”κ°€ν•˜λŠ” κΈ°λŠ₯이라고도 ν•  수 μžˆλ‹€. - - μ—­κ³Ό 역사이λ₯Ό ꡬ간이라 ν•˜κ³  이 κ΅¬κ°„λ“€μ˜ λͺ¨μŒμ΄ 노선이닀. + - μ—­κ³Ό 역사이λ₯Ό ꡬ간이라 ν•˜κ³  이 κ΅¬κ°„λ“€μ˜ λͺ¨μŒμ΄ 노선이닀. - ν•˜λ‚˜μ˜ 역은 μ—¬λŸ¬κ°œμ˜ 노선에 좔가될 수 μžˆλ‹€. - μ—­κ³Ό μ—­ 사이에 μƒˆλ‘œμš΄ 역이 μΆ”κ°€ 될 수 μžˆλ‹€. - λ…Έμ„ μ—μ„œ κ°ˆλž˜κΈΈμ€ 생길 수 μ—†λ‹€. @@ -24,6 +44,7 @@ ### μ§€ν•˜μ²  ꡬ간 μ‚­μ œ κΈ°λŠ₯ + - 노선에 λ“±λ‘λœ 역을 μ œκ±°ν•  수 μžˆλ‹€. - 쒅점을 μ œκ±°ν•  경우 λ‹€μŒ 역이 쒅점이 λœλ‹€. - 노선에 ν¬ν•¨λœ 역이 λ‘κ°œ μ΄ν•˜μΌ λ•ŒλŠ” 역을 μ œκ±°ν•  수 μ—†λ‹€. @@ -31,6 +52,7 @@ ### μ§€ν•˜μ²  노선에 λ“±λ‘λœ μ—­ 쑰회 κΈ°λŠ₯ + - λ…Έμ„ μ˜ 상행 쒅점뢀터 ν•˜ν–‰ μ’…μ κΉŒμ§€ μ—°κ²°λœ μˆœμ„œλŒ€λ‘œ μ—­ λͺ©λ‘μ„ μ‘°νšŒν•  수 μžˆλ‹€.
@@ -38,32 +60,38 @@ ## πŸ’» ν”„λ‘œκ·Έλž¨ μ‹€ν–‰ κ²°κ³Ό ### 역관리 + ### 노선관리 + ### ꡬ간관리 + ### 노선도 좜λ ₯ - + ## βœ… ν”„λ‘œκ·Έλž˜λ° μš”κ΅¬μ‚¬ν•­ ### 메뉴 λ²„νŠΌ + - μ—­ 관리 button νƒœκ·ΈλŠ” `#station-manager-button` id값을 κ°€μ§„λ‹€. - λ…Έμ„  관리 button νƒœκ·ΈλŠ” `#line-manager-button` id값을 κ°€μ§„λ‹€. - ꡬ간 관리 button νƒœκ·ΈλŠ” `#section-manager-button` id값을 κ°€μ§„λ‹€. - μ§€ν•˜μ²  노선도 좜λ ₯ 관리 button νƒœκ·ΈλŠ” `#map-print-manager-button` id값을 κ°€μ§„λ‹€. ### μ§€ν•˜μ²  μ—­ κ΄€λ ¨ κΈ°λŠ₯ + - μ§€ν•˜μ²  역을 μž…λ ₯ν•˜λŠ” input νƒœκ·ΈλŠ” `#station-name-input` id값을 κ°€μ§„λ‹€. - μ§€ν•˜μ²  역을 μΆ”κ°€ν•˜λŠ” button νƒœκ·ΈλŠ” `#station-add-button` id값을 κ°€μ§„λ‹€. - μ§€ν•˜μ²  역을 μ‚­μ œν•˜λŠ” button νƒœκ·ΈλŠ” `.station-delete-button` class값을 κ°€μ§„λ‹€. ### μ§€ν•˜μ²  λ…Έμ„  κ΄€λ ¨ κΈ°λŠ₯ + - μ§€ν•˜μ²  λ…Έμ„ μ˜ 이름을 μž…λ ₯ν•˜λŠ” input νƒœκ·ΈλŠ” `#line-name-input` id값을 κ°€μ§„λ‹€. - μ§€ν•˜μ²  λ…Έμ„ μ˜ 상행 쒅점을 μ„ νƒν•˜λŠ” select νƒœκ·ΈλŠ” `#line-start-station-selector` id값을 κ°€μ§„λ‹€. - μ§€ν•˜μ²  λ…Έμ„ μ˜ ν•˜ν–‰ 쒅점을 μ„ νƒν•˜λŠ” select νƒœκ·ΈλŠ” `#line-end-station-selector` id값을 κ°€μ§„λ‹€. @@ -71,6 +99,7 @@ - μ§€ν•˜μ²  노선을 μ‚­μ œν•˜λŠ” button νƒœκ·ΈλŠ” `.line-delete-button` class값을 κ°€μ§„λ‹€. ### μ§€ν•˜μ²  ꡬ간 μΆ”κ°€ κΈ°λŠ₯ + - μ§€ν•˜μ²  노선을 μ„ νƒν•˜λŠ” button νƒœκ·ΈλŠ” `.section-line-menu-button` class값을 κ°€μ§„λ‹€. - μ§€ν•˜μ²  ꡬ간을 μ„€μ •ν•  μ—­ select νƒœκ·ΈλŠ” `#section-station-selector` id값을 κ°€μ§„λ‹€. - μ§€ν•˜μ²  κ΅¬κ°„μ˜ μˆœμ„œλ₯Ό μž…λ ₯ν•˜λŠ” input νƒœκ·ΈλŠ” `#section-order-input` id값을 κ°€μ§„λ‹€. @@ -78,6 +107,7 @@ - μ§€ν•˜μ²  ꡬ간을 μ œκ±°ν•˜λŠ” button νƒœκ·ΈλŠ” `.section-delete-button` class값을 κ°€μ§„λ‹€. ### μ§€ν•˜μ²  노선도 좜λ ₯ κΈ°λŠ₯ + - μ§€ν•˜μ²  노선도 좜λ ₯ λ²„νŠΌμ„ λˆ„λ₯΄λ©΄ `
` νƒœκ·Έλ₯Ό λ§Œλ“€κ³  ν•΄λ‹Ή νƒœκ·Έ 내뢀에 노선도λ₯Ό 좜λ ₯ν•œλ‹€. ### κΈ°μ‘΄ μš”κ΅¬μ‚¬ν•­ @@ -101,7 +131,8 @@ - [https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Template_literals](https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Template_literals) ### μΆ”κ°€λœ μš”κ΅¬μ‚¬ν•­ -- [data](https://developer.mozilla.org/ko/docs/Learn/HTML/Howto/%EB%8D%B0%EC%9D%B4%ED%84%B0_%EC%86%8D%EC%84%B1_%EC%82%AC%EC%9A%A9%ED%95%98%EA%B8%B0)속성을 ν™œμš©ν•˜μ—¬ html νƒœκ·Έμ— μ—­, λ…Έμ„ , κ΅¬κ°„μ˜ μœ μΌν•œ 데이터 값듀을 κ΄€λ¦¬ν•œλ‹€. + +- [data](https://developer.mozilla.org/ko/docs/Learn/HTML/Howto/%EB%8D%B0%EC%9D%B4%ED%84%B0_%EC%86%8D%EC%84%B1_%EC%82%AC%EC%9A%A9%ED%95%98%EA%B8%B0)속성을 ν™œμš©ν•˜μ—¬ html νƒœκ·Έμ— μ—­, λ…Έμ„ , κ΅¬κ°„μ˜ μœ μΌν•œ 데이터 값듀을 κ΄€λ¦¬ν•œλ‹€. - [localStorage](https://developer.mozilla.org/ko/docs/Web/API/Window/localStorage)λ₯Ό μ΄μš©ν•˜μ—¬, μƒˆλ‘œκ³ μΉ¨ν•˜λ”λΌλ„ κ°€μž₯ μ΅œκ·Όμ— μž‘μ—…ν•œ 정보듀을 뢈러올 수 μžˆλ„λ‘ ν•œλ‹€.
From df574b94032eda83f53b1e39a19a4b45281d5ace Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Sun, 13 Dec 2020 12:24:37 +0900 Subject: [PATCH 02/52] =?UTF-8?q?html=20=EC=B4=88=EA=B8=B0=20=ED=99=94?= =?UTF-8?q?=EB=A9=B4=20=EC=85=8B=ED=8C=85?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- index.html | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/index.html b/index.html index fc99deac2..c29fe99e1 100644 --- a/index.html +++ b/index.html @@ -5,8 +5,14 @@ μ§€ν•˜μ²  노선도 관리 +
+

πŸš‡ μ§€ν•˜μ²  노선도 관리

+ + + + +
-

πŸš‡ μ§€ν•˜μ²  노선도 관리

From 7dce6cbef9a57ea0a7a7413c31781cffa4cf7c65 Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Sun, 13 Dec 2020 13:15:06 +0900 Subject: [PATCH 03/52] =?UTF-8?q?style:=20=ED=91=9C=20=EC=8A=A4=ED=83=80?= =?UTF-8?q?=EC=9D=BC=20=EC=9E=91=EC=84=B1?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- index.html | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/index.html b/index.html index c29fe99e1..390b3420f 100644 --- a/index.html +++ b/index.html @@ -3,6 +3,19 @@ μ§€ν•˜μ²  노선도 관리 +
From 21eb36a1c1107d450bf41c43dce56a8f099d5058 Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Sun, 13 Dec 2020 13:25:09 +0900 Subject: [PATCH 04/52] =?UTF-8?q?feat:=20=EC=97=AD=20=EA=B4=80=EB=A6=AC=20?= =?UTF-8?q?=EB=B2=84=ED=8A=BC=20=ED=81=B4=EB=A6=AD=20=EC=8B=9C=20=ED=99=94?= =?UTF-8?q?=EB=A9=B4=20=EC=97=B0=EA=B2=B0=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/index.js | 24 ++++++++++++++++++++++ src/pages/StationManager.js | 40 +++++++++++++++++++++++++++++++++++++ 2 files changed, 64 insertions(+) create mode 100644 src/pages/StationManager.js diff --git a/src/index.js b/src/index.js index e69de29bb..0dd4f28e4 100644 --- a/src/index.js +++ b/src/index.js @@ -0,0 +1,24 @@ +import StationManager from "./pages/StationManager.js"; + +const RE_RENDER_EVENT = "customRender"; +const reRenderEvent = new CustomEvent(RE_RENDER_EVENT); +const dispatchReRender = () => window.dispatchEvent(reRenderEvent); + +const stationManager = new StationManager(); + +const pages = document.querySelector("#app"); + +const stationManagerButton = document.getElementById("station-manager-button"); + +let page; + +stationManagerButton.addEventListener("click", () => { + page = stationManager; + dispatchReRender(); +}); + +function reRenderPage() { + pages.innerHTML = page.render(); +} + +window.addEventListener(RE_RENDER_EVENT, reRenderPage); diff --git a/src/pages/StationManager.js b/src/pages/StationManager.js new file mode 100644 index 000000000..bcc8d3170 --- /dev/null +++ b/src/pages/StationManager.js @@ -0,0 +1,40 @@ +const elementMap = { + stationNameInnput: "station-name-input", + stationAddButton: "station-add-button", + stationDeleteButton: "station-delete-button", +}; + +export default class StationManager { + constructor() { + this.state = {}; + } + + setState() {} + + mount() {} + + render() { + return ` +
+

μ—­ 이름

+
+ + +
+
+

πŸš‰ μ§€ν•˜μ²  μ—­ λͺ©λ‘

+ + + + + + + + + +
μ—­ 이름섀정
+
+
+ `; + } +} From 4dca739207e6b3ad489ce564fa84afc44a04f7df Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Sun, 13 Dec 2020 13:35:44 +0900 Subject: [PATCH 05/52] =?UTF-8?q?feat:=20=EC=97=AD=20=EC=B6=94=EA=B0=80=20?= =?UTF-8?q?=EB=B2=84=ED=8A=BC=20=ED=81=B4=EB=A6=AD=20=EC=8B=9C=20=EC=97=AD?= =?UTF-8?q?=20=EC=B6=94=EA=B0=80=20=EA=B8=B0=EB=8A=A5=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/index.js | 1 + src/pages/StationManager.js | 25 +++++++++++++++++++++---- 2 files changed, 22 insertions(+), 4 deletions(-) diff --git a/src/index.js b/src/index.js index 0dd4f28e4..afe749b25 100644 --- a/src/index.js +++ b/src/index.js @@ -19,6 +19,7 @@ stationManagerButton.addEventListener("click", () => { function reRenderPage() { pages.innerHTML = page.render(); + page.mount(); } window.addEventListener(RE_RENDER_EVENT, reRenderPage); diff --git a/src/pages/StationManager.js b/src/pages/StationManager.js index bcc8d3170..e32862875 100644 --- a/src/pages/StationManager.js +++ b/src/pages/StationManager.js @@ -1,24 +1,41 @@ const elementMap = { - stationNameInnput: "station-name-input", + stationNameInput: "station-name-input", stationAddButton: "station-add-button", stationDeleteButton: "station-delete-button", }; export default class StationManager { constructor() { - this.state = {}; + this.state = { + stations: [], + }; + + this.handleAddButtonClick = (newStation) => { + this.state.stations.push(newStation); + }; } setState() {} - mount() {} + mount() { + const stationNameInput = document.getElementById( + elementMap.stationNameInput + ); + const stationAddButton = document.getElementById( + elementMap.stationAddButton + ); + stationAddButton.addEventListener("click", () => { + this.handleAddButtonClick(stationNameInput.value); + console.log(this.state.stations); + }); + } render() { return `

μ—­ 이름

- +
From 2ad6de0cf95f11e992abe9e4db9659b7da9c5a46 Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Sun, 13 Dec 2020 13:43:38 +0900 Subject: [PATCH 06/52] =?UTF-8?q?feat:=20=EC=97=AD=20=EC=B6=94=EA=B0=80=20?= =?UTF-8?q?=EC=8B=9C=20=ED=99=94=EB=A9=B4=EC=97=90=20=EA=B7=B8=EB=A6=AC?= =?UTF-8?q?=EB=8A=94=20=EA=B8=B0=EB=8A=A5=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/index.js | 1 + src/pages/StationManager.js | 25 +++++++++++++++++++++++-- 2 files changed, 24 insertions(+), 2 deletions(-) diff --git a/src/index.js b/src/index.js index afe749b25..116bdc4f7 100644 --- a/src/index.js +++ b/src/index.js @@ -3,6 +3,7 @@ import StationManager from "./pages/StationManager.js"; const RE_RENDER_EVENT = "customRender"; const reRenderEvent = new CustomEvent(RE_RENDER_EVENT); const dispatchReRender = () => window.dispatchEvent(reRenderEvent); +export { dispatchReRender }; const stationManager = new StationManager(); diff --git a/src/pages/StationManager.js b/src/pages/StationManager.js index e32862875..8aeac249b 100644 --- a/src/pages/StationManager.js +++ b/src/pages/StationManager.js @@ -1,3 +1,5 @@ +import { dispatchReRender } from "../index.js"; + const elementMap = { stationNameInput: "station-name-input", stationAddButton: "station-add-button", @@ -12,10 +14,14 @@ export default class StationManager { this.handleAddButtonClick = (newStation) => { this.state.stations.push(newStation); + this.setState({ stations: [...this.state.stations] }); }; } - setState() {} + setState(state) { + this.state = state; + dispatchReRender(); + } mount() { const stationNameInput = document.getElementById( @@ -31,11 +37,14 @@ export default class StationManager { } render() { + const stations = this.state.stations; return `

μ—­ 이름

- +
@@ -48,6 +57,18 @@ export default class StationManager { + ${stations + .map( + (station) => + ` + ${station} + + + + + ` + ) + .join("")}
From 5878b4f50a45be39b0a0dc2997aae1fc9ab9f899 Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Sun, 13 Dec 2020 13:57:25 +0900 Subject: [PATCH 07/52] =?UTF-8?q?feat:=20=EC=82=AD=EC=A0=9C=20=EB=B2=84?= =?UTF-8?q?=ED=8A=BC=20=ED=81=B4=EB=A6=AD=20=EC=8B=9C=20=EC=97=AD=20?= =?UTF-8?q?=EC=82=AD=EC=A0=9C=20=EA=B8=B0=EB=8A=A5=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/StationManager.js | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/src/pages/StationManager.js b/src/pages/StationManager.js index 8aeac249b..4a23ae36f 100644 --- a/src/pages/StationManager.js +++ b/src/pages/StationManager.js @@ -16,6 +16,11 @@ export default class StationManager { this.state.stations.push(newStation); this.setState({ stations: [...this.state.stations] }); }; + + this.handleDeleteButtonClick = (index) => { + this.state.stations.splice(index, 1); + this.setState({ stations: [...this.state.stations] }); + }; } setState(state) { @@ -34,6 +39,15 @@ export default class StationManager { this.handleAddButtonClick(stationNameInput.value); console.log(this.state.stations); }); + const stationDeleteButtons = document.getElementsByClassName( + elementMap.stationDeleteButton + ); + [...stationDeleteButtons].forEach((stationDeleteButton, index) => { + stationDeleteButton.addEventListener("click", () => { + this.handleDeleteButtonClick(index); + console.log(this.state.stations); + }); + }); } render() { From 8609377c8c49b3e666e45d4c939ac4935f78eb11 Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Sun, 13 Dec 2020 14:00:44 +0900 Subject: [PATCH 08/52] Update README.md --- README.md | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index 56f3bdf3b..5bf988d6d 100644 --- a/README.md +++ b/README.md @@ -14,8 +14,9 @@ #### 2) μ§€ν•˜μ²  μ—­ λͺ©λ‘ 관리 -- μ§€ν•˜μ²  μ—­ λ“±λ‘ν•˜κΈ° -- μ§€ν•˜μ²  μ—­ μ‚­μ œν•˜κΈ° +- μ—­ 관리 λ²„νŠΌ 클릭 μ‹œ μ—­ 관리 νŽ˜μ΄μ§€ μ—°κ²° +- μ—­ μΆ”κ°€ λ²„νŠΌ 클릭 μ‹œ μ—­ μΆ”κ°€ +- μ—­ μ‚­μ œ λ²„νŠΌ 클릭 μ‹œ μ—­ μ‚­μ œ ## πŸš€ κΈ°λŠ₯ μš”κ΅¬μ‚¬ν•­ From adb99aad0a7f4b6ded226aef2f093567d8bb9a35 Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Sun, 13 Dec 2020 15:04:45 +0900 Subject: [PATCH 09/52] =?UTF-8?q?feat:=20=EC=97=AD=20=EC=9D=B4=EB=A6=84=20?= =?UTF-8?q?=EC=9C=A0=ED=9A=A8=EC=84=B1=20=EA=B2=80=EC=82=AC=ED=95=98?= =?UTF-8?q?=EB=8A=94=20=EA=B8=B0=EB=8A=A5=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/StationManager.js | 47 +++++++++++++++++++++++++++++++++++-- 1 file changed, 45 insertions(+), 2 deletions(-) diff --git a/src/pages/StationManager.js b/src/pages/StationManager.js index 4a23ae36f..4c53a8538 100644 --- a/src/pages/StationManager.js +++ b/src/pages/StationManager.js @@ -13,8 +13,17 @@ export default class StationManager { }; this.handleAddButtonClick = (newStation) => { - this.state.stations.push(newStation); - this.setState({ stations: [...this.state.stations] }); + if ( + isMoreThanTwoWords(newStation) && + isNotDuplicateSatationName(newStation, this.state.stations) && + hasNotSpaceInStationName(newStation) && + isOnlyWord(newStation) + ) { + this.state.stations.push(newStation); + this.setState({ stations: [...this.state.stations] }); + } else { + alert("λ‹€μ‹œ μž…λ ₯ν•΄ μ£Όμ„Έμš”"); + } }; this.handleDeleteButtonClick = (index) => { @@ -90,3 +99,37 @@ export default class StationManager { `; } } + +function isMoreThanTwoWords(stationName) { + if (stationName.length > 1) { + return true; + } +} + +function isNotDuplicateSatationName(stationName, stations) { + if (!stations.includes(stationName)) { + return true; + } +} + +function hasNotSpaceInStationName(stationName) { + if (![...stationName].includes(" ")) { + return true; + } +} + +function isOnlyWord(stationName) { + const check_num = /[0-9]/; + const check_eng = /[a-zA-Z]/; + const check_spc = /[~!@#$%^&*()_+|<>?:{}]/; + const check_kor = /[γ„±-γ…Ž|ㅏ-γ…£|κ°€-힣]/; + + if ( + check_kor.test(stationName) && + !check_eng.test(stationName) && + !check_num.test(stationName) && + !check_spc.test(stationName) + ) { + return true; + } +} From fae92eff7c358811f5782b9bff4830c2e92446f2 Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Sun, 13 Dec 2020 15:58:43 +0900 Subject: [PATCH 10/52] =?UTF-8?q?feat:=20=EB=85=B8=EC=84=A0=20=EA=B4=80?= =?UTF-8?q?=EB=A6=AC=20=EB=B2=84=ED=8A=BC=20=ED=81=B4=EB=A6=AD=20=EC=8B=9C?= =?UTF-8?q?=20=ED=99=94=EB=A9=B4=20=EC=97=B0=EA=B2=B0=20=EA=B8=B0=EB=8A=A5?= =?UTF-8?q?=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/index.js | 8 ++++ src/pages/LineManager.js | 81 ++++++++++++++++++++++++++++++++++++++++ 2 files changed, 89 insertions(+) create mode 100644 src/pages/LineManager.js diff --git a/src/index.js b/src/index.js index 116bdc4f7..b6a909593 100644 --- a/src/index.js +++ b/src/index.js @@ -1,3 +1,4 @@ +import LineManager from "./pages/lineManager.js"; import StationManager from "./pages/StationManager.js"; const RE_RENDER_EVENT = "customRender"; @@ -6,10 +7,12 @@ const dispatchReRender = () => window.dispatchEvent(reRenderEvent); export { dispatchReRender }; const stationManager = new StationManager(); +const lineManager = new LineManager(); const pages = document.querySelector("#app"); const stationManagerButton = document.getElementById("station-manager-button"); +const lineManagerButton = document.getElementById("line-manager-button"); let page; @@ -18,6 +21,11 @@ stationManagerButton.addEventListener("click", () => { dispatchReRender(); }); +lineManagerButton.addEventListener("click", () => { + page = lineManager; + dispatchReRender(); +}); + function reRenderPage() { pages.innerHTML = page.render(); page.mount(); diff --git a/src/pages/LineManager.js b/src/pages/LineManager.js new file mode 100644 index 000000000..0ada36c91 --- /dev/null +++ b/src/pages/LineManager.js @@ -0,0 +1,81 @@ +const stations = ["인천", "μ†Œμš”μ‚°", "μ‹œμ²­", "신도림", "λŒ€ν™”", "였금"]; + +const elementMap = { + lineNameInput: "line-name-input", + lineStartStationSelector: "line-start-station-seletor", + lineEndStationSelector: "line-end-station-seletor", + lineAddButton: "line-add-button", + lineDeleteButton: "line-delete-button", +}; + +export default class LineManager { + constructor() { + this.state = { + lineName: "", + lineStartStation: stations[0], + lineEndStation: stations[0], + lines: [], + }; + } + + setState() {} + + mount() {} + + render() { + const { lineName, lineStartStation, lineEndStation, lines } = this.state; + return ` +
+

λ…Έμ„  이름

+ +
+
+

+ 상행 쒅점 + +

+

+ ν•˜ν–‰ 쒅점 + +

+
+
+ +
+
+

πŸš‰ μ§€ν•˜μ²  λ…Έμ„  λͺ©λ‘

+ + + + + + + + + + + +
λ…Έμ„  이름상행 μ’…μ μ—­ν•˜ν–‰ 쒅점역섀정
+
+ `; + } +} From d86ca1532012761a376f9655d0762d20cda6d476 Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Sun, 13 Dec 2020 16:04:51 +0900 Subject: [PATCH 11/52] =?UTF-8?q?refactor:=20=EC=9D=B4=EB=B2=A4=ED=8A=B8?= =?UTF-8?q?=20=EA=B8=B0=EB=8A=A5=20=ED=8C=8C=EC=9D=BC=20=EB=B6=84=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/index.js | 6 +----- src/pages/LineManager.js | 2 ++ src/pages/StationManager.js | 2 +- src/utils/events.js | 4 ++++ 4 files changed, 8 insertions(+), 6 deletions(-) create mode 100644 src/utils/events.js diff --git a/src/index.js b/src/index.js index b6a909593..8f7bbf783 100644 --- a/src/index.js +++ b/src/index.js @@ -1,10 +1,6 @@ import LineManager from "./pages/lineManager.js"; import StationManager from "./pages/StationManager.js"; - -const RE_RENDER_EVENT = "customRender"; -const reRenderEvent = new CustomEvent(RE_RENDER_EVENT); -const dispatchReRender = () => window.dispatchEvent(reRenderEvent); -export { dispatchReRender }; +import { dispatchReRender, RE_RENDER_EVENT } from "./utils/events.js"; const stationManager = new StationManager(); const lineManager = new LineManager(); diff --git a/src/pages/LineManager.js b/src/pages/LineManager.js index 0ada36c91..e25e74fa1 100644 --- a/src/pages/LineManager.js +++ b/src/pages/LineManager.js @@ -1,3 +1,5 @@ +import { dispatchReRender } from "../utils/events.js"; + const stations = ["인천", "μ†Œμš”μ‚°", "μ‹œμ²­", "신도림", "λŒ€ν™”", "였금"]; const elementMap = { diff --git a/src/pages/StationManager.js b/src/pages/StationManager.js index 4c53a8538..dd298c9ab 100644 --- a/src/pages/StationManager.js +++ b/src/pages/StationManager.js @@ -1,4 +1,4 @@ -import { dispatchReRender } from "../index.js"; +import { dispatchReRender } from "../utils/events.js"; const elementMap = { stationNameInput: "station-name-input", diff --git a/src/utils/events.js b/src/utils/events.js new file mode 100644 index 000000000..410353ca8 --- /dev/null +++ b/src/utils/events.js @@ -0,0 +1,4 @@ +const RE_RENDER_EVENT = "customRender"; +const reRenderEvent = new CustomEvent(RE_RENDER_EVENT); +const dispatchReRender = () => window.dispatchEvent(reRenderEvent); +export { dispatchReRender, RE_RENDER_EVENT, reRenderEvent }; From 7b703c6aaf98ba6ed207dd8f8b763bd8db62429f Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Sun, 13 Dec 2020 16:19:07 +0900 Subject: [PATCH 12/52] Update README.md --- README.md | 15 +++++++++++++++ 1 file changed, 15 insertions(+) diff --git a/README.md b/README.md index 5bf988d6d..1d4c699de 100644 --- a/README.md +++ b/README.md @@ -18,6 +18,21 @@ - μ—­ μΆ”κ°€ λ²„νŠΌ 클릭 μ‹œ μ—­ μΆ”κ°€ - μ—­ μ‚­μ œ λ²„νŠΌ 클릭 μ‹œ μ—­ μ‚­μ œ +### 2. λ…Έμ„  관리 νŽ˜μ΄μ§€ + +#### 1) λ…Έμ„ μ˜ 이름 μœ νš¨μ„± 검사 + +- μ€‘λ³΅λœ λ…Έμ„  이름 κΈˆμ§€ + +#### 2) μ§€ν•˜μ²  λ…Έμ„  λͺ©λ‘ 관리 + +- λ…Έμ„  관리 λ²„νŠΌ 클릭 μ‹œ λ…Έμ„  관리 νŽ˜μ΄μ§€ μ—°κ²° +- μ§€ν•˜μ²  λ…Έμ„ μ˜ 이름을 μž…λ ₯λ°›λŠ” κΈ°λŠ₯ +- 상행 쒅점을 μž…λ ₯λ°›λŠ” κΈ°λŠ₯ +- ν•˜ν–‰ 쒅점을 μž…λ ₯λ°›λŠ” κΈ°λŠ₯ +- λ…Έμ„  μΆ”κ°€ λ²„νŠΌ 클릭 μ‹œ λ…Έμ„  μΆ”κ°€ +- μ‚­μ œ λ²„νŠΌ 클릭 μ‹œ λ…Έμ„  μ‚­μ œ + ## πŸš€ κΈ°λŠ₯ μš”κ΅¬μ‚¬ν•­ ### μ§€ν•˜μ²  μ—­ κ΄€λ ¨ κΈ°λŠ₯ From 6896db19183d877217c0696d14711d1f709f8178 Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Sun, 13 Dec 2020 16:19:52 +0900 Subject: [PATCH 13/52] =?UTF-8?q?feat:=20=EB=85=B8=EC=84=A0=20=EC=9D=B4?= =?UTF-8?q?=EB=A6=84=EC=9D=84=20=EC=9E=85=EB=A0=A5=20=EB=B0=9B=EB=8A=94=20?= =?UTF-8?q?=EA=B8=B0=EB=8A=A5=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/LineManager.js | 13 +++++++++++-- 1 file changed, 11 insertions(+), 2 deletions(-) diff --git a/src/pages/LineManager.js b/src/pages/LineManager.js index e25e74fa1..05dc47b3b 100644 --- a/src/pages/LineManager.js +++ b/src/pages/LineManager.js @@ -20,9 +20,18 @@ export default class LineManager { }; } - setState() {} + setState(state) { + this.state = state; + dispatchReRender(); + } - mount() {} + mount() { + const lineNameInput = document.getElementById(elementMap.lineNameInput); + lineNameInput.addEventListener("blur", (event) => { + this.setState({ ...this.state, lineName: event.target.value }); + console.log(this.state); + }); + } render() { const { lineName, lineStartStation, lineEndStation, lines } = this.state; From 327aa9b967dcad8b8635a464ff6b78aa7fb8dddc Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Sun, 13 Dec 2020 16:24:17 +0900 Subject: [PATCH 14/52] =?UTF-8?q?feat:=20=EC=83=81=ED=96=89=EC=A2=85?= =?UTF-8?q?=EC=A0=90=EA=B3=BC=20=ED=95=98=ED=96=89=EC=A2=85=EC=A0=90?= =?UTF-8?q?=EC=9D=98=20=EA=B0=92=EC=9D=84=20=EC=9E=85=EB=A0=A5=EB=B0=9B?= =?UTF-8?q?=EB=8A=94=20=EA=B8=B0=EB=8A=A5=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/LineManager.js | 15 ++++++++++++++- 1 file changed, 14 insertions(+), 1 deletion(-) diff --git a/src/pages/LineManager.js b/src/pages/LineManager.js index 05dc47b3b..830d5b116 100644 --- a/src/pages/LineManager.js +++ b/src/pages/LineManager.js @@ -22,6 +22,7 @@ export default class LineManager { setState(state) { this.state = state; + console.log(this.state); dispatchReRender(); } @@ -29,7 +30,19 @@ export default class LineManager { const lineNameInput = document.getElementById(elementMap.lineNameInput); lineNameInput.addEventListener("blur", (event) => { this.setState({ ...this.state, lineName: event.target.value }); - console.log(this.state); + }); + const lineStartStationSelector = document.getElementById( + elementMap.lineStartStationSelector + ); + lineStartStationSelector.addEventListener("change", (event) => { + this.setState({ ...this.state, lineStartStation: event.target.value }); + }); + + const lineEndStationSelector = document.getElementById( + elementMap.lineEndStationSelector + ); + lineEndStationSelector.addEventListener("change", (event) => { + this.setState({ ...this.state, lineEndStation: event.target.value }); }); } From fe65acdce441d6c9981fd96ba95eb53a40bb2172 Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Sun, 13 Dec 2020 16:37:36 +0900 Subject: [PATCH 15/52] =?UTF-8?q?feat:=20=EB=85=B8=EC=84=A0=20=EC=B6=94?= =?UTF-8?q?=EA=B0=80=20=EB=B2=84=ED=8A=BC=20=ED=81=B4=EB=A6=AD=20=EC=8B=9C?= =?UTF-8?q?=20=EB=85=B8=EC=84=A0=EC=9D=B4=20=EC=B6=94=EA=B0=80=20=EB=90=98?= =?UTF-8?q?=EB=8A=94=20=EA=B8=B0=EB=8A=A5=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/LineManager.js | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/src/pages/LineManager.js b/src/pages/LineManager.js index 830d5b116..f41eaff43 100644 --- a/src/pages/LineManager.js +++ b/src/pages/LineManager.js @@ -18,6 +18,16 @@ export default class LineManager { lineEndStation: stations[0], lines: [], }; + + this.handleLineAddButton = () => { + const { lineEndStation, lineStartStation, lineName } = this.state; + const newLine = { + name: lineName, + start: lineStartStation, + end: lineEndStation, + }; + this.setState({ ...this.state, lines: [...this.state.lines, newLine] }); + }; } setState(state) { @@ -44,6 +54,9 @@ export default class LineManager { lineEndStationSelector.addEventListener("change", (event) => { this.setState({ ...this.state, lineEndStation: event.target.value }); }); + + const lineAddButton = document.getElementById(elementMap.lineAddButton); + lineAddButton.addEventListener("click", this.handleLineAddButton); } render() { From 6efea54a502c98a47b1c1a414dbee85c51631790 Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Sun, 13 Dec 2020 16:40:29 +0900 Subject: [PATCH 16/52] =?UTF-8?q?feat:=20=EB=85=B8=EC=84=A0=20=EC=B6=94?= =?UTF-8?q?=EA=B0=80=20=EB=B2=84=ED=8A=BC=20=ED=81=B4=EB=A6=AD=20=EC=8B=9C?= =?UTF-8?q?=20=ED=99=94=EB=A9=B4=EC=97=90=20=EA=B7=B8=EB=A6=AC=EB=8A=94=20?= =?UTF-8?q?=EA=B8=B0=EB=8A=A5=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/LineManager.js | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/src/pages/LineManager.js b/src/pages/LineManager.js index f41eaff43..8721b3f00 100644 --- a/src/pages/LineManager.js +++ b/src/pages/LineManager.js @@ -110,6 +110,19 @@ export default class LineManager { + ${lines + .map( + (line) => + ` + ${line.name} + ${line.start} + ${line.end} + + + + ` + ) + .join("")}
From e611eb7e01025ae04e14e4fc2a01ec146e383c4a Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Sun, 13 Dec 2020 16:48:37 +0900 Subject: [PATCH 17/52] =?UTF-8?q?feat:=20=EC=82=AD=EC=A0=9C=20=EB=B2=84?= =?UTF-8?q?=ED=8A=BC=20=ED=81=B4=EB=A6=AD=20=EC=8B=9C=20=EB=85=B8=EC=84=A0?= =?UTF-8?q?=EC=9D=84=20=EC=82=AD=EC=A0=9C=ED=95=98=EB=8A=94=20=EA=B8=B0?= =?UTF-8?q?=EB=8A=A5=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/LineManager.js | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/src/pages/LineManager.js b/src/pages/LineManager.js index 8721b3f00..cda281349 100644 --- a/src/pages/LineManager.js +++ b/src/pages/LineManager.js @@ -28,6 +28,11 @@ export default class LineManager { }; this.setState({ ...this.state, lines: [...this.state.lines, newLine] }); }; + + this.handleLineDeleteButton = (index) => { + this.state.lines.splice(index, 1); + this.setState({ ...this.state }); + }; } setState(state) { @@ -57,6 +62,15 @@ export default class LineManager { const lineAddButton = document.getElementById(elementMap.lineAddButton); lineAddButton.addEventListener("click", this.handleLineAddButton); + + const lineDeleteButtons = document.getElementsByClassName( + elementMap.lineDeleteButton + ); + [...lineDeleteButtons].forEach((lineDeleteButton, index) => { + lineDeleteButton.addEventListener("click", () => { + this.handleLineDeleteButton(index); + }); + }); } render() { From 1e453c5bcfbb40c7b1b3cffc966bfb77f55a19f4 Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Sun, 13 Dec 2020 19:55:57 +0900 Subject: [PATCH 18/52] =?UTF-8?q?feat:=20=EC=A4=91=EB=B3=B5=EB=90=9C=20?= =?UTF-8?q?=EB=85=B8=EC=84=A0=20=EA=B8=88=EC=A7=80=20=EA=B8=B0=EB=8A=A5=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/pages/LineManager.js | 14 ++++++++++++-- 1 file changed, 12 insertions(+), 2 deletions(-) diff --git a/src/pages/LineManager.js b/src/pages/LineManager.js index cda281349..bfa77b5fc 100644 --- a/src/pages/LineManager.js +++ b/src/pages/LineManager.js @@ -20,13 +20,19 @@ export default class LineManager { }; this.handleLineAddButton = () => { - const { lineEndStation, lineStartStation, lineName } = this.state; + const { lineEndStation, lineStartStation, lineName, lines } = this.state; const newLine = { name: lineName, start: lineStartStation, end: lineEndStation, }; - this.setState({ ...this.state, lines: [...this.state.lines, newLine] }); + console.log(this.state.lines); + if (isDuplicateLine(lines, lineName)) { + alert("μ€‘λ³΅λœ 노선이 μ‘΄μž¬ν•©λ‹ˆλ‹€"); + } else { + this.setState({ ...this.state, lines: [...this.state.lines, newLine] }); + console.log(this.state.lines); + } }; this.handleLineDeleteButton = (index) => { @@ -143,3 +149,7 @@ export default class LineManager { `; } } + +function isDuplicateLine(lines, lineName) { + return lines.find((line) => line.name === lineName); +} From 5e6e72a9b09f5e11ab0af296bba2197589dddf4a Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Sun, 13 Dec 2020 22:04:39 +0900 Subject: [PATCH 19/52] =?UTF-8?q?feat:=20=EC=A7=80=ED=95=98=EC=B2=A0=20?= =?UTF-8?q?=EC=97=AD=20=EB=A1=9C=EC=BB=AC=EC=8A=A4=ED=86=A0=EB=A6=AC?= =?UTF-8?q?=EC=A7=80=EC=97=90=20=EC=A0=80=EC=9E=A5=ED=95=98=EB=8A=94=20?= =?UTF-8?q?=EA=B8=B0=EB=8A=A5=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/StationManager.js | 22 +++++++++++++--------- 1 file changed, 13 insertions(+), 9 deletions(-) diff --git a/src/pages/StationManager.js b/src/pages/StationManager.js index dd298c9ab..f61ec284e 100644 --- a/src/pages/StationManager.js +++ b/src/pages/StationManager.js @@ -8,27 +8,27 @@ const elementMap = { export default class StationManager { constructor() { - this.state = { + this.store = { stations: [], }; this.handleAddButtonClick = (newStation) => { if ( isMoreThanTwoWords(newStation) && - isNotDuplicateSatationName(newStation, this.state.stations) && + isNotDuplicateSatationName(newStation, this.store.stations) && hasNotSpaceInStationName(newStation) && isOnlyWord(newStation) ) { - this.state.stations.push(newStation); - this.setState({ stations: [...this.state.stations] }); + this.store.stations.push(newStation); + this.setStore({ ...this.store }); } else { alert("λ‹€μ‹œ μž…λ ₯ν•΄ μ£Όμ„Έμš”"); } }; this.handleDeleteButtonClick = (index) => { - this.state.stations.splice(index, 1); - this.setState({ stations: [...this.state.stations] }); + this.store.stations.splice(index, 1); + this.setStore({ ...this.store }); }; } @@ -37,6 +37,12 @@ export default class StationManager { dispatchReRender(); } + setStore(store) { + this.store = store; + localStorage.setItem("store", JSON.stringify(store)); + dispatchReRender(); + } + mount() { const stationNameInput = document.getElementById( elementMap.stationNameInput @@ -46,7 +52,6 @@ export default class StationManager { ); stationAddButton.addEventListener("click", () => { this.handleAddButtonClick(stationNameInput.value); - console.log(this.state.stations); }); const stationDeleteButtons = document.getElementsByClassName( elementMap.stationDeleteButton @@ -54,13 +59,12 @@ export default class StationManager { [...stationDeleteButtons].forEach((stationDeleteButton, index) => { stationDeleteButton.addEventListener("click", () => { this.handleDeleteButtonClick(index); - console.log(this.state.stations); }); }); } render() { - const stations = this.state.stations; + const stations = this.store.stations; return `

μ—­ 이름

From 3faa8a5e03c188076687a1de07a8fd82a71137e3 Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Sun, 13 Dec 2020 22:38:38 +0900 Subject: [PATCH 20/52] =?UTF-8?q?refactor:=20=EC=BB=B4=ED=8F=AC=EB=84=8C?= =?UTF-8?q?=ED=8A=B8=20=EB=B6=84=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/core/Component.js | 14 ++++++++++++++ src/pages/StationManager.js | 17 +++++++++-------- 2 files changed, 23 insertions(+), 8 deletions(-) create mode 100644 src/core/Component.js diff --git a/src/core/Component.js b/src/core/Component.js new file mode 100644 index 000000000..cfcb559ef --- /dev/null +++ b/src/core/Component.js @@ -0,0 +1,14 @@ +import { dispatchReRender } from "../utils/events.js"; + +export default class Component { + constructor() { + this.state = {}; + this.store = {}; + } + + setStore(store) { + this.store = store; + localStorage.setItem("store", JSON.stringify(store)); + dispatchReRender(); + } +} diff --git a/src/pages/StationManager.js b/src/pages/StationManager.js index f61ec284e..7ef22681e 100644 --- a/src/pages/StationManager.js +++ b/src/pages/StationManager.js @@ -1,4 +1,5 @@ import { dispatchReRender } from "../utils/events.js"; +import Component from "../core/Component.js"; const elementMap = { stationNameInput: "station-name-input", @@ -6,11 +7,9 @@ const elementMap = { stationDeleteButton: "station-delete-button", }; -export default class StationManager { +export default class StationManager extends Component { constructor() { - this.store = { - stations: [], - }; + super(); this.handleAddButtonClick = (newStation) => { if ( @@ -19,8 +18,10 @@ export default class StationManager { hasNotSpaceInStationName(newStation) && isOnlyWord(newStation) ) { - this.store.stations.push(newStation); - this.setStore({ ...this.store }); + const stations = this.store.stations + ? [...this.store.stations, newStation] + : [newStation]; + this.setStore({ ...this.store, stations }); } else { alert("λ‹€μ‹œ μž…λ ₯ν•΄ μ£Όμ„Έμš”"); } @@ -64,7 +65,7 @@ export default class StationManager { } render() { - const stations = this.store.stations; + const { stations = [] } = this.store; return `

μ—­ 이름

@@ -110,7 +111,7 @@ function isMoreThanTwoWords(stationName) { } } -function isNotDuplicateSatationName(stationName, stations) { +function isNotDuplicateSatationName(stationName, stations = []) { if (!stations.includes(stationName)) { return true; } From 8450b1faf0e2051e377c2083563c904c0bc6166c Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Sun, 13 Dec 2020 23:53:12 +0900 Subject: [PATCH 21/52] =?UTF-8?q?refactor:=20=EB=B6=88=ED=95=84=EC=9A=94?= =?UTF-8?q?=ED=95=9C=20=EC=BD=94=EB=93=9C=20=EC=A0=9C=EA=B1=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/StationManager.js | 11 ----------- 1 file changed, 11 deletions(-) diff --git a/src/pages/StationManager.js b/src/pages/StationManager.js index 7ef22681e..57706f46b 100644 --- a/src/pages/StationManager.js +++ b/src/pages/StationManager.js @@ -33,17 +33,6 @@ export default class StationManager extends Component { }; } - setState(state) { - this.state = state; - dispatchReRender(); - } - - setStore(store) { - this.store = store; - localStorage.setItem("store", JSON.stringify(store)); - dispatchReRender(); - } - mount() { const stationNameInput = document.getElementById( elementMap.stationNameInput From 056450bd86a91f419edc50388236df7ae0a00a8e Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Sun, 13 Dec 2020 23:55:32 +0900 Subject: [PATCH 22/52] =?UTF-8?q?feat:=20=EC=85=80=EB=A0=89=ED=84=B0?= =?UTF-8?q?=EC=97=90=20=EB=A1=9C=EC=BB=AC=EC=8A=A4=ED=86=A0=EB=A6=AC?= =?UTF-8?q?=EC=A7=80=20=EC=A0=95=EB=B3=B4=20=EA=B0=80=EC=A0=B8=EC=98=A4?= =?UTF-8?q?=EA=B8=B0=20=EA=B8=B0=EB=8A=A5=20=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/core/Component.js | 14 +++++++++++++ src/index.js | 2 ++ src/pages/LineManager.js | 45 ++++++++++++++++++++-------------------- 3 files changed, 38 insertions(+), 23 deletions(-) diff --git a/src/core/Component.js b/src/core/Component.js index cfcb559ef..f0a04bc46 100644 --- a/src/core/Component.js +++ b/src/core/Component.js @@ -6,9 +6,23 @@ export default class Component { this.store = {}; } + setState(state) { + this.state = state; + dispatchReRender(); + } + setStore(store) { this.store = store; localStorage.setItem("store", JSON.stringify(store)); dispatchReRender(); } + + create() { + const store = localStorage.getItem("store"); + if (store) { + this.store = JSON.parse(store); + } + } + + afterCreate() {} } diff --git a/src/index.js b/src/index.js index 8f7bbf783..8b79a579d 100644 --- a/src/index.js +++ b/src/index.js @@ -23,6 +23,8 @@ lineManagerButton.addEventListener("click", () => { }); function reRenderPage() { + page.create(); + page.afterCreate(); pages.innerHTML = page.render(); page.mount(); } diff --git a/src/pages/LineManager.js b/src/pages/LineManager.js index bfa77b5fc..c6190b8b1 100644 --- a/src/pages/LineManager.js +++ b/src/pages/LineManager.js @@ -1,6 +1,5 @@ import { dispatchReRender } from "../utils/events.js"; - -const stations = ["인천", "μ†Œμš”μ‚°", "μ‹œμ²­", "신도림", "λŒ€ν™”", "였금"]; +import Component from "../core/Component.js"; const elementMap = { lineNameInput: "line-name-input", @@ -10,41 +9,41 @@ const elementMap = { lineDeleteButton: "line-delete-button", }; -export default class LineManager { +export default class LineManager extends Component { constructor() { + super(); this.state = { lineName: "", - lineStartStation: stations[0], - lineEndStation: stations[0], - lines: [], + lineStartStation: "", + lineEndStation: "", }; this.handleLineAddButton = () => { - const { lineEndStation, lineStartStation, lineName, lines } = this.state; - const newLine = { - name: lineName, - start: lineStartStation, - end: lineEndStation, + const line = { + name: this.state.lineName, + start: this.state.lineStartStation, + end: this.state.lineEndStation, }; - console.log(this.state.lines); - if (isDuplicateLine(lines, lineName)) { + const lines = this.store.lines ? [...this.store.lines, line] : [line]; + if (isDuplicateLine(this.store.lines, line.name)) { alert("μ€‘λ³΅λœ 노선이 μ‘΄μž¬ν•©λ‹ˆλ‹€"); } else { - this.setState({ ...this.state, lines: [...this.state.lines, newLine] }); - console.log(this.state.lines); + this.setStore({ ...this.store, lines }); } }; this.handleLineDeleteButton = (index) => { - this.state.lines.splice(index, 1); - this.setState({ ...this.state }); + this.store.lines.splice(index, 1); + this.setStore({ ...this.store }); }; } - setState(state) { - this.state = state; - console.log(this.state); - dispatchReRender(); + afterCreate() { + const { lineStartStation, lineEndStation } = this.state; + const { stations } = this.store; + if (lineStartStation.length === 0) + this.state.lineStartStation = stations[0]; + if (lineEndStation.length === 0) this.state.lineEndStation = stations[0]; } mount() { @@ -58,7 +57,6 @@ export default class LineManager { lineStartStationSelector.addEventListener("change", (event) => { this.setState({ ...this.state, lineStartStation: event.target.value }); }); - const lineEndStationSelector = document.getElementById( elementMap.lineEndStationSelector ); @@ -80,7 +78,8 @@ export default class LineManager { } render() { - const { lineName, lineStartStation, lineEndStation, lines } = this.state; + const { lines = [], stations = [] } = this.store; + const { lineName, lineStartStation, lineEndStation } = this.state; return `

λ…Έμ„  이름

From 14fd2733294320ed9b37b412a0934b6534445a8c Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Sun, 13 Dec 2020 23:59:20 +0900 Subject: [PATCH 23/52] =?UTF-8?q?refactor:=20=EC=BB=B4=ED=8F=AC=EB=84=8C?= =?UTF-8?q?=ED=8A=B8=EC=97=90=20mount,=20render=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/core/Component.js | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/core/Component.js b/src/core/Component.js index f0a04bc46..4fb87f321 100644 --- a/src/core/Component.js +++ b/src/core/Component.js @@ -25,4 +25,8 @@ export default class Component { } afterCreate() {} + + mount() {} + + render() {} } From 8091eb2356b044c5b53c17261d4ff61488f402d0 Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Mon, 14 Dec 2020 11:43:07 +0900 Subject: [PATCH 24/52] Update README.md --- README.md | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/README.md b/README.md index 1d4c699de..4c4f0b695 100644 --- a/README.md +++ b/README.md @@ -33,6 +33,18 @@ - λ…Έμ„  μΆ”κ°€ λ²„νŠΌ 클릭 μ‹œ λ…Έμ„  μΆ”κ°€ - μ‚­μ œ λ²„νŠΌ 클릭 μ‹œ λ…Έμ„  μ‚­μ œ +### 3. ꡬ간 관리 νŽ˜μ΄μ§€ + +#### 1) λ…Έμ„  선택 + +- λ‘œμ»¬μŠ€ν† λ¦¬μ§€μ—μ„œ 노선을 받아와 λ²„νŠΌμœΌλ‘œ 생성 + +#### 2) μ§€ν•˜μ²  ꡬ간 λͺ©λ‘ 관리 + +- 노선에 λ“±λ‘λœ μ—­ 제거 +- 쒅점 제거 μ‹œ λ‹€μŒ 역이 쒅점 +- 노선에 ν¬ν•¨λœ 역이 2개 μ΄ν•˜μΌ λ•Œ, μ—­ 제거 λΆˆκ°€ + ## πŸš€ κΈ°λŠ₯ μš”κ΅¬μ‚¬ν•­ ### μ§€ν•˜μ²  μ—­ κ΄€λ ¨ κΈ°λŠ₯ From 9fedab0892d896de2681486e68ab2f2114f6e812 Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Mon, 14 Dec 2020 12:10:53 +0900 Subject: [PATCH 25/52] =?UTF-8?q?style:=20=ED=85=8C=EC=9D=B4=EB=B8=94=20?= =?UTF-8?q?=EC=8A=A4=ED=83=80=EC=9D=BC=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/index.html b/index.html index 390b3420f..f2318dd3c 100644 --- a/index.html +++ b/index.html @@ -9,7 +9,7 @@ } td { padding: 2px; - border: 1px solid black; + border: 3px double black; } thead { From 7187f3d012fd17227502dea258a06f2a6fd83aac Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Mon, 14 Dec 2020 12:12:34 +0900 Subject: [PATCH 26/52] =?UTF-8?q?feat:=20=EA=B5=AC=EA=B0=84=20=EA=B4=80?= =?UTF-8?q?=EB=A6=AC=20=EB=B2=84=ED=8A=BC=20=ED=81=B4=EB=A6=AD=20=EC=8B=9C?= =?UTF-8?q?=20=ED=99=94=EB=A9=B4=20=EC=97=B0=EA=B2=B0=20=EA=B8=B0=EB=8A=A5?= =?UTF-8?q?=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/index.js | 11 ++++++++-- src/pages/SectionManager.js | 43 +++++++++++++++++++++++++++++++++++++ 2 files changed, 52 insertions(+), 2 deletions(-) create mode 100644 src/pages/SectionManager.js diff --git a/src/index.js b/src/index.js index 8b79a579d..af0937148 100644 --- a/src/index.js +++ b/src/index.js @@ -1,16 +1,18 @@ import LineManager from "./pages/lineManager.js"; +import SectionManager from "./pages/SectionManager.js"; import StationManager from "./pages/StationManager.js"; import { dispatchReRender, RE_RENDER_EVENT } from "./utils/events.js"; const stationManager = new StationManager(); const lineManager = new LineManager(); +const sectionManager = new SectionManager(); const pages = document.querySelector("#app"); +let page; const stationManagerButton = document.getElementById("station-manager-button"); const lineManagerButton = document.getElementById("line-manager-button"); - -let page; +const sectionManagerButton = document.getElementById("section-manager-button"); stationManagerButton.addEventListener("click", () => { page = stationManager; @@ -22,6 +24,11 @@ lineManagerButton.addEventListener("click", () => { dispatchReRender(); }); +sectionManagerButton.addEventListener("click", () => { + page = sectionManager; + dispatchReRender(); +}); + function reRenderPage() { page.create(); page.afterCreate(); diff --git a/src/pages/SectionManager.js b/src/pages/SectionManager.js new file mode 100644 index 000000000..e30f9f57e --- /dev/null +++ b/src/pages/SectionManager.js @@ -0,0 +1,43 @@ +import Component from "../core/Component.js"; + +export default class SectionManager extends Component { + constructor() { + super(); + } + + render() { + return ` +
+

ꡬ간을 μˆ˜μ •ν•  노선을 μ„ νƒν•΄μ£Όμ„Έμš”.

+ + + +
+
+

1ν˜Έμ„  관리

+

ꡬ간 등둝

+ + + +
+ + + + + + + + + + + + + + + +
μˆœμ„œμ΄λ¦„μ„€μ •
0인천 + +
+ `; + } +} From b06a08173e81f8451a6d6c7510bf69198b3e3937 Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Mon, 14 Dec 2020 12:40:33 +0900 Subject: [PATCH 27/52] =?UTF-8?q?feat:=20=EB=85=B8=EC=84=A0=20=EC=84=A0?= =?UTF-8?q?=ED=83=9D=20=EB=B2=84=ED=8A=BC=EA=B3=BC=20=EC=85=80=EB=A0=89?= =?UTF-8?q?=ED=8A=B8=20=ED=83=9C=EA=B7=B8=EC=97=90=20=EB=A1=9C=EC=BB=AC?= =?UTF-8?q?=EC=8A=A4=ED=86=A0=EB=A6=AC=EC=A7=80=20=EC=A0=95=EB=B3=B4=20?= =?UTF-8?q?=EB=B6=80=EC=97=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/SectionManager.js | 35 ++++++++++++++++++++++++++++------- 1 file changed, 28 insertions(+), 7 deletions(-) diff --git a/src/pages/SectionManager.js b/src/pages/SectionManager.js index e30f9f57e..de2704e5c 100644 --- a/src/pages/SectionManager.js +++ b/src/pages/SectionManager.js @@ -1,24 +1,43 @@ import Component from "../core/Component.js"; +const elementMap = { + sectionLineMenuButton: "section-line-menu-button", + sectionStationSelector: "section-station-selector", + sectionOrderInput: "section-order-input", + sectionAddButton: "section-add-button", + sectionDeleteButton: "section-delete-button", +}; export default class SectionManager extends Component { constructor() { super(); } render() { + const { stations = [], lines = [] } = this.store; + console.log(stations, lines); return `

ꡬ간을 μˆ˜μ •ν•  노선을 μ„ νƒν•΄μ£Όμ„Έμš”.

- - - + ${lines + .map( + (line) => + `` + ) + .join("")}

1ν˜Έμ„  관리

ꡬ간 등둝

- - - + + +
@@ -33,7 +52,9 @@ export default class SectionManager extends Component { From a2ed6203754d966193e6745c0534711e3d73ec09 Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Mon, 14 Dec 2020 14:32:34 +0900 Subject: [PATCH 28/52] =?UTF-8?q?feat:=20=EB=85=B8=EC=84=A0=20=EC=84=A0?= =?UTF-8?q?=ED=83=9D=20=EB=B2=84=ED=8A=BC=20=ED=81=B4=EB=A6=AD=20=EC=8B=9C?= =?UTF-8?q?=20=EA=B5=AC=EA=B0=84=20=EA=B4=80=EB=A6=AC=20=ED=99=94=EB=A9=B4?= =?UTF-8?q?=20=EC=97=B0=EA=B2=B0=20=EA=B8=B0=EB=8A=A5=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/SectionManager.js | 55 ++++++++++++++++++++++++++----------- 1 file changed, 39 insertions(+), 16 deletions(-) diff --git a/src/pages/SectionManager.js b/src/pages/SectionManager.js index de2704e5c..dafb141ae 100644 --- a/src/pages/SectionManager.js +++ b/src/pages/SectionManager.js @@ -10,24 +10,34 @@ const elementMap = { export default class SectionManager extends Component { constructor() { super(); + this.state = { + selectedLine: null, + }; + this.handleLineButtonClick = (index) => { + const line = this.store.lines[index]; + this.setState({ ...this.state, selectedLine: line }); + console.log(this.state.selectedLine); + }; + } + + mount() { + const sectionLineMenuButtons = document.getElementsByClassName( + elementMap.sectionLineMenuButton + ); + [...sectionLineMenuButtons].forEach((button, index) => { + button.addEventListener("click", () => { + this.handleLineButtonClick(index); + }); + }); } render() { const { stations = [], lines = [] } = this.store; - console.log(stations, lines); - return ` -
-

ꡬ간을 μˆ˜μ •ν•  노선을 μ„ νƒν•΄μ£Όμ„Έμš”.

- ${lines - .map( - (line) => - `` - ) - .join("")} -
+ const { selectedLine } = this.state; + console.log(Boolean(selectedLine)); + let section = `
-

1ν˜Έμ„  관리

+

${selectedLine ? selectedLine.name : ""} 관리

ꡬ간 등둝

- - + + -
0 인천 - +
0인천
+ + `; + return ` +
+

ꡬ간을 μˆ˜μ •ν•  노선을 μ„ νƒν•΄μ£Όμ„Έμš”.

+ ${lines + .map( + (line) => + `` + ) + .join("")} +
+ ${selectedLine ? section : `
`} `; } } From 8cc6e62e017be1c3814e16b69b9ec9a89f021b3c Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Mon, 14 Dec 2020 15:43:29 +0900 Subject: [PATCH 29/52] =?UTF-8?q?feat:=20=EB=85=B8=EC=84=A0=20=EB=B2=84?= =?UTF-8?q?=ED=8A=BC=20=ED=81=B4=EB=A6=AD=20=EC=8B=9C=20=ED=91=9C=EC=97=90?= =?UTF-8?q?=20=EB=A1=9C=EC=BB=AC=20=EC=8A=A4=ED=86=A0=EB=A6=AC=EC=A7=80=20?= =?UTF-8?q?=EC=A0=95=EB=B3=B4=20=EB=B6=88=EB=9F=AC=EC=98=A4=EA=B8=B0=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/pages/SectionManager.js | 55 ++++++++++++++++++++++++------------- 1 file changed, 36 insertions(+), 19 deletions(-) diff --git a/src/pages/SectionManager.js b/src/pages/SectionManager.js index dafb141ae..2d9a3c4ab 100644 --- a/src/pages/SectionManager.js +++ b/src/pages/SectionManager.js @@ -11,11 +11,16 @@ export default class SectionManager extends Component { constructor() { super(); this.state = { - selectedLine: null, + selectedLineName: null, + selectedLineStation: null, }; this.handleLineButtonClick = (index) => { const line = this.store.lines[index]; - this.setState({ ...this.state, selectedLine: line }); + this.setState({ + ...this.state, + selectedLineName: [line.name], + selectedLineStation: [line.start, line.end], + }); console.log(this.state.selectedLine); }; } @@ -33,18 +38,23 @@ export default class SectionManager extends Component { render() { const { stations = [], lines = [] } = this.store; - const { selectedLine } = this.state; - console.log(Boolean(selectedLine)); + const { selectedLineName = [], selectedLineStation = [] } = this.state; + + console.log(selectedLineStation); let section = `
-

${selectedLine ? selectedLine.name : ""} 관리

+

${ + selectedLineName ? selectedLineName[selectedLineName.length - 1] : null + } 관리

ꡬ간 등둝

@@ -58,15 +68,22 @@ export default class SectionManager extends Component { - - - - - - - + ${ + selectedLineStation + ? selectedLineStation + .map( + (line, index) => + ` + ${index} + ${line} + + + + ` + ) + .join("") + : null + } `; @@ -81,7 +98,7 @@ export default class SectionManager extends Component { ) .join("")}
- ${selectedLine ? section : `
`} + ${selectedLineName && selectedLineStation ? section : `
`} `; } } From 275238f5b8eebaead858ee6aa4c82a1c68c5447d Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Mon, 14 Dec 2020 16:30:46 +0900 Subject: [PATCH 30/52] =?UTF-8?q?feat:=20=EB=93=B1=EB=A1=9D=20=EB=B2=84?= =?UTF-8?q?=ED=8A=BC=20=ED=81=B4=EB=A6=AD=20=EC=8B=9C=20=EA=B5=AC=EA=B0=84?= =?UTF-8?q?=20=EC=B6=94=EA=B0=80=20=EA=B8=B0=EB=8A=A5=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/SectionManager.js | 26 ++++++++++++++++++++++++++ 1 file changed, 26 insertions(+) diff --git a/src/pages/SectionManager.js b/src/pages/SectionManager.js index 2d9a3c4ab..e6d47beba 100644 --- a/src/pages/SectionManager.js +++ b/src/pages/SectionManager.js @@ -14,6 +14,7 @@ export default class SectionManager extends Component { selectedLineName: null, selectedLineStation: null, }; + this.handleLineButtonClick = (index) => { const line = this.store.lines[index]; this.setState({ @@ -23,6 +24,13 @@ export default class SectionManager extends Component { }); console.log(this.state.selectedLine); }; + + this.handleAddButtonClick = (station, order) => { + this.state.selectedLineStation.splice(order, 0, station); + this.setState({ ...this.state }); + console.log(station, order); + console.log(this.state.selectedLineStation); + }; } mount() { @@ -34,6 +42,24 @@ export default class SectionManager extends Component { this.handleLineButtonClick(index); }); }); + + const sectionStationSelector = document.getElementById( + elementMap.sectionStationSelector + ); + + const sectionOrderInput = document.getElementById( + elementMap.sectionOrderInput + ); + + const sectionAddButton = document.getElementById( + elementMap.sectionAddButton + ); + sectionAddButton.addEventListener("click", () => { + this.handleAddButtonClick( + sectionStationSelector.value, + sectionOrderInput.value + ); + }); } render() { From 986f74eb759854fd04ca3f3b894e04bbf0f770b2 Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Mon, 14 Dec 2020 16:38:01 +0900 Subject: [PATCH 31/52] =?UTF-8?q?feat:=20=EC=A0=9C=EA=B1=B0=20=EB=B2=84?= =?UTF-8?q?=ED=8A=BC=20=ED=81=B4=EB=A6=AD=20=EC=8B=9C=20=EA=B5=AC=EA=B0=84?= =?UTF-8?q?=20=EC=82=AD=EC=A0=9C=20=EA=B8=B0=EB=8A=A5=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/SectionManager.js | 16 ++++++++++++++-- 1 file changed, 14 insertions(+), 2 deletions(-) diff --git a/src/pages/SectionManager.js b/src/pages/SectionManager.js index e6d47beba..f66c9bb09 100644 --- a/src/pages/SectionManager.js +++ b/src/pages/SectionManager.js @@ -28,8 +28,11 @@ export default class SectionManager extends Component { this.handleAddButtonClick = (station, order) => { this.state.selectedLineStation.splice(order, 0, station); this.setState({ ...this.state }); - console.log(station, order); - console.log(this.state.selectedLineStation); + }; + + this.handleDeleteButtonClick = (index) => { + this.state.selectedLineStation.splice(index, 1); + this.setState({ ...this.state }); }; } @@ -60,6 +63,15 @@ export default class SectionManager extends Component { sectionOrderInput.value ); }); + + const sectionDeleteButtons = document.getElementsByClassName( + elementMap.sectionDeleteButton + ); + [...sectionDeleteButtons].forEach((button, index) => { + button.addEventListener("click", () => { + this.handleDeleteButtonClick(index); + }); + }); } render() { From a06e61b24ed9cb1027303ccbd40fe9bc34a3d2b7 Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Mon, 14 Dec 2020 21:33:41 +0900 Subject: [PATCH 32/52] =?UTF-8?q?fix:=20=EB=A1=9C=EC=BB=AC=EC=8A=A4?= =?UTF-8?q?=ED=86=A0=EB=A6=AC=EC=A7=80=EC=97=90=20=EC=A0=95=EB=B3=B4?= =?UTF-8?q?=EB=A5=BC=20=EB=84=98=EA=B8=B0=EA=B3=A0=20=EB=B0=9B=EC=95=84?= =?UTF-8?q?=EC=98=A4=EB=8A=94=20=EA=B8=B0=EB=8A=A5=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/SectionManager.js | 102 ++++++++++++++++++++---------------- 1 file changed, 58 insertions(+), 44 deletions(-) diff --git a/src/pages/SectionManager.js b/src/pages/SectionManager.js index f66c9bb09..f244ee854 100644 --- a/src/pages/SectionManager.js +++ b/src/pages/SectionManager.js @@ -11,28 +11,27 @@ export default class SectionManager extends Component { constructor() { super(); this.state = { - selectedLineName: null, - selectedLineStation: null, + selectedLine: null, }; this.handleLineButtonClick = (index) => { - const line = this.store.lines[index]; - this.setState({ - ...this.state, - selectedLineName: [line.name], - selectedLineStation: [line.start, line.end], - }); - console.log(this.state.selectedLine); + this.setState({ selectedLine: index }); }; - this.handleAddButtonClick = (station, order) => { - this.state.selectedLineStation.splice(order, 0, station); - this.setState({ ...this.state }); + this.handleAddButtonClick = (order, station) => { + const { selectedLine } = this.state; + if (order.length === 0) { + alert("μˆœμ„œλ₯Ό μž…λ ₯ν•˜μ„Έμš”"); + return; + } + + this.store.lines[selectedLine].stations.splice(order, 0, station); + deepClone(); }; this.handleDeleteButtonClick = (index) => { - this.state.selectedLineStation.splice(index, 1); - this.setState({ ...this.state }); + this.store.lines[this.state.selectedLine].stations.splice(index, 1); + deepClone(); }; } @@ -57,33 +56,30 @@ export default class SectionManager extends Component { const sectionAddButton = document.getElementById( elementMap.sectionAddButton ); - sectionAddButton.addEventListener("click", () => { + sectionAddButton?.addEventListener("click", () => { this.handleAddButtonClick( - sectionStationSelector.value, - sectionOrderInput.value + sectionOrderInput.value, + sectionStationSelector.value ); }); const sectionDeleteButtons = document.getElementsByClassName( elementMap.sectionDeleteButton ); - [...sectionDeleteButtons].forEach((button, index) => { - button.addEventListener("click", () => { - this.handleDeleteButtonClick(index); + sectionDeleteButtons && + [...sectionDeleteButtons].forEach((button, index) => { + button.addEventListener("click", () => { + this.handleDeleteButtonClick(index); + }); }); - }); } render() { const { stations = [], lines = [] } = this.store; - const { selectedLineName = [], selectedLineStation = [] } = this.state; - - console.log(selectedLineStation); - let section = ` + const { selectedLine } = this.state; + const Section = () => `
-

${ - selectedLineName ? selectedLineName[selectedLineName.length - 1] : null - } 관리

+

${lines[selectedLine]?.name} 관리

ꡬ간 등둝

- +
@@ -107,24 +105,23 @@ export default class SectionManager extends Component { ${ - selectedLineStation - ? selectedLineStation - .map( - (line, index) => - ` - - - - ` - ) - .join("") - : null + lines[selectedLine]?.stations + .map( + (station, index) => + ` + + + + ` + ) + .join("") || "" }
${index}${line} - -
${index}${station} + +
`; + return `

ꡬ간을 μˆ˜μ •ν•  노선을 μ„ νƒν•΄μ£Όμ„Έμš”.

@@ -136,7 +133,24 @@ export default class SectionManager extends Component { ) .join("")}
- ${selectedLineName && selectedLineStation ? section : `
`} + ${isNull(selectedLine) ? "" : Section()} `; } } + +function isEmpty(value) { + if (typeof value === "number") { + return false; + } + return Boolean(value); +} + +function isNull(value) { + if (String(value) === "null") return true; + if (String(value) === "undefined") return true; +} + +function deepClone() { + const store = JSON.stringify(this.store); + this.setStore(JSON.parse(store)); +} From f420627ec4349785e1af9be7800ca56020fe6126 Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Mon, 14 Dec 2020 21:38:50 +0900 Subject: [PATCH 33/52] =?UTF-8?q?fix:=20=EC=8A=A4=ED=86=A0=EC=96=B4?= =?UTF-8?q?=EC=9D=98=20=EB=9D=BC=EC=9D=B8=20=EB=8D=B0=EC=9D=B4=ED=84=B0=20?= =?UTF-8?q?=EA=B5=AC=EC=A1=B0=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/LineManager.js | 14 ++++++++------ 1 file changed, 8 insertions(+), 6 deletions(-) diff --git a/src/pages/LineManager.js b/src/pages/LineManager.js index c6190b8b1..6f92fa588 100644 --- a/src/pages/LineManager.js +++ b/src/pages/LineManager.js @@ -21,11 +21,11 @@ export default class LineManager extends Component { this.handleLineAddButton = () => { const line = { name: this.state.lineName, - start: this.state.lineStartStation, - end: this.state.lineEndStation, + stations: [this.state.lineStartStation, this.state.lineEndStation], }; const lines = this.store.lines ? [...this.store.lines, line] : [line]; - if (isDuplicateLine(this.store.lines, line.name)) { + + if (isDuplicateLine(this.store.lines, this.state.lineName)) { alert("μ€‘λ³΅λœ 노선이 μ‘΄μž¬ν•©λ‹ˆλ‹€"); } else { this.setStore({ ...this.store, lines }); @@ -134,8 +134,8 @@ export default class LineManager extends Component { (line) => ` ${line.name} - ${line.start} - ${line.end} + ${line.stations[0]} + ${line.stations[1]} @@ -149,6 +149,8 @@ export default class LineManager extends Component { } } -function isDuplicateLine(lines, lineName) { +function isDuplicateLine(lines = [], lineName) { return lines.find((line) => line.name === lineName); } + +// λ…Έμ„  이름 곡백 λΆˆκ°€λŠ₯ ν•˜λ„λ‘ From 2e443ba4c42895dc32a62cf4b01e6b44bcf99f85 Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Mon, 14 Dec 2020 22:13:46 +0900 Subject: [PATCH 34/52] Update README.md --- README.md | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/README.md b/README.md index 4c4f0b695..0173c7482 100644 --- a/README.md +++ b/README.md @@ -45,6 +45,12 @@ - 쒅점 제거 μ‹œ λ‹€μŒ 역이 쒅점 - 노선에 ν¬ν•¨λœ 역이 2개 μ΄ν•˜μΌ λ•Œ, μ—­ 제거 λΆˆκ°€ +### 4. μ§€ν•˜μ²  노선도 좜λ ₯ + +#### 1) + +- μ§€ν•˜μ²  노선도 좜λ ₯ λ²„νŠΌμ„ λˆ„λ₯΄λ©΄ `
` νƒœκ·Έλ₯Ό λ§Œλ“€κ³  ν•΄λ‹Ή νƒœκ·Έ 내뢀에 노선도λ₯Ό 좜λ ₯ν•œλ‹€. + ## πŸš€ κΈ°λŠ₯ μš”κ΅¬μ‚¬ν•­ ### μ§€ν•˜μ²  μ—­ κ΄€λ ¨ κΈ°λŠ₯ From 6df5e5c8f8e06925e21fd9318905d7bb1d0ca80c Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Mon, 14 Dec 2020 22:44:46 +0900 Subject: [PATCH 35/52] =?UTF-8?q?feat:=20=EC=A7=80=ED=95=98=EC=B2=A0=20?= =?UTF-8?q?=EB=85=B8=EC=84=A0=EB=8F=84=20=EC=B6=9C=EB=A0=A5=20=EA=B8=B0?= =?UTF-8?q?=EB=8A=A5=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/index.js | 9 +++++++++ src/pages/PrintSubwayLine.js | 34 ++++++++++++++++++++++++++++++++++ 2 files changed, 43 insertions(+) create mode 100644 src/pages/PrintSubwayLine.js diff --git a/src/index.js b/src/index.js index af0937148..e4ae27a05 100644 --- a/src/index.js +++ b/src/index.js @@ -1,4 +1,5 @@ import LineManager from "./pages/lineManager.js"; +import PrintSubwayLine from "./pages/PrintSubwayLine.js"; import SectionManager from "./pages/SectionManager.js"; import StationManager from "./pages/StationManager.js"; import { dispatchReRender, RE_RENDER_EVENT } from "./utils/events.js"; @@ -6,6 +7,7 @@ import { dispatchReRender, RE_RENDER_EVENT } from "./utils/events.js"; const stationManager = new StationManager(); const lineManager = new LineManager(); const sectionManager = new SectionManager(); +const printSubwayLine = new PrintSubwayLine(); const pages = document.querySelector("#app"); let page; @@ -13,6 +15,9 @@ let page; const stationManagerButton = document.getElementById("station-manager-button"); const lineManagerButton = document.getElementById("line-manager-button"); const sectionManagerButton = document.getElementById("section-manager-button"); +const printSubwayLineButton = document.getElementById( + "map-print-manager-button" +); stationManagerButton.addEventListener("click", () => { page = stationManager; @@ -29,6 +34,10 @@ sectionManagerButton.addEventListener("click", () => { dispatchReRender(); }); +printSubwayLineButton.addEventListener("click", () => { + page = printSubwayLine; + dispatchReRender(); +}); function reRenderPage() { page.create(); page.afterCreate(); diff --git a/src/pages/PrintSubwayLine.js b/src/pages/PrintSubwayLine.js new file mode 100644 index 000000000..f128f9c81 --- /dev/null +++ b/src/pages/PrintSubwayLine.js @@ -0,0 +1,34 @@ +import Component from "../core/Component.js"; + +export default class PrintSubwayLine extends Component { + constructor() { + super(); + } + + render() { + const { lines } = this.store; + console.log(lines); + return ` +
+ ${lines + .map( + (line) => ` +
+

${line.name}

+
    + ${line.stations + .map( + (station) => ` +
  • ${station}
  • + ` + ) + .join("")} +
+
+ ` + ) + .join("")} +
+ `; + } +} From 42b8b32dcd49af8feec43887a1296b0243d0532c Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Tue, 15 Dec 2020 00:22:46 +0900 Subject: [PATCH 36/52] =?UTF-8?q?feat:=202=EA=B0=9C=20=EC=9D=B4=ED=95=98?= =?UTF-8?q?=EC=9D=98=20=EC=97=AD=20=EC=A0=9C=EA=B1=B0=20=EA=B8=88=EC=A7=80?= =?UTF-8?q?=20=EA=B8=B0=EB=8A=A5=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/SectionManager.js | 27 ++++++++++++--------------- 1 file changed, 12 insertions(+), 15 deletions(-) diff --git a/src/pages/SectionManager.js b/src/pages/SectionManager.js index f244ee854..af097eeb4 100644 --- a/src/pages/SectionManager.js +++ b/src/pages/SectionManager.js @@ -24,14 +24,18 @@ export default class SectionManager extends Component { alert("μˆœμ„œλ₯Ό μž…λ ₯ν•˜μ„Έμš”"); return; } - this.store.lines[selectedLine].stations.splice(order, 0, station); - deepClone(); + this.setStore(cloneDeep(this.store)); }; this.handleDeleteButtonClick = (index) => { - this.store.lines[this.state.selectedLine].stations.splice(index, 1); - deepClone(); + const stations = this.store.lines[this.state.selectedLine].stations; + if (isLessThanTwoStation(stations)) { + stations.splice(index, 1); + this.setStore(cloneDeep(this.store)); + } else { + alert("2개 μ΄ν•˜λŠ” μ§€μšΈ 수 μ—†μŠ΅λ‹ˆλ‹€."); + } }; } @@ -138,19 +142,12 @@ export default class SectionManager extends Component { } } -function isEmpty(value) { - if (typeof value === "number") { - return false; - } - return Boolean(value); +function isLessThanTwoStation(stations) { + return stations.length > 2; } function isNull(value) { - if (String(value) === "null") return true; - if (String(value) === "undefined") return true; + return String(value) === "null" || String(value) === "undefined"; } -function deepClone() { - const store = JSON.stringify(this.store); - this.setStore(JSON.parse(store)); -} +const cloneDeep = (value) => JSON.parse(JSON.stringify(value)); From d70eb89c0fae85bca16bf7f01c80cfca8330f259 Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Tue, 15 Dec 2020 01:11:12 +0900 Subject: [PATCH 37/52] =?UTF-8?q?refactor:=20mount=ED=95=A8=EC=88=98=20?= =?UTF-8?q?=EB=B6=84=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/LineManager.js | 18 ++++++++++++++++++ src/pages/SectionManager.js | 24 ++++++++++++++++-------- src/pages/StationManager.js | 11 +++++++++++ 3 files changed, 45 insertions(+), 8 deletions(-) diff --git a/src/pages/LineManager.js b/src/pages/LineManager.js index 6f92fa588..ef108ff55 100644 --- a/src/pages/LineManager.js +++ b/src/pages/LineManager.js @@ -47,26 +47,44 @@ export default class LineManager extends Component { } mount() { + this.mountNameInput(); + this.mountStartSelector(); + this.mountEndSelector(); + this.mountAddButton(); + this.mountDeleteButton(); + } + + mountNameInput() { const lineNameInput = document.getElementById(elementMap.lineNameInput); lineNameInput.addEventListener("blur", (event) => { this.setState({ ...this.state, lineName: event.target.value }); }); + } + + mountStartSelector() { const lineStartStationSelector = document.getElementById( elementMap.lineStartStationSelector ); lineStartStationSelector.addEventListener("change", (event) => { this.setState({ ...this.state, lineStartStation: event.target.value }); }); + } + + mountEndSelector() { const lineEndStationSelector = document.getElementById( elementMap.lineEndStationSelector ); lineEndStationSelector.addEventListener("change", (event) => { this.setState({ ...this.state, lineEndStation: event.target.value }); }); + } + mountAddButton() { const lineAddButton = document.getElementById(elementMap.lineAddButton); lineAddButton.addEventListener("click", this.handleLineAddButton); + } + mountDeleteButton() { const lineDeleteButtons = document.getElementsByClassName( elementMap.lineDeleteButton ); diff --git a/src/pages/SectionManager.js b/src/pages/SectionManager.js index af097eeb4..ea15f0455 100644 --- a/src/pages/SectionManager.js +++ b/src/pages/SectionManager.js @@ -40,6 +40,18 @@ export default class SectionManager extends Component { } mount() { + const sectionStationSelector = document.getElementById( + elementMap.sectionStationSelector + ); + const sectionOrderInput = document.getElementById( + elementMap.sectionOrderInput + ); + this.mountLineMenuButton(); + this.mountAddButton(sectionOrderInput, sectionStationSelector); + this.mountDeleteButton(); + } + + mountLineMenuButton() { const sectionLineMenuButtons = document.getElementsByClassName( elementMap.sectionLineMenuButton ); @@ -48,15 +60,9 @@ export default class SectionManager extends Component { this.handleLineButtonClick(index); }); }); + } - const sectionStationSelector = document.getElementById( - elementMap.sectionStationSelector - ); - - const sectionOrderInput = document.getElementById( - elementMap.sectionOrderInput - ); - + mountAddButton(sectionOrderInput, sectionStationSelector) { const sectionAddButton = document.getElementById( elementMap.sectionAddButton ); @@ -66,7 +72,9 @@ export default class SectionManager extends Component { sectionStationSelector.value ); }); + } + mountDeleteButton() { const sectionDeleteButtons = document.getElementsByClassName( elementMap.sectionDeleteButton ); diff --git a/src/pages/StationManager.js b/src/pages/StationManager.js index 57706f46b..013db9afe 100644 --- a/src/pages/StationManager.js +++ b/src/pages/StationManager.js @@ -34,15 +34,26 @@ export default class StationManager extends Component { } mount() { + this.mountNameInput(); + this.mountAddButton(); + this.mountDeleteButton(); + } + mountNameInput() { const stationNameInput = document.getElementById( elementMap.stationNameInput ); + } + + mountAddButton() { const stationAddButton = document.getElementById( elementMap.stationAddButton ); stationAddButton.addEventListener("click", () => { this.handleAddButtonClick(stationNameInput.value); }); + } + + mountDeleteButton() { const stationDeleteButtons = document.getElementsByClassName( elementMap.stationDeleteButton ); From 309aeecfae2745fcac4457a2de6c3d0a18d5e6d1 Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Tue, 15 Dec 2020 01:30:31 +0900 Subject: [PATCH 38/52] =?UTF-8?q?refactor:=20=ED=95=A8=EC=88=98=20?= =?UTF-8?q?=EB=A6=AC=ED=84=B4=20=EA=B0=92=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/StationManager.js | 27 ++++++++------------------- 1 file changed, 8 insertions(+), 19 deletions(-) diff --git a/src/pages/StationManager.js b/src/pages/StationManager.js index 013db9afe..c133ab8b2 100644 --- a/src/pages/StationManager.js +++ b/src/pages/StationManager.js @@ -34,17 +34,14 @@ export default class StationManager extends Component { } mount() { - this.mountNameInput(); - this.mountAddButton(); - this.mountDeleteButton(); - } - mountNameInput() { const stationNameInput = document.getElementById( elementMap.stationNameInput ); + this.mountAddButton(stationNameInput); + this.mountDeleteButton(); } - mountAddButton() { + mountAddButton(stationNameInput) { const stationAddButton = document.getElementById( elementMap.stationAddButton ); @@ -106,21 +103,15 @@ export default class StationManager extends Component { } function isMoreThanTwoWords(stationName) { - if (stationName.length > 1) { - return true; - } + return stationName.length > 1; } function isNotDuplicateSatationName(stationName, stations = []) { - if (!stations.includes(stationName)) { - return true; - } + return !stations.includes(stationName); } function hasNotSpaceInStationName(stationName) { - if (![...stationName].includes(" ")) { - return true; - } + return ![...stationName].includes(" "); } function isOnlyWord(stationName) { @@ -129,12 +120,10 @@ function isOnlyWord(stationName) { const check_spc = /[~!@#$%^&*()_+|<>?:{}]/; const check_kor = /[γ„±-γ…Ž|ㅏ-γ…£|κ°€-힣]/; - if ( + return ( check_kor.test(stationName) && !check_eng.test(stationName) && !check_num.test(stationName) && !check_spc.test(stationName) - ) { - return true; - } + ); } From b803079a1e3fd0ad548a592eaf0d2dcec4dd119e Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Tue, 15 Dec 2020 01:34:55 +0900 Subject: [PATCH 39/52] =?UTF-8?q?refactor:=20=EB=B6=88=ED=95=84=EC=9A=94?= =?UTF-8?q?=ED=95=9C=20=EC=BD=94=EB=93=9C=20=EC=82=AD=EC=A0=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/LineManager.js | 1 - src/pages/StationManager.js | 1 - 2 files changed, 2 deletions(-) diff --git a/src/pages/LineManager.js b/src/pages/LineManager.js index ef108ff55..60672c63a 100644 --- a/src/pages/LineManager.js +++ b/src/pages/LineManager.js @@ -1,4 +1,3 @@ -import { dispatchReRender } from "../utils/events.js"; import Component from "../core/Component.js"; const elementMap = { diff --git a/src/pages/StationManager.js b/src/pages/StationManager.js index c133ab8b2..f3b88ca5c 100644 --- a/src/pages/StationManager.js +++ b/src/pages/StationManager.js @@ -1,4 +1,3 @@ -import { dispatchReRender } from "../utils/events.js"; import Component from "../core/Component.js"; const elementMap = { From 13a5dde9612bf223711f96cc3a843f602ae130f3 Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Tue, 15 Dec 2020 01:54:03 +0900 Subject: [PATCH 40/52] =?UTF-8?q?refactor:=20=EC=97=90=EB=9F=AC=EB=A9=94?= =?UTF-8?q?=EC=8B=9C=EC=A7=80=20=ED=8C=8C=EC=9D=BC=20=EB=B6=84=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/LineManager.js | 3 ++- src/pages/SectionManager.js | 5 +++-- src/pages/StationManager.js | 3 ++- src/utils/errors.js | 6 ++++++ 4 files changed, 13 insertions(+), 4 deletions(-) create mode 100644 src/utils/errors.js diff --git a/src/pages/LineManager.js b/src/pages/LineManager.js index 60672c63a..33067fd81 100644 --- a/src/pages/LineManager.js +++ b/src/pages/LineManager.js @@ -1,4 +1,5 @@ import Component from "../core/Component.js"; +import { ERROR } from "../utils/errors.js"; const elementMap = { lineNameInput: "line-name-input", @@ -25,7 +26,7 @@ export default class LineManager extends Component { const lines = this.store.lines ? [...this.store.lines, line] : [line]; if (isDuplicateLine(this.store.lines, this.state.lineName)) { - alert("μ€‘λ³΅λœ 노선이 μ‘΄μž¬ν•©λ‹ˆλ‹€"); + alert(ERROR.RE_TYPING_LINE); } else { this.setStore({ ...this.store, lines }); } diff --git a/src/pages/SectionManager.js b/src/pages/SectionManager.js index ea15f0455..d828cc948 100644 --- a/src/pages/SectionManager.js +++ b/src/pages/SectionManager.js @@ -1,4 +1,5 @@ import Component from "../core/Component.js"; +import { ERROR } from "../utils/errors.js"; const elementMap = { sectionLineMenuButton: "section-line-menu-button", @@ -21,7 +22,7 @@ export default class SectionManager extends Component { this.handleAddButtonClick = (order, station) => { const { selectedLine } = this.state; if (order.length === 0) { - alert("μˆœμ„œλ₯Ό μž…λ ₯ν•˜μ„Έμš”"); + alert(ERROR.RE_TYPING_ORDER); return; } this.store.lines[selectedLine].stations.splice(order, 0, station); @@ -34,7 +35,7 @@ export default class SectionManager extends Component { stations.splice(index, 1); this.setStore(cloneDeep(this.store)); } else { - alert("2개 μ΄ν•˜λŠ” μ§€μšΈ 수 μ—†μŠ΅λ‹ˆλ‹€."); + alert(ERROR.NOT_DELETE); } }; } diff --git a/src/pages/StationManager.js b/src/pages/StationManager.js index f3b88ca5c..3c92f3adb 100644 --- a/src/pages/StationManager.js +++ b/src/pages/StationManager.js @@ -1,4 +1,5 @@ import Component from "../core/Component.js"; +import { ERROR } from "../utils/errors.js"; const elementMap = { stationNameInput: "station-name-input", @@ -22,7 +23,7 @@ export default class StationManager extends Component { : [newStation]; this.setStore({ ...this.store, stations }); } else { - alert("λ‹€μ‹œ μž…λ ₯ν•΄ μ£Όμ„Έμš”"); + alert(ERROR.RE_TYPING_STATION); } }; diff --git a/src/utils/errors.js b/src/utils/errors.js new file mode 100644 index 000000000..30e1d0541 --- /dev/null +++ b/src/utils/errors.js @@ -0,0 +1,6 @@ +export const ERROR = { + RE_TYPING_STATION: "μ—­ 이름을 λ‹€μ‹œ μž…λ ₯ν•΄ μ£Όμ„Έμš”", + RE_TYPING_LINE: "μ€‘λ³΅λœ 노선이 μ‘΄μž¬ν•©λ‹ˆλ‹€", + RE_TYPING_ORDER: "μˆœμ„œλ₯Ό μž…λ ₯ν•˜μ„Έμš”", + NOT_DELETE: "2개 μ΄ν•˜λŠ” μ§€μšΈ 수 μ—†μŠ΅λ‹ˆλ‹€", +}; From 9e40ce6e5b4165a54f64ca1e9320a691c81a8cea Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Tue, 15 Dec 2020 11:57:15 +0900 Subject: [PATCH 41/52] =?UTF-8?q?refactor:=20=ED=95=A8=EC=88=98=20?= =?UTF-8?q?=ED=86=B5=EC=9D=BC=EC=84=B1=20=EB=A7=9E=EC=B6=94=EA=B8=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/SectionManager.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/src/pages/SectionManager.js b/src/pages/SectionManager.js index d828cc948..d9c9c5d1c 100644 --- a/src/pages/SectionManager.js +++ b/src/pages/SectionManager.js @@ -21,6 +21,7 @@ export default class SectionManager extends Component { this.handleAddButtonClick = (order, station) => { const { selectedLine } = this.state; + if (order.length === 0) { alert(ERROR.RE_TYPING_ORDER); return; @@ -159,4 +160,6 @@ function isNull(value) { return String(value) === "null" || String(value) === "undefined"; } -const cloneDeep = (value) => JSON.parse(JSON.stringify(value)); +function cloneDeep(value) { + return JSON.parse(JSON.stringify(value)); +} From 3e5d70a3ba42124daf106be67dc1a6aa71dcb944 Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Tue, 15 Dec 2020 14:26:47 +0900 Subject: [PATCH 42/52] =?UTF-8?q?refactor:=20=EB=B6=88=ED=95=84=EC=9A=94?= =?UTF-8?q?=ED=95=9C=20=EC=BD=94=EB=93=9C=20=EC=82=AD=EC=A0=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/PrintSubwayLine.js | 1 - 1 file changed, 1 deletion(-) diff --git a/src/pages/PrintSubwayLine.js b/src/pages/PrintSubwayLine.js index f128f9c81..d0dceed43 100644 --- a/src/pages/PrintSubwayLine.js +++ b/src/pages/PrintSubwayLine.js @@ -7,7 +7,6 @@ export default class PrintSubwayLine extends Component { render() { const { lines } = this.store; - console.log(lines); return `
${lines From 23c580407747d9c6a6e674d42636ab0274d3c400 Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Tue, 15 Dec 2020 14:27:47 +0900 Subject: [PATCH 43/52] =?UTF-8?q?refactor:=20elementMap=20=ED=8C=8C?= =?UTF-8?q?=EC=9D=BC=20=EB=B6=84=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/config.js | 23 +++++++++++++++++++ src/index.js | 62 ++++++++++++++------------------------------------- 2 files changed, 40 insertions(+), 45 deletions(-) create mode 100644 src/config.js diff --git a/src/config.js b/src/config.js new file mode 100644 index 000000000..aeb4b6135 --- /dev/null +++ b/src/config.js @@ -0,0 +1,23 @@ +import LineManager from "./pages/lineManager.js"; +import PrintSubwayLine from "./pages/PrintSubwayLine.js"; +import SectionManager from "./pages/SectionManager.js"; +import StationManager from "./pages/StationManager.js"; + +export const elementMap = [ + { + page: StationManager, + button: document.getElementById("station-manager-button"), + }, + { + page: LineManager, + button: document.getElementById("line-manager-button"), + }, + { + page: SectionManager, + button: document.getElementById("section-manager-button"), + }, + { + page: PrintSubwayLine, + button: document.getElementById("map-print-manager-button"), + }, +]; diff --git a/src/index.js b/src/index.js index e4ae27a05..dc01061c1 100644 --- a/src/index.js +++ b/src/index.js @@ -1,48 +1,20 @@ -import LineManager from "./pages/lineManager.js"; -import PrintSubwayLine from "./pages/PrintSubwayLine.js"; -import SectionManager from "./pages/SectionManager.js"; -import StationManager from "./pages/StationManager.js"; import { dispatchReRender, RE_RENDER_EVENT } from "./utils/events.js"; - -const stationManager = new StationManager(); -const lineManager = new LineManager(); -const sectionManager = new SectionManager(); -const printSubwayLine = new PrintSubwayLine(); - -const pages = document.querySelector("#app"); -let page; - -const stationManagerButton = document.getElementById("station-manager-button"); -const lineManagerButton = document.getElementById("line-manager-button"); -const sectionManagerButton = document.getElementById("section-manager-button"); -const printSubwayLineButton = document.getElementById( - "map-print-manager-button" -); - -stationManagerButton.addEventListener("click", () => { - page = stationManager; - dispatchReRender(); -}); - -lineManagerButton.addEventListener("click", () => { - page = lineManager; - dispatchReRender(); -}); - -sectionManagerButton.addEventListener("click", () => { - page = sectionManager; - dispatchReRender(); -}); - -printSubwayLineButton.addEventListener("click", () => { - page = printSubwayLine; - dispatchReRender(); -}); -function reRenderPage() { - page.create(); - page.afterCreate(); - pages.innerHTML = page.render(); - page.mount(); +import { elementMap } from "./config.js"; +import reRenderPage from "./utils/reRenderPage.js"; + +function init() { + const app = document.querySelector("#app"); + let page; + + elementMap.forEach((element) => { + const managerPage = new element.page(); + element.button.addEventListener("click", () => { + page = managerPage; + dispatchReRender(); + }); + }); + + window.addEventListener(RE_RENDER_EVENT, () => reRenderPage(app, page)); } -window.addEventListener(RE_RENDER_EVENT, reRenderPage); +init(); From f0dd5da5126115a9b40b879deedea93f687a1a86 Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Tue, 15 Dec 2020 14:28:09 +0900 Subject: [PATCH 44/52] =?UTF-8?q?refactor:=20reRenderPage=20=ED=95=A8?= =?UTF-8?q?=EC=88=98=20=ED=8C=8C=EC=9D=BC=20=EB=B6=84=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/utils/reRenderPage.js | 6 ++++++ 1 file changed, 6 insertions(+) create mode 100644 src/utils/reRenderPage.js diff --git a/src/utils/reRenderPage.js b/src/utils/reRenderPage.js new file mode 100644 index 000000000..b7fead00d --- /dev/null +++ b/src/utils/reRenderPage.js @@ -0,0 +1,6 @@ +export default function reRenderPage(app, page) { + page.create(); + page.afterCreate(); + app.innerHTML = page.render(); + page.mount(); +} From 2c0406cd57aaa76d9420bd21f5d1727a73d80dc1 Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Tue, 15 Dec 2020 14:42:16 +0900 Subject: [PATCH 45/52] =?UTF-8?q?refactor:=20=EC=BD=94=EB=93=9C=20?= =?UTF-8?q?=EC=88=9C=EC=84=9C=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/SectionManager.js | 21 ++++++++++----------- 1 file changed, 10 insertions(+), 11 deletions(-) diff --git a/src/pages/SectionManager.js b/src/pages/SectionManager.js index d9c9c5d1c..fca148a9f 100644 --- a/src/pages/SectionManager.js +++ b/src/pages/SectionManager.js @@ -8,6 +8,7 @@ const elementMap = { sectionAddButton: "section-add-button", sectionDeleteButton: "section-delete-button", }; + export default class SectionManager extends Component { constructor() { super(); @@ -20,24 +21,26 @@ export default class SectionManager extends Component { }; this.handleAddButtonClick = (order, station) => { - const { selectedLine } = this.state; - if (order.length === 0) { alert(ERROR.RE_TYPING_ORDER); return; } + + const { selectedLine } = this.state; this.store.lines[selectedLine].stations.splice(order, 0, station); this.setStore(cloneDeep(this.store)); }; this.handleDeleteButtonClick = (index) => { - const stations = this.store.lines[this.state.selectedLine].stations; - if (isLessThanTwoStation(stations)) { - stations.splice(index, 1); - this.setStore(cloneDeep(this.store)); - } else { + const isLessThanTwoStation = stations.length < 2; + if (isLessThanTwoStation) { alert(ERROR.NOT_DELETE); + return; } + + const stations = this.store.lines[this.state.selectedLine].stations; + stations.splice(index, 1); + this.setStore(cloneDeep(this.store)); }; } @@ -152,10 +155,6 @@ export default class SectionManager extends Component { } } -function isLessThanTwoStation(stations) { - return stations.length > 2; -} - function isNull(value) { return String(value) === "null" || String(value) === "undefined"; } From 7ca1c363ebd06b30ceb89bca5282abcdca828caa Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Tue, 15 Dec 2020 14:55:54 +0900 Subject: [PATCH 46/52] =?UTF-8?q?feat:=20=EB=85=B8=EC=84=A0=20=EC=9D=B4?= =?UTF-8?q?=EB=A6=84=20=EA=B3=B5=EB=B0=B1=20=EB=B6=88=EA=B0=80=20=EA=B8=B0?= =?UTF-8?q?=EB=8A=A5=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/LineManager.js | 8 +++++++- src/utils/errors.js | 1 + 2 files changed, 8 insertions(+), 1 deletion(-) diff --git a/src/pages/LineManager.js b/src/pages/LineManager.js index 33067fd81..4425b6fa7 100644 --- a/src/pages/LineManager.js +++ b/src/pages/LineManager.js @@ -57,6 +57,10 @@ export default class LineManager extends Component { mountNameInput() { const lineNameInput = document.getElementById(elementMap.lineNameInput); lineNameInput.addEventListener("blur", (event) => { + if (haveSpaceInLineName(event.target.value)) { + alert(ERROR.RE_TYPING_LINENAME); + return; + } this.setState({ ...this.state, lineName: event.target.value }); }); } @@ -171,4 +175,6 @@ function isDuplicateLine(lines = [], lineName) { return lines.find((line) => line.name === lineName); } -// λ…Έμ„  이름 곡백 λΆˆκ°€λŠ₯ ν•˜λ„λ‘ +function haveSpaceInLineName(lineName) { + return [...lineName].includes(" "); +} diff --git a/src/utils/errors.js b/src/utils/errors.js index 30e1d0541..e1000f94b 100644 --- a/src/utils/errors.js +++ b/src/utils/errors.js @@ -1,6 +1,7 @@ export const ERROR = { RE_TYPING_STATION: "μ—­ 이름을 λ‹€μ‹œ μž…λ ₯ν•΄ μ£Όμ„Έμš”", RE_TYPING_LINE: "μ€‘λ³΅λœ 노선이 μ‘΄μž¬ν•©λ‹ˆλ‹€", + RE_TYPING_LINENAME: "λ…Έμ„  이름에 곡백이 μ‘΄μž¬ν•©λ‹ˆλ‹€", RE_TYPING_ORDER: "μˆœμ„œλ₯Ό μž…λ ₯ν•˜μ„Έμš”", NOT_DELETE: "2개 μ΄ν•˜λŠ” μ§€μšΈ 수 μ—†μŠ΅λ‹ˆλ‹€", }; From ece0d18bff2ae772c673cf18e280789ad11b0bcb Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Tue, 15 Dec 2020 15:06:30 +0900 Subject: [PATCH 47/52] =?UTF-8?q?refactor:=20=EC=BD=94=EB=93=9C=20?= =?UTF-8?q?=EC=88=9C=EC=84=9C=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/utils/events.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/utils/events.js b/src/utils/events.js index 410353ca8..94eb7023b 100644 --- a/src/utils/events.js +++ b/src/utils/events.js @@ -1,4 +1,5 @@ +export { dispatchReRender, RE_RENDER_EVENT, reRenderEvent }; + const RE_RENDER_EVENT = "customRender"; const reRenderEvent = new CustomEvent(RE_RENDER_EVENT); const dispatchReRender = () => window.dispatchEvent(reRenderEvent); -export { dispatchReRender, RE_RENDER_EVENT, reRenderEvent }; From 7ca1db5b2f8a755a16a99e820477204736e0c6ed Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Tue, 15 Dec 2020 16:41:40 +0900 Subject: [PATCH 48/52] Update README.md --- README.md | 86 +++++++++++++++++++------------------------------------ 1 file changed, 29 insertions(+), 57 deletions(-) diff --git a/README.md b/README.md index 0173c7482..8e7a7d8b0 100644 --- a/README.md +++ b/README.md @@ -6,88 +6,60 @@ #### 1) μ—­μ˜ 이름 μœ νš¨μ„± 검사 -- μ€‘λ³΅λœ μ—­ 이름 κΈˆμ§€ -- μ—­ 이름 2κΈ€μž 이상 -- μ—­ 이름 곡백 κΈˆμ§€ -- μ—­ 이름 ν•œκΈ€λ§Œ κ°€λŠ₯ -- μ—­μ˜ 이름 μ˜¬λ°”λ₯΄μ§€ μ•Šμ„ μ‹œ alert λ©”μ‹œμ§€ 좜λ ₯ +- μ€‘λ³΅λœ μ—­μ˜ 이름을 등둝할 수 μ—†λ‹€. +- μ—­μ˜ 이름은 2κΈ€μž μ΄μƒμœΌλ‘œ ν•œλ‹€. +- μ—­μ˜ 이름에 곡백이 λ“€μ–΄κ°ˆ 수 μ—†λ‹€. +- μ—­μ˜ 이름은 ν•œκΈ€λ‘œλ§Œ μž‘μ„± κ°€λŠ₯ν•˜λ‹€. +- μ—­μ˜ 이름이 μ˜¬λ°”λ₯΄μ§€ μ•Šμ„ μ‹œ, alert λ©”μ‹œμ§€ 좜λ ₯ν•œλ‹€. #### 2) μ§€ν•˜μ²  μ—­ λͺ©λ‘ 관리 -- μ—­ 관리 λ²„νŠΌ 클릭 μ‹œ μ—­ 관리 νŽ˜μ΄μ§€ μ—°κ²° -- μ—­ μΆ”κ°€ λ²„νŠΌ 클릭 μ‹œ μ—­ μΆ”κ°€ -- μ—­ μ‚­μ œ λ²„νŠΌ 클릭 μ‹œ μ—­ μ‚­μ œ +- μ—­ 관리 λ²„νŠΌ 클릭 μ‹œ, μ—­ 관리 νŽ˜μ΄μ§€λ₯Ό 좜λ ₯ν•œλ‹€. +- μ—­ μΆ”κ°€ λ²„νŠΌ 클릭 μ‹œ, 역을 μΆ”κ°€ν•œλ‹€. +- μ—­ μ‚­μ œ λ²„νŠΌ 클릭 μ‹œ, 역을 μ‚­μ œν•œλ‹€. +- μ—­μ˜ 좔가와 μ‚­μ œ μ‹œ, μ—­μ˜ λͺ©λ‘μ„ 좜λ ₯ν•œλ‹€. +- μ—­ 관리가 λλ‚œ μ—­μ˜ λͺ©λ‘μ„ λ‘œμ»¬μŠ€ν† λ¦¬μ§€μ— μ €μž₯ν•œλ‹€. ### 2. λ…Έμ„  관리 νŽ˜μ΄μ§€ #### 1) λ…Έμ„ μ˜ 이름 μœ νš¨μ„± 검사 -- μ€‘λ³΅λœ λ…Έμ„  이름 κΈˆμ§€ +- μ€‘λ³΅λœ λ…Έμ„ μ˜ 이름을 등둝할 수 μ—†λ‹€. +- λ…Έμ„ μ˜ 이름에 곡백이 λ“€μ–΄κ°ˆ 수 μ—†λ‹€. +- λ…Έμ„ μ˜ 이름이 μ˜¬λ°”λ₯΄μ§€ μ•Šμ„ μ‹œ, alert λ©”μ‹œμ§€λ₯Ό 좜λ ₯ν•œλ‹€. #### 2) μ§€ν•˜μ²  λ…Έμ„  λͺ©λ‘ 관리 -- λ…Έμ„  관리 λ²„νŠΌ 클릭 μ‹œ λ…Έμ„  관리 νŽ˜μ΄μ§€ μ—°κ²° -- μ§€ν•˜μ²  λ…Έμ„ μ˜ 이름을 μž…λ ₯λ°›λŠ” κΈ°λŠ₯ -- 상행 쒅점을 μž…λ ₯λ°›λŠ” κΈ°λŠ₯ -- ν•˜ν–‰ 쒅점을 μž…λ ₯λ°›λŠ” κΈ°λŠ₯ -- λ…Έμ„  μΆ”κ°€ λ²„νŠΌ 클릭 μ‹œ λ…Έμ„  μΆ”κ°€ -- μ‚­μ œ λ²„νŠΌ 클릭 μ‹œ λ…Έμ„  μ‚­μ œ +- λ…Έμ„  관리 λ²„νŠΌ 클릭 μ‹œ, λ…Έμ„  관리 νŽ˜μ΄μ§€λ₯Ό 좜λ ₯ν•œλ‹€. +- λ…Έμ„  μΆ”κ°€ λ²„νŠΌ 클릭 μ‹œ, 노선을 μΆ”κ°€ν•œλ‹€. +- μ‚­μ œ λ²„νŠΌ 클릭 μ‹œ, 노선을 μ‚­μ œν•œλ‹€. +- λ…Έμ„  좔가와 μ‚­μ œ μ‹œ, λ…Έμ„  λͺ©λ‘μ„ 좜λ ₯ν•˜κ³  λ‘œμ»¬μŠ€ν† λ¦¬μ§€μ— λ…Έμ„  λͺ©λ‘μ„ μ €μž₯ν•œλ‹€. ### 3. ꡬ간 관리 νŽ˜μ΄μ§€ #### 1) λ…Έμ„  선택 -- λ‘œμ»¬μŠ€ν† λ¦¬μ§€μ—μ„œ 노선을 받아와 λ²„νŠΌμœΌλ‘œ 생성 +- λ‘œμ»¬μŠ€ν† λ¦¬μ§€μ—μ„œ 노선을 받아와 λ…Έμ„  메뉴 λ²„νŠΌμ„ μƒμ„±ν•œλ‹€. +- 각 λ…Έμ„ μ˜ λ²„νŠΌμ„ 클릭 μ‹œ, ν•΄λ‹Ή λ…Έμ„ μ˜ 정보λ₯Ό 좜λ ₯ν•œλ‹€. #### 2) μ§€ν•˜μ²  ꡬ간 λͺ©λ‘ 관리 -- 노선에 λ“±λ‘λœ μ—­ 제거 -- 쒅점 제거 μ‹œ λ‹€μŒ 역이 쒅점 -- 노선에 ν¬ν•¨λœ 역이 2개 μ΄ν•˜μΌ λ•Œ, μ—­ 제거 λΆˆκ°€ - -### 4. μ§€ν•˜μ²  노선도 좜λ ₯ - -#### 1) - -- μ§€ν•˜μ²  노선도 좜λ ₯ λ²„νŠΌμ„ λˆ„λ₯΄λ©΄ `
` νƒœκ·Έλ₯Ό λ§Œλ“€κ³  ν•΄λ‹Ή νƒœκ·Έ 내뢀에 노선도λ₯Ό 좜λ ₯ν•œλ‹€. - -## πŸš€ κΈ°λŠ₯ μš”κ΅¬μ‚¬ν•­ - -### μ§€ν•˜μ²  μ—­ κ΄€λ ¨ κΈ°λŠ₯ - -- μ§€ν•˜μ²  역을 λ“±λ‘ν•˜κ³  μ‚­μ œν•  수 μžˆλ‹€. (단, 노선에 λ“±λ‘λœ 역은 μ‚­μ œν•  수 μ—†λ‹€) -- μ€‘λ³΅λœ μ§€ν•˜μ²  μ—­ 이름이 등둝될 수 μ—†λ‹€. -- μ§€ν•˜μ²  역은 2κΈ€μž 이상이어야 ν•œλ‹€. -- μ§€ν•˜μ²  μ—­μ˜ λͺ©λ‘μ„ μ‘°νšŒν•  수 μžˆλ‹€. - -### μ§€ν•˜μ²  λ…Έμ„  κ΄€λ ¨ κΈ°λŠ₯ - -- μ§€ν•˜μ²  노선을 λ“±λ‘ν•˜κ³  μ‚­μ œν•  수 μžˆλ‹€. -- μ€‘λ³΅λœ μ§€ν•˜μ²  λ…Έμ„  이름이 등둝될 수 μ—†λ‹€. -- λ…Έμ„  등둝 μ‹œ 상행 쒅점역과 ν•˜ν–‰ 쒅점역을 μž…λ ₯λ°›λŠ”λ‹€. -- μ§€ν•˜μ²  λ…Έμ„ μ˜ λͺ©λ‘μ„ μ‘°νšŒν•  수 μžˆλ‹€. - -### μ§€ν•˜μ²  ꡬ간 μΆ”κ°€ κΈ°λŠ₯ - - μ§€ν•˜μ²  노선에 ꡬ간을 μΆ”κ°€ν•˜λŠ” κΈ°λŠ₯은 노선에 역을 μΆ”κ°€ν•˜λŠ” κΈ°λŠ₯이라고도 ν•  수 μžˆλ‹€. - - μ—­κ³Ό 역사이λ₯Ό ꡬ간이라 ν•˜κ³  이 κ΅¬κ°„λ“€μ˜ λͺ¨μŒμ΄ 노선이닀. +- μ—­κ³Ό 역사이λ₯Ό ꡬ간이라 ν•˜κ³  이 κ΅¬κ°„λ“€μ˜ λͺ¨μŒμ΄ 노선이닀. - ν•˜λ‚˜μ˜ 역은 μ—¬λŸ¬κ°œμ˜ 노선에 좔가될 수 μžˆλ‹€. - μ—­κ³Ό μ—­ 사이에 μƒˆλ‘œμš΄ 역이 μΆ”κ°€ 될 수 μžˆλ‹€. - λ…Έμ„ μ—μ„œ κ°ˆλž˜κΈΈμ€ 생길 수 μ—†λ‹€. +- 좔가될 μ—­μ˜ 이름과 μˆœμ„œλ₯Ό μž…λ ₯ λ°›λŠ”λ‹€. +- 등둝 λ²„νŠΌ 클릭 μ‹œ, 노선에 역을 μΆ”κ°€ν•œλ‹€. +- λ…Έμ„ μ—μ„œ 제거 λ²„νŠΌ 클릭 μ‹œ, 노선에 역을 μ œκ±°ν•œλ‹€. +- λ…Έμ„ μ˜ 등둝과 제거 μ‹œ, ꡬ간 λͺ©λ‘μ„ 좜λ ₯ν•˜κ³  λ‘œμ»¬μŠ€ν† λ¦¬μ§€μ— λ…Έμ„  λͺ©λ‘μ„ μ €μž₯ν•œλ‹€. +- 쒅점 제거 μ‹œ λ‹€μŒ 역이 쒅점이 λœλ‹€. +- 노선에 ν¬ν•¨λœ 역이 2개 μ΄ν•˜μΌ λ•Œ, 역을 μ œκ±°ν•  수 μ—†λ‹€. +- μΆ”κ°€ν•  μ—­μ˜ μˆœμ„œλ₯Ό μž…λ ₯ν•˜μ§€ μ•ŠμœΌλ©΄ alertλ©”μ‹œμ§€λ₯Ό 좜λ ₯ν•œλ‹€. - - -### μ§€ν•˜μ²  ꡬ간 μ‚­μ œ κΈ°λŠ₯ - -- 노선에 λ“±λ‘λœ 역을 μ œκ±°ν•  수 μžˆλ‹€. -- 쒅점을 μ œκ±°ν•  경우 λ‹€μŒ 역이 쒅점이 λœλ‹€. -- 노선에 ν¬ν•¨λœ 역이 λ‘κ°œ μ΄ν•˜μΌ λ•ŒλŠ” 역을 μ œκ±°ν•  수 μ—†λ‹€. - - - -### μ§€ν•˜μ²  노선에 λ“±λ‘λœ μ—­ 쑰회 κΈ°λŠ₯ +### 4. μ§€ν•˜μ²  노선도 좜λ ₯ -- λ…Έμ„ μ˜ 상행 쒅점뢀터 ν•˜ν–‰ μ’…μ κΉŒμ§€ μ—°κ²°λœ μˆœμ„œλŒ€λ‘œ μ—­ λͺ©λ‘μ„ μ‘°νšŒν•  수 μžˆλ‹€. +- λ‘œμ»¬μŠ€ν† λ¦¬μ§€μ— μ €μž₯된 노선도λ₯Ό 화면에 좜λ ₯ν•œλ‹€.
From ba654483a00e40a6963be5551cf1effe9d8ece8e Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Tue, 15 Dec 2020 17:41:22 +0900 Subject: [PATCH 49/52] Update README.md --- README.md | 40 ++++++++++++++++++++++++++++++++++++++++ 1 file changed, 40 insertions(+) diff --git a/README.md b/README.md index 8e7a7d8b0..97dc32a81 100644 --- a/README.md +++ b/README.md @@ -1,5 +1,39 @@ # πŸš‡ μ§€ν•˜μ²  노선도 λ―Έμ…˜ +## 🚦 디렉토리 ꡬ쑰 +``` +β”œβ”€β”€ LICENSE +β”œβ”€β”€ README.md +β”œβ”€β”€ images +β”‚ β”œβ”€β”€ line_manager.gif +β”‚ β”œβ”€β”€ map_print_manager.gif +β”‚ β”œβ”€β”€ section1.png +β”‚ β”œβ”€β”€ section2.png +β”‚ β”œβ”€β”€ section_manager.gif +β”‚ └── station_manager.gif +β”œβ”€β”€ index.html +└── src + β”œβ”€β”€ config.js + β”œβ”€β”€ core + β”‚ └── Component.js + β”œβ”€β”€ index.js + β”œβ”€β”€ pages + β”‚ β”œβ”€β”€ LineManager.js + β”‚ β”œβ”€β”€ PrintSubwayLine.js + β”‚ β”œβ”€β”€ SectionManager.js + β”‚ └── StationManager.js + └── utils + β”œβ”€β”€ errors.js + β”œβ”€β”€ events.js + └── reRenderPage.js +``` +- config: 전체 νŽ˜μ΄μ§€μ— ν•„μš”ν•œ νƒœκ·Έλ₯Ό λ”°λ‘œ κ΄€λ¦¬ν•˜κΈ° μœ„ν•΄ μ„€μ • 파일둜 뢄리 +- core: μƒνƒœλ‘œ HTML을 λ Œλ”λ§ν•˜κΈ° μœ„ν•΄ μ‚¬μš©λ˜λŠ” λ©”μ„œλ“œλ“€μ„ μ»΄ν¬λ„ŒνŠΈ 클래슀λ₯Ό μ‚¬μš©ν•˜μ—¬ μ •μ˜ +- pages: 각각의 화면듀을 ν•œ ν΄λ”μ—μ„œ κ΄€λ¦¬ν•˜κΈ° μœ„ν•΄ pages 폴더에 뢄리 +- utils: μ—λŸ¬λ©”μ‹œμ§€, 이벀트, νŽ˜μ΄μ§€λ₯Ό λ‹€μ‹œ κ·Έλ €μ£ΌλŠ” ν•¨μˆ˜λ₯Ό utils 폴더에 뢄리 + +
+ ## πŸš€ κΈ°λŠ₯ μš”κ΅¬μ‚¬ν•­ ### 1. μ—­ 관리 νŽ˜μ΄μ§€ @@ -63,6 +97,12 @@
+## πŸ₯Š λ―Έν‘ν–ˆλ˜ 점 + +- [data]: ν˜„μž¬ κ΅¬μ‘°μ—μ„œ μ–΄λ–»κ²Œ [data]속성을 μ‚¬μš©ν•΄μ•Ό ν• μ§€ νŒŒμ•…μ„ ν•˜μ§€ λͺ»ν–ˆμŠ΅λ‹ˆλ‹€. + +
+ ## πŸ’» ν”„λ‘œκ·Έλž¨ μ‹€ν–‰ κ²°κ³Ό ### 역관리 From c1689ff5092019f9ec566f8cda6e9e17e84e4b9b Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Tue, 15 Dec 2020 17:44:57 +0900 Subject: [PATCH 50/52] =?UTF-8?q?fix:=20=EB=85=B8=EC=84=A0=20=EC=B6=9C?= =?UTF-8?q?=EB=A0=A5=20=ED=99=94=EB=A9=B4=EC=9D=98=20=ED=83=9C=EA=B7=B8?= =?UTF-8?q?=EC=97=90=20=ED=81=B4=EB=9E=98=EC=8A=A4=EB=A5=BC=20map=EC=9C=BC?= =?UTF-8?q?=EB=A1=9C=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/PrintSubwayLine.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/PrintSubwayLine.js b/src/pages/PrintSubwayLine.js index d0dceed43..8113cd70f 100644 --- a/src/pages/PrintSubwayLine.js +++ b/src/pages/PrintSubwayLine.js @@ -8,7 +8,7 @@ export default class PrintSubwayLine extends Component { render() { const { lines } = this.store; return ` -
+
${lines .map( (line) => ` From 35c8cff6b9260eebfd50f2a4e720b75dca698d36 Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Tue, 15 Dec 2020 19:18:44 +0900 Subject: [PATCH 51/52] Update README.md --- README.md | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index 97dc32a81..34a400c7b 100644 --- a/README.md +++ b/README.md @@ -97,9 +97,19 @@
-## πŸ₯Š λ―Έν‘ν–ˆλ˜ 점 +## πŸ₯Š λ―Έν‘ν–ˆλ˜ 점 & κ³ μƒν–ˆλ˜ 점 - [data]: ν˜„μž¬ κ΅¬μ‘°μ—μ„œ μ–΄λ–»κ²Œ [data]속성을 μ‚¬μš©ν•΄μ•Ό ν• μ§€ νŒŒμ•…μ„ ν•˜μ§€ λͺ»ν–ˆμŠ΅λ‹ˆλ‹€. +- μƒˆλ‘œμš΄ ꡬ쑰둜 코딩을 ν•˜λ‹€ λ³΄λ‹ˆ λ§‰νžˆλŠ” 뢀뢄이 λ§Žμ•˜κ³ , 그둜 인해 μ‹œκ°„μ— 쫓겨 더 λ§Žμ€ μ˜ˆμ™Έμ‚¬ν•­μ— λŒ€ν•œ 고민이 λΆ€μ‘±ν–ˆμŠ΅λ‹ˆλ‹€. +- μƒνƒœκ°€ λ³€ν•  λ•Œ λ§ˆλ‹€ 전체 화면을 λ Œλ”λ§ν•˜λŠ” ꡬ쑰둜 코딩을 ν•˜μ—¬, λ³€ν™”ν•˜μ§€ μ•ŠλŠ” 뢀뢄도 λ‹€μ‹œ κ·Έλ €μ•Ό ν–ˆμŠ΅λ‹ˆλ‹€. +- 각 νŽ˜μ΄μ§€λ§ˆλ‹€ ν•˜λ‚˜μ˜ 클래슀 μ•ˆμ— λ§Žμ€ λ©”μ„œλ“œκ°€ μ‘΄μž¬ν•˜μ—¬ 읽기 λΆˆνŽΈν•˜λ‹€κ³  생각이 λ“€μ—ˆμŠ΅λ‹ˆλ‹€. +- eslint와 prettier의 μ…‹νŒ…μ„ μ—λ””ν„°μ—μ„œλ§Œ μ„€μ •ν•˜κ³ , 파일둜 λ³Ό 수 μžˆλ„λ‘ ν•˜μ§€ λͺ»ν•œ 점이 μ•„μ‰½μŠ΅λ‹ˆλ‹€. +- 더 효율적인 μ½”λ“œλ₯Ό μž‘μ„±ν•˜μ§€ λͺ»ν•˜κ³ , λ‹¨μˆœνžˆ 15라인을 λ„˜μ§€ μ•ŠκΈ° μœ„ν•΄ μ–΅μ§€λ‘œ λΆ„λ¦¬ν•œ λ“―ν•œ 뢀뢄이 μžˆμ–΄ μ•„μ‰½μŠ΅λ‹ˆλ‹€. +- μ–΄λ– ν•œ 이유둜 μ—λŸ¬λ©”μ‹œμ§€κ°€ 화면에 뜬 건지 μƒν™©λ§ˆλ‹€ 더 λͺ…ν™•ν•˜κ²Œ μ„€λͺ…을 ν•˜μ§€ λͺ»ν–ˆμŠ΅λ‹ˆλ‹€. λ‹€λ₯Έ λΆ„μ˜ pr을 보고 try catch문을 μ‚¬μš©ν•˜λ©΄ 더 λͺ…ν™•ν•˜κ²Œ μ„€λͺ…을 ν•  수 μžˆλ‹€λŠ” 것을 배울 수 μžˆμ—ˆμŠ΅λ‹ˆλ‹€. +- map으둜 화면을 그릴 λ•Œ, 화면에 계속 μ˜λ„μΉ˜ μ•Šμ€ ν…μŠ€νŠΈκ°€ λ°œμƒν•˜μ—¬ 원인을 μ°ΎλŠ”λ° κ½€ 였래 κ±Έλ ΈμŠ΅λ‹ˆλ‹€. 결과적으둜 배열인데 join을 μ‚¬μš©ν•˜μ§€ μ•Šμ•„ λ°œμƒν•œ λ¬Έμ œμ˜€μŠ΅λ‹ˆλ‹€. +- ν…œν”Œλ¦Ώ λ¦¬ν„°λŸ΄μ„ μ‚¬μš©ν•΄ 일일히 화면을 그리닀 λ³΄λ‹ˆ νƒœκ·Έλ“€μ„ μž‘μ„±ν•˜λŠ”λ° ν—·κ°ˆλ¦¬λŠ” 뢀뢄이 λ§Žμ•„ κ³ μƒν–ˆμŠ΅λ‹ˆλ‹€. ν™•μž₯도ꡬλ₯Ό μ΄μš©ν•˜μ—¬ 더 νŽΈν•˜κ²Œ ν•  수 μžˆλ‹€λŠ” 것을 λ‚˜μ€‘μ— μ•Œκ²Œ λ˜μ—ˆμŠ΅λ‹ˆλ‹€. +- μ–΄λ–€ 값을 μƒμˆ˜λ‘œ 관리해야 ν•˜λŠ” μ§€ νŒλ‹¨ν•˜λŠ” 것이 μ–΄λ €μ› μŠ΅λ‹ˆλ‹€. ν•¨μˆ˜μ•ˆμ—μ„œλ§Œ μ‚¬μš©ν•˜κ³  μ˜λ―Έκ°€ λͺ…ν™•ν•΄ λ³΄μ΄λŠ” 값듀도 μƒμˆ˜ 처리 ν•΄μ•Ό ν•˜λŠ” μ§€ 의문이 λ“€μ—ˆμŠ΅λ‹ˆλ‹€. +- 상행쒅점과 ν•˜ν–‰μ’…μ μ˜ 값을 μ €μž₯ν•  λ•Œ ν•˜λ‚˜μ˜ 배열에 μ €μž₯ν•˜μ§€ μ•Šκ³  λ”°λ‘œ μ €μž₯ν–ˆμŠ΅λ‹ˆλ‹€. 그둜 인해 κ΅¬κ°„μ—μ„œ λͺ©λ‘μ„ μΆ”κ°€ν•˜κ³  μ‚­μ œν•  λ•Œ, 데이터 λ³€κ²½ν•˜λŠ” 뢀뢄이 λ„ˆλ¬΄ μ–΄λ €μ› μŠ΅λ‹ˆλ‹€. κ²°κ΅­ λ‹€μ‹œ λŒμ•„κ°€ 두 값듀을 ν•˜λ‚˜μ˜ λ°°μ—΄λ‘œ κ΄€λ¦¬ν•˜λ„λ‘ μˆ˜μ •ν•˜μ˜€κ³ , 문제λ₯Ό ν•΄κ²°ν•  수 μžˆμ—ˆμŠ΅λ‹ˆλ‹€.
From e2b903cc2bc7111b97522c782ba9531c2ed8ad3d Mon Sep 17 00:00:00 2001 From: JinsuBaek <71721270+junsubaek@users.noreply.github.com> Date: Tue, 15 Dec 2020 19:21:37 +0900 Subject: [PATCH 52/52] Update README.md --- README.md | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/README.md b/README.md index 34a400c7b..46040b0eb 100644 --- a/README.md +++ b/README.md @@ -44,7 +44,7 @@ - μ—­μ˜ 이름은 2κΈ€μž μ΄μƒμœΌλ‘œ ν•œλ‹€. - μ—­μ˜ 이름에 곡백이 λ“€μ–΄κ°ˆ 수 μ—†λ‹€. - μ—­μ˜ 이름은 ν•œκΈ€λ‘œλ§Œ μž‘μ„± κ°€λŠ₯ν•˜λ‹€. -- μ—­μ˜ 이름이 μ˜¬λ°”λ₯΄μ§€ μ•Šμ„ μ‹œ, alert λ©”μ‹œμ§€ 좜λ ₯ν•œλ‹€. +- μ—­μ˜ 이름이 μ˜¬λ°”λ₯΄μ§€ μ•Šμ„ μ‹œ, `alert` λ©”μ‹œμ§€λ₯Ό 좜λ ₯ν•œλ‹€. #### 2) μ§€ν•˜μ²  μ—­ λͺ©λ‘ 관리 @@ -60,7 +60,7 @@ - μ€‘λ³΅λœ λ…Έμ„ μ˜ 이름을 등둝할 수 μ—†λ‹€. - λ…Έμ„ μ˜ 이름에 곡백이 λ“€μ–΄κ°ˆ 수 μ—†λ‹€. -- λ…Έμ„ μ˜ 이름이 μ˜¬λ°”λ₯΄μ§€ μ•Šμ„ μ‹œ, alert λ©”μ‹œμ§€λ₯Ό 좜λ ₯ν•œλ‹€. +- λ…Έμ„ μ˜ 이름이 μ˜¬λ°”λ₯΄μ§€ μ•Šμ„ μ‹œ, `alert` λ©”μ‹œμ§€λ₯Ό 좜λ ₯ν•œλ‹€. #### 2) μ§€ν•˜μ²  λ…Έμ„  λͺ©λ‘ 관리 @@ -89,7 +89,7 @@ - λ…Έμ„ μ˜ 등둝과 제거 μ‹œ, ꡬ간 λͺ©λ‘μ„ 좜λ ₯ν•˜κ³  λ‘œμ»¬μŠ€ν† λ¦¬μ§€μ— λ…Έμ„  λͺ©λ‘μ„ μ €μž₯ν•œλ‹€. - 쒅점 제거 μ‹œ λ‹€μŒ 역이 쒅점이 λœλ‹€. - 노선에 ν¬ν•¨λœ 역이 2개 μ΄ν•˜μΌ λ•Œ, 역을 μ œκ±°ν•  수 μ—†λ‹€. -- μΆ”κ°€ν•  μ—­μ˜ μˆœμ„œλ₯Ό μž…λ ₯ν•˜μ§€ μ•ŠμœΌλ©΄ alertλ©”μ‹œμ§€λ₯Ό 좜λ ₯ν•œλ‹€. +- μΆ”κ°€ν•  μ—­μ˜ μˆœμ„œλ₯Ό μž…λ ₯ν•˜μ§€ μ•ŠμœΌλ©΄ `alert` λ©”μ‹œμ§€λ₯Ό 좜λ ₯ν•œλ‹€. ### 4. μ§€ν•˜μ²  노선도 좜λ ₯ @@ -106,7 +106,7 @@ - eslint와 prettier의 μ…‹νŒ…μ„ μ—λ””ν„°μ—μ„œλ§Œ μ„€μ •ν•˜κ³ , 파일둜 λ³Ό 수 μžˆλ„λ‘ ν•˜μ§€ λͺ»ν•œ 점이 μ•„μ‰½μŠ΅λ‹ˆλ‹€. - 더 효율적인 μ½”λ“œλ₯Ό μž‘μ„±ν•˜μ§€ λͺ»ν•˜κ³ , λ‹¨μˆœνžˆ 15라인을 λ„˜μ§€ μ•ŠκΈ° μœ„ν•΄ μ–΅μ§€λ‘œ λΆ„λ¦¬ν•œ λ“―ν•œ 뢀뢄이 μžˆμ–΄ μ•„μ‰½μŠ΅λ‹ˆλ‹€. - μ–΄λ– ν•œ 이유둜 μ—λŸ¬λ©”μ‹œμ§€κ°€ 화면에 뜬 건지 μƒν™©λ§ˆλ‹€ 더 λͺ…ν™•ν•˜κ²Œ μ„€λͺ…을 ν•˜μ§€ λͺ»ν–ˆμŠ΅λ‹ˆλ‹€. λ‹€λ₯Έ λΆ„μ˜ pr을 보고 try catch문을 μ‚¬μš©ν•˜λ©΄ 더 λͺ…ν™•ν•˜κ²Œ μ„€λͺ…을 ν•  수 μžˆλ‹€λŠ” 것을 배울 수 μžˆμ—ˆμŠ΅λ‹ˆλ‹€. -- map으둜 화면을 그릴 λ•Œ, 화면에 계속 μ˜λ„μΉ˜ μ•Šμ€ ν…μŠ€νŠΈκ°€ λ°œμƒν•˜μ—¬ 원인을 μ°ΎλŠ”λ° κ½€ 였래 κ±Έλ ΈμŠ΅λ‹ˆλ‹€. 결과적으둜 배열인데 join을 μ‚¬μš©ν•˜μ§€ μ•Šμ•„ λ°œμƒν•œ λ¬Έμ œμ˜€μŠ΅λ‹ˆλ‹€. +- map으둜 화면을 그릴 λ•Œ, 화면에 계속 μ˜λ„μΉ˜ μ•Šμ€ ν…μŠ€νŠΈκ°€ λ°œμƒν•˜μ—¬ 원인을 μ°ΎλŠ”λ° κ½€ 였래 κ±Έλ ΈμŠ΅λ‹ˆλ‹€. 결과적으둜 배열인데 `join` 을 μ‚¬μš©ν•˜μ§€ μ•Šμ•„ λ°œμƒν•œ λ¬Έμ œμ˜€μŠ΅λ‹ˆλ‹€. - ν…œν”Œλ¦Ώ λ¦¬ν„°λŸ΄μ„ μ‚¬μš©ν•΄ 일일히 화면을 그리닀 λ³΄λ‹ˆ νƒœκ·Έλ“€μ„ μž‘μ„±ν•˜λŠ”λ° ν—·κ°ˆλ¦¬λŠ” 뢀뢄이 λ§Žμ•„ κ³ μƒν–ˆμŠ΅λ‹ˆλ‹€. ν™•μž₯도ꡬλ₯Ό μ΄μš©ν•˜μ—¬ 더 νŽΈν•˜κ²Œ ν•  수 μžˆλ‹€λŠ” 것을 λ‚˜μ€‘μ— μ•Œκ²Œ λ˜μ—ˆμŠ΅λ‹ˆλ‹€. - μ–΄λ–€ 값을 μƒμˆ˜λ‘œ 관리해야 ν•˜λŠ” μ§€ νŒλ‹¨ν•˜λŠ” 것이 μ–΄λ €μ› μŠ΅λ‹ˆλ‹€. ν•¨μˆ˜μ•ˆμ—μ„œλ§Œ μ‚¬μš©ν•˜κ³  μ˜λ―Έκ°€ λͺ…ν™•ν•΄ λ³΄μ΄λŠ” 값듀도 μƒμˆ˜ 처리 ν•΄μ•Ό ν•˜λŠ” μ§€ 의문이 λ“€μ—ˆμŠ΅λ‹ˆλ‹€. - 상행쒅점과 ν•˜ν–‰μ’…μ μ˜ 값을 μ €μž₯ν•  λ•Œ ν•˜λ‚˜μ˜ 배열에 μ €μž₯ν•˜μ§€ μ•Šκ³  λ”°λ‘œ μ €μž₯ν–ˆμŠ΅λ‹ˆλ‹€. 그둜 인해 κ΅¬κ°„μ—μ„œ λͺ©λ‘μ„ μΆ”κ°€ν•˜κ³  μ‚­μ œν•  λ•Œ, 데이터 λ³€κ²½ν•˜λŠ” 뢀뢄이 λ„ˆλ¬΄ μ–΄λ €μ› μŠ΅λ‹ˆλ‹€. κ²°κ΅­ λ‹€μ‹œ λŒμ•„κ°€ 두 값듀을 ν•˜λ‚˜μ˜ λ°°μ—΄λ‘œ κ΄€λ¦¬ν•˜λ„λ‘ μˆ˜μ •ν•˜μ˜€κ³ , 문제λ₯Ό ν•΄κ²°ν•  수 μžˆμ—ˆμŠ΅λ‹ˆλ‹€.