[14기 김동영] step2 - 상태 관리로 메뉴 관리하기#288
Open
pers0n4 wants to merge 14 commits into
Open
Conversation
dhrod0325
reviewed
Jul 26, 2022
dhrod0325
left a comment
dhrod0325
left a comment
There was a problem hiding this comment.
안녕하세요 동영님!
웹 컴포넌트로 깔끔하게 잘 만드셨네요. 많이 배웠어요! 👍
너무 잘 작성하셔서 남길게 별로 없네요... ㅠ
고생하셨습니다!
Comment on lines
+23
to
+31
| try { | ||
| const value = storage.getItem(key); | ||
| if (typeof value !== "string") { | ||
| throw new TypeError(`${key} is not a string`); | ||
| } | ||
| return JSON.parse(value); | ||
| } catch { | ||
| return defaultValue; | ||
| } |
There was a problem hiding this comment.
string이 아닌 키가 들어오면 defaultValue로 인한 오동작은 처리할 방법이 없을 것 같아요..! throw new TypeError만 던지고 try catch는 사용하는 부분에서 처리하거나 string이 아닌 키가 들어올땐 콘솔로 경고를 찍고 기본값을 리턴하는 구조는 어떨까요~?
| this.isSoldOut = isSoldOut; | ||
| } | ||
|
|
||
| attributeChangedCallback(name, _oldValue, newValue) { |
There was a problem hiding this comment.
attributeChangedCallback 으로 처리하니 로직이 굉장히 심플해 지는 것 같네요. 저도 다음에 사용해봐야겠어요!👍
Comment on lines
+144
to
+149
| ...this.#state.menuList.slice(0, index), | ||
| { | ||
| name: menuItem.name, | ||
| isSoldOut: menuItem.isSoldOut, | ||
| }, | ||
| ...this.#state.menuList.slice(index + 1), |
There was a problem hiding this comment.
이 부분은 중복으로 사용되고 있는거 같은데 함수화 해서 사용하는건 어떨까요~?
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Checklist
sold-outclass를 추가하여 상태를 변경한다.Description
function형태로 선언되었던App을class로 변환MenuItem을App의 상태에 따라 렌더하도록 변경MenuItem품절 속성 추가Additional
App에서rendermethod를 호출할 때menuList의 모든children을replaceChildren으로 교체하는데, 일부분만 수정이 필요한 경우 어떻게 최적화를 진행할 수 있을까App.js에 집중되는 중menuForm,menuList,menuCount,categoryTitleelement 등을 별도의 컴포넌트로 선언함으로써 책임을 분리하는 방향으로 진행하는게 좋을 듯Demo
https://pers0n4.github.io/moonbucks-menu/