1. 결과물 URL + 캡쳐 이미지 2~3장

https://woochanleee.github.io/todo-list/ 

2. 자기소개

안녕하세요.👋 03년생 19살 고등학생 입니다.😁

하드웨어에 처음 관심을 갖고 시작하여 프로그래밍을 접하고 소프트웨어 개발에 흥미가 생겨 현재는 웹 프론트엔드 개발자가 되는 것이 꿈입니다. 꿈을 이루기 위해 열심히 배워나가는 중입니다.

3. 서비스 소개

iPhone 디바이스를 중심으로 스마트폰 내의 애플리케이션을 사용하는 듯한 느낌을 주었습니다.

기능은 ToDo와 관련된 CRUD 기능과 남은 할 일 개수, 날짜 및 시간 을 확인할 수 있습니다.

+) 디자인과는 문외한 사람인지라 개발된 작품을 참고하였습니다.

4. 개발 과정 (어려웠던 점과 해결방법)

19년 9월 노마드코더에서 바닐라JS로 크롬 앱과 비슷한 투두리스트를 만드는 영상을 보고 처음 투두리스트를 만들어 보았습니다. 페이스북에서 이러한 이벤트를 진행중이다 하여 새롭게 만들어 보았습니다.

투두를 생성할때 문제를 겪었습니다. 엔터를 입력하면 할 일이 추가가 되게 개발을 하고 있엇는데, 한글을 입력하고 엔터를 입력시 keyboard event가 두번 발생하는 겁니다.

디버깅을 통해 KebBoardEvent.inComposing 이라는 값이 문제임을 확인하고 구글링을 통해 많은 자료를 확인할 수 있엇습니다. 도움이 된 링크 첨부합니다.

https://circus7.tistory.com/6

아래가 기존 코드였다면,

inputElement.addEventLfistener('keydown', (e) => {

if (e.key === 'Enter' && !e.isComposing) { // logic... }

});

아래와 같이 해결하였습니다.

inputElement.addEventLfistener('keydown', (e) => {

if (e.key === 'Enter' && !e.isComposing) { // logic... }

});

이번 기회에 또 배운 사실은 KeyboardEvent.keyCode 뿐만아니라 많은 api들이 deprecated된다는 점이였습니다.

https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent

5. 앞으로 계획

저에게 이번 해는 굉장히 중요하다고 말씀드릴 수 있겟습니다. 취업이 결정되는 시기입니다.

좋은 결과 있엇으면 좋겠고 그러기 위해서 JavaScript와 웹 프론트엔드 기본 지식을 탄탄히 쌓을 생각입니다.

P.S. 1년 이상 노마드 코더를 유튜브로만 챙겨보고 사이트는 이용하지 못했네요. 그 기간동안 커뮤니티도 생기고 챌린지도 생긴 것 같네요. 또, 재밌어 보이는 강좌들이 눈에 띄네요. 나중에 시간이 된다면 꼭 한번 들어보고 싶어요!

2021년 한해 모두 좋은 일만 가득하셨으면 좋겠고 행복한 코딩하세요!🤗