Conversation
|
수고 많이 하셨습니다~~~ 깃은.... 알다가도 모르는 것. 열심히 이것저것 깃 이슈에 부딫혀보고 많이 경험해보는 거 밖에 없을 것 같네요ㅜㅜ/... 궁금한 점은 무슨 말인지 잘 이해가 가지 않네요... 일단 얘기를 좀 해보자면 로컬 스토리지의 데이터는 프론트에서 백엔드로 넘겨주지 않는 이상 백엔드에서 처리할 수 없습니다. 궁금증이 조금은 풀리셨는지 모르겠네요.. 궁금한게 더 있으시다면 카톡으로 해주세요!! 질문은 완전 환영이에요~~ 저는 마감기한을 지키는 것이 가장 기본이자 중요하다고 생각하는 것 중 하나에요. 여러분도 그 중요성을 깨닫길 바래서 강조를 했던 부분인데 사실 조금 실망했습니다..ㅜ 다음부터는 꼭! 제출기한을 지키도록 합시다~~ |
| return {a, mark, b}; | ||
| } | ||
|
|
||
| const calculate = ({a, mark, b}) => { |
There was a problem hiding this comment.
이야 이렇게 함수를 나눠서 props로 입력한 값들을 받아서 처리하다니... 너무 대단한데요 완전칭찬합니다ㅠㅠㅠ
| alert(`${a} ${mark} ${b} = ${result}`); | ||
| } | ||
|
|
||
| calculate(getInput()); No newline at end of file |
There was a problem hiding this comment.
하지만 1단계부터 4단계까지의 과정들이 좀 더 있었으면 좋았을 것 같아요!!
| @@ -0,0 +1,84 @@ | |||
| class TodoBlock extends HTMLElement { | |||
There was a problem hiding this comment.
extends HTMLElement는 왜 하신건가요???
| } | ||
|
|
||
| render() { | ||
| this.shadowRoot.innerHTML = ` |
There was a problem hiding this comment.
shadowRoot는 숨겨진 DOM트리라는 뜻으로
shadowRoot 안에서 만들어진 설정들이 외부의 설정에 영향을 안 받는다라는 특징이 있습니다
| } | ||
| } | ||
|
|
||
| customElements.define('todo-block', TodoBlock); |
There was a problem hiding this comment.
customElements.define('생성할 태그명', 연결할클래스);
이런 구조이고 웹 컴포넌트를 정의하기 위해 사용했습니다
| const todoSection = document.getElementById('todo-section'); | ||
|
|
||
| /** | ||
| * 계획추가하기 함수 |
| body { | ||
| width: 100vw; | ||
| height: 100vh; | ||
| background-color: rgb(24, 23, 23); |
There was a problem hiding this comment.
rgb보다는 색상코드를 사용하는게 좋을 것 같습니다.
| @@ -1 +1,32 @@ | |||
| // Mission 1 | |||
| const getInput = () => { | |||
| let a = parseInt(prompt(" 첫번째 숫자를 입력하세요.")); | |||
There was a problem hiding this comment.
변수명을 네이밍 할 때 a, b와 같은 의미없는 변수명으로 네이밍 하지 마시고 firstInput과 같은 명시적인 변수명으로 지어주세요
| margin: 0px auto; | ||
| max-width: 600px; | ||
| background-color: #fff; | ||
| min-height: 100dvh; |
There was a problem hiding this comment.
dvh (Dynamic Viewport Height)입니다
max-height : 100vh으로 하니 todo가 생성될 때 하얀배경의 높이도 같이 늘어나야하는데 안 되어서
현재 보여지는 뷰포트 높이를 동적으로 가져오는 dvh를 사용했습니다
|
|
||
| main { | ||
| margin: 0px auto; | ||
| max-width: 600px; |
|
피드백 내용 수정했습니다 |
2 participants
느낌표 두 개로 처리할 수 있다는 것이 신기했습니다. 또 유저에게 어떻게 데이터를 저장하는지 궁금했는데, 로컬스토리지를 배우며 웹 브라우저에서 데이터를 클라이언트 측에 간편하게 저장할 수 있는 방법을 알게 되었습니다. 로컬스토리지는 서버와의 통신 없이도 사용자의 환경을 저장할 수 있다는 것이 흥미로웠습니다.
제출이 늦어진 점과 연락드리지 못한 점에 대해 사과드립니다 죄송합니다