1. 결과물 URL

https://dkssyddico.github.io/todo-contest/ 

2. 자기소개
안녕하세요? 작년 말부터 코딩을 접한 뒤 웹 프론트엔드 개발자가 되고 싶은 코린이입니다! 작년 11월에 코코아 챌린지부터 시작해서 얼마 전엔 CSS LAYOUT 챌린지 끝냈고, 현재는 유튜브 챌린지하고 있어요 : ) 현재는 학생으로 배우는 단계에 있지만 언젠가는 어엿한 개발자로 취업해서 슬랙에서 많은 분들과 더 풍부한 이야기 나누고 싶어요 ㅎㅎ To do list 대회에 참가한 계기는 JS 챌린지에도 참가했었는데 턱걸이로 통과했다는 느낌을 지울 수가 없어서 ㅠㅠ 이전에 공부한 내용을 복습할 수 있을 것 같아서 참가했습니다 !

3. 서비스 소개

제 To do list 의 기능은 크게 5가지입니다! 니꼬쌤 강의와 챌린지에서 나온 부분을 많이 활용하려고 했어요~ 더 넣고 싶은 기능은 많았는데 실력 탓도 있고 투두리스트가 자칫 조잡스러워질까봐 줄이고 줄였습니다 ㅎㅎ 제가 정말 사용할 수 있는 투두리스트를 만드려고 노력했습니다!

첫번째 기능은 오늘 날짜와 현재 시간을 알 수 있는 달력과 시계 기능입니다.

두번째는 첫번째와 연결되는데, 사용자의 이름을 입력하면 현재 시간에 맞게 인사를 해주는 greeting 기능이에요! 시간을 크게 4등분해서 오전, 오후, 저녁, 새벽에 나오는 문구가 모두 다르게 만들었어요.

세번째 기능은 사용자가 원하는 대로 전체적인 색상을 변경할 수 있는 color change 기능이에요. 밝은 day mode와 어두운 dark mode로 나누었습니다.

네번째로는 검색 기능입니다! 코딩을 배우다보니 구글을 끼고 사는데 코딩하다가 모르는 부분이 있으면 바로바로 검색할 수 있도록 구글 검색 기능과 네이버 영어 사전을 넣었어요. 검색어를 쓰고 enter를 쳐도 새로운 페이지로 랜딩되고, 검색 버튼을 눌러도 사용할 수 있게 만들었어요 !

마지막으로는 to do list 기능입니다! 해야할 일과 완료한 일로 나누었고 삭제, back, check 버튼을 만들어서 서로 왔다갔다할 수 있어요 ㅎㅎ 이 부분은 JS 챌린지에서 배운 내용을 활용해서 아마 챌린지 하신 분들은 아~ 하실 거에요 ㅎㅎ 거기에 notice 기능을 넣어서 현재 몇개를 완료했는지, 몇개를 해야하는지 볼 수 있도록 했습니다.

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

어떤 기능을 넣고 뺄까 고민하는 과정, 그리고 실제로 어떤 구조로 만들까 고민하는 과정이 어려웠어요. 그 다음으로는 제가 원하는 기능을 코드로 짜는 게 힘들었구요 ㅎㅎ 의외로 color change 기능이 어려웠는데요, 한가지 서비스를 만드려면 코드 구조를 정말 치밀하게 계획하고 짜야겠구나라는 반성의 계기가 되었습니당. 클래스 네임 활용은 정말 무궁무진한 것 같습니다 ㅎㅎ 니꼬쌤 강의와 챌린지 했던 코드도 몇번이고 다시 봤고, 부족한 부분은 구글링을 활용해서 해결했습니다. CSS 하는 걸 좋아하는데 원래 있던 홈페이지를 클론하는 거랑 제가 원하는 새로운 걸 만드는 건 정말 천지차이더라구요. 아날로그식으로 공책에 네모들을 그려가며 구조를 만드는 과정이 재밌었지만 조금 힘들었어요. 몇번을 수정했는지 몰라요 ㅎㅎ 다행히 최근에 CSS LAYOUT 강의와 챌린지를 들은 덕분인지 깔끔한 구조의 to do list를 만들 수 있었습니다. 더 많은 웹사이트와 앱들을 보고 따라하면서 계속 계속 감을 익혀야할 것 같아요!

5. 앞으로의 계획

노마드코더 수강생들에게 JS를 다시금 복습할 수 있는 좋은 계기를 만들어주셔서 감사합니다 ! 앞에서 말씀드렸듯 JS 챌린지 턱걸이로 통과했다는 기분에 조금 아쉬웠는데, 이번 대회를 참가하면서 조금이나마 해소할 수 있었어요 ㅎㅎ 실력이 늘면 지금 만들었던 투두리스트도 조금씩 개선할 예정이에요. 노마드 코더 강의로 항상 많이 배우고 있고, 현재는 취업에 활용할 수 있는 포트폴리오 사이트를 틈틈이 만들고 있어요. 조만간 노마드코더 커뮤니티 사이드 프로젝트에 올릴 수 있었으면 좋겠습니다. 그리고 취업 소식도 꼭 전해드리고 싶어요. 모든 분들 화이팅이고 또 감사합니다.