10월 17일 (토)

🌻 D-2, Immersive Course !

오늘 한 일

• Beginner Vanilla Javascript Project Tutorial 끝 ! (Firefox)
  
  • 디자인을 수정했고, 전체 리스트와 완료된 리스트, 미완료된 리스트를 볼 수 있는 filterOption(select)을 추가했으며 localStorage를 이용해 todo list 내용들을 저장할 수 있도록 했다.

• 3가지 항목에 Check Button을 눌러 완료 표시를 한 상태의 모든 리스트
  
• filterOption을 Completed로 select, 완료된 3가지 리스트
  
• filterOption을 Uncompleted로 select, 미 완료된 3가지 리스트
  
• localStorage에 Todo List 6가지 항목이 모두 저장된 모습
  
• 출처 : https://www.youtube.com/watch?v=Ttf3CEsEwMQ
• 프로젝트 완성 코드 : https://github.com/dktkwhdk1/Beginner-Vanilla-JavaScript-Project-Tutorial
• localStorage에 대해 원래 알고 있던 내용보다 더 정확한 사용법을 공부할 수 있었고, 자바스크립트로 간단한 애니메이션을 넣는 법도 공부했다. 트위틀러 과제를 할 때 했던 것과 비슷하지만 좀 더 깔끔하게 버튼, 인풋, 여러 엘리먼트들, 이벤트 등을 여러 가지 함수를 만들어 제어하고 동작시키는 방법에 대해 학습했다. 특히 css를 적용하는 여러 가지 방법들에 대해 많이 배웠다.

---

느낀 점

• 유튜브 영상을 보고 시작한 to-do list 프로젝트를 완성했다. 그냥 따라서 하기만 하면 되는 거라서 금방 할 줄 알았는데, 꽤 오래 걸렸고 그만큼 공부도 많이 됐다. 보고 타이핑을 하다가도 이해가 안되는 부분이 있으면 멈춰놓고 생각해보고, 특히 css 부분은 모르는게 많아서 찾아보고 직접 해보고 결과 확인하고 그러느라 오래 걸린 것 같다. 재밌었다. 리액트도 이렇게 한 번 프로젝트로 접해보면 좋을 것 같다. 찾아봐야겠다.

• twittler 과제를 할 때, localStorage에 대해 찾아보고 과제에 적용하느라 애를 먹었었는데, 이번 to-do list 프로젝트에서 localStorage를 정말 간단하게 사용하는 것을 보고 놀랐다. 트위틀러 과제를 복습하는 느낌도 받았다.

---

내일 할 일

• 자바스크립트 심화 개념 복습하기
• 리액트 프로젝트 찾아보기
• 파이썬 알고리즘 문제풀이
• Immersive course전에 보면 좋을 내용 찾아보고 공부하기

---