까막눈코딩

1. 배경 지난번에 보완하기로 했던 내용들 중 일부를 보완했다. 2. 변수의 범위 제한 - 사용자가 입력할 수 있는 year, month, date의 범위를 실제 달력과 일치하게 제한해야 할 필요가 있다. 이 경우, 범위를 벗어나는 경우, 확인 버튼을 누르지 않아도 경고 메시지가 출력되도록 하고 싶다. - 변수의 범위를 제한할 때는 if문을 이용해 제한하는 수밖에 없다고 한다. 그러므로 애초부터 input type에 text가 아닌 date를 줘서 날짜를 받아오는 편이 좋아 보인다. 다만, 처음 구상했던 내용과는 다르기 때문에 조금 더 생각해 볼 필요가 있다. 3. 메시지 출력창 단일화 - 사용자가 값을 입력하는 만큼 결과 메시지가 출력되는 문제를 해결해야 한다. - 위 문제점은 innerHTML을 사용..

Experience/[Javascript] Age Calculator 2021. 4. 20. 16:31

1. 배경 이전에 만든 Age calculator를 몇 번 실행시켜본 결과, 다음과 같은 문제점이 발생했다. - 현재 날짜 기준으로 생일이 지난 경우, yyyy-year 값을 리턴해야 하는데 여전히 yyyy-year-1 값을 리턴했다. - 나이의 한도를 0~150세로 잡고 싶다. - innerHTML은 보안상의 이유로 쓰지 않는 것이 좋다고 한다. 2. Refactoring: parseInt(string, n) const today = new Date(); const dd = String(today.getDate()).padStart(2, '0'); const mm = String(today.getMonth() + 1).padStart(2, '0'); const yyyy = today.getFullYea..

Experience/[Javascript] Age Calculator 2021. 4. 18. 01:16

정말 간단한 기능이고 최종 완성 단계도 아니지만, 처음으로 혼자서 생각하고 만들어낸 결과물이라 몹시 뿌듯하다. 1. HTML 생년월일을 입력해 주세요 년 월 일 2. CSS :root { /* color */ --color-black: #2c3e50; --color-white: #ecf0f1; /* size */ --size-20px: 20px; --size-5px: 5px; } body { background-color: var(--color-black); color: var(--color-white); text-align: center; } .comment { margin-top: calc(var(--size-20px)*5); font-size: var(--size-20px); } .input { d..

Experience/[Javascript] Age Calculator 2021. 4. 9. 14:27

1. 배경 일본인과 관계를 만들어 가면서 만 나이를 사용하다 보니, 종종 내가 몇 살인지 헷갈릴 때가 있다. 그렇지 않아도 나이가 들수록 내가 몇 살인지 의식하지 않는 경향이 커졌는데, 그나마도 만 나이와 한국 나이를 바꿔 가면서 이야기하다 보니 헷갈리게 되는 듯하다. 구조도 간단하여 초보자 레벨에서 시도해 보기 좋다고 여겨 도전해 보려고 한다. 2. 구조 아직 배운 것이 HTML, CSS, Javascript, python 정도이고 깊이가 얕다. 현재 가진 지식으로 웹 앱을 만들 것이다. 이런 간단한 페이지에서 생년월일 값을 입력받아서 이런 간단한 결과 창을 띄우고, 이전 화면으로 돌아갈 수 있도록 만들고자 한다. 만 나이를 계산하는 정말 간단한 로직이다. 한국 나이는 생일과 관계없이 '현재 year ..

Experience/[Javascript] Age Calculator 2021. 4. 8. 10:57