See the Pen Untitled by youngwan2 (@youngwan2) on CodePen.
간편하게 날짜 간격을 구할 수 있는 코드. 누가 봐도 단순한 기능 구현에 4일이 걸렸다.. 분명 이 코드에도 문제가 있을 가능성이 높지만, 지금의 수준에서는 이 이상 완벽할 수는 없다는 생각이 든다. (향후 실력이 더 쌓이고, 다시 손보러 와야 겠다.)
코드 자체는 단순했고, 자바스크립트 상에서 콘솔창으로 출력해 내는 것은 쉽게 간단했지만, 이를 웹 페이지 상에 나타내도록 코드를 구상하는 데 많은 시간이 걸렸다. 이론적인 부분만을 공부했을 때는 이거 너무 쉬운거 아니야? 라고 생각했었는데
, 막상 아무런 설명도 없이 혼자 이리저리 짜보려고 하니 마음대로 되지 않았다. 특히,, 이벤트 참조 오류와 null 값, 숫자가 아니야! 라는 에러 코드가 밥 먹듯이 떳고, 도대체 무슨 소린지 모르겠어서 멘탈 붕괴가 왔지만, 그래도 꾸역꾸역 이를 해결하기 위해 사방팔방 구글링을 했음에도 해결 되지 않다니,..
그렇게 4일 차가 되던 날, 기존에 작성하던 모든 코드를 지우고 다시 작성하기 시작했다. 우선적으로 본인의 시각에서는 절대 보이지 않는 부분에서 문제가 발생했음을 알기 때문에, 어떠한 방식으로 코드가 변수에 저장되고, 이 변수에 저장된 값이 어떤 원리에 따라서 다른 코드에 호출되어 출력되는지, 나름 골머리를 써가며 오류가 나지 않으면서 간단하게 프로그램을 구현할 수 있는 코드를 짜려고 노력했다.
그렇게 2시간이 흘러서 나온 결과물, 나름 오랫동안 고생해서 짜본 코드였지만 막상 보니 초라함이 가득 묻어 나오는 코드였다. 만일 내가 이 코드를 쓴 사람을 봤다면, 저걸 짜는 데 저렇게 오래걸린다고? 라고 느낄 수 있을 정도의 초라함이 말이다. 하지만, 이러한 경험을 통해서 한 가지를 깨달았다. 무엇이든 직접 해봐야 안다. 라는 사실을 말이다.
그냥 눈으로 보고 이해하는 것은 누구나 할 수 있다. 하지만, 그런 단순해 보이는 것도 실제 혼자서 해보려고 하면 해결이 어려울 수 있다는 점. 코드의 작동 원리를 제대로 이해하지 못한다면 단순해 보이는 것도 4일이나 잡아먹을 수 있다는 점을 명심해두고 조금씩 보완하여 실력을 쌓아 나가야 겠다.
'자바스크립트' 카테고리의 다른 글
[js입문] 계산기 만들기 (0) | 2022.09.28 |
---|---|
[입문] 체크박스 속성 값 for 문 이용해서 확인하기 (0) | 2022.09.23 |
[입문] 클릭 이벤트로 버튼 요소 클릭 시 입력한 텍스트가 붙여넣기 되도록 하기? (0) | 2022.09.22 |
[입문] 이벤트 함수를 이용해서 애니메이션 시작과 정지 버튼 만들기 (0) | 2022.09.13 |
[입문] onkeypress 속성을 활용하여 따라 써지는 텍스트 구현하기 (0) | 2022.09.12 |