스탑와치
1.[스탑와치] 1. 시작
독학으로 공부하다 보니 하루종일 컴퓨터는 붙잡고 있는 것 같은데 실제 공부 시간이 얼마나 되나 궁금했다. 그러나 막상 시간을 실제로 재지는 못했다. 그러다가 웹 어플리케이션으로 스탑와치 기능과 투두리스트 기능을 섞은 것을 만들어 보면 좋겠다 싶어서 시작하게 되었다. 스
2.[스탑와치] 2. 일단 시작은 했다
일단 시간이 흘러가고 시작, 중지, 멈춤 정도는 구현했다. 먼저 맨 처음 화면은 위와 같다. 
말 그대로 시간과 그 동안의 액션을 적어서 추가할 수 있도록 했다.1\. 위의 캡쳐처럼 stop을 누르면 아래에 시간과 input이 나온다. 그 시간 동안 했던 액션을 적고 save를 누르면...2\. 이렇게 추가된다. 3\. 같은 방법으로 계속 추가할 수 있다. 4
4.[스탑와치] 4. 디자인
날것의 css로 간단하게 디자인을 입혔다. 다음 번에는 materialize나 bootstrap 아니면 tailwind를 사용해 보려고 한다. 위 캡쳐 이미지처럼 전체적으로 심플하게 꾸미려고 했다. skeleton css 같은 깔끔한 것을 개인적으로 좋아한다. 오늘 디
5.[스탑와치] 5. 자잘한 버그 개선 & 커밋의 중요성
버튼 동작 관련 자잘한 기능 보완을 했다. 버튼의 텍스트, border 컬러를 회색 계열로 바꿈 cursor를 not-allowed로 변경바로 reset 버튼 누르면 맨 처음 화면과 똑같이 만들기 (stop, reset 버튼 비활성화)stop 버튼을 눌러서 save 입
6.[스탑와치] 6. 삭제 기능
투두 리스트를 겸한 스탑와치를 어느 정도 완성한 것 같다. 이번에 구현한 기능은 삭제 버튼 누르면 리스트에서 안 보이게 하기 삭제 버튼 누르면 로컬 스토리지에도 업데이트 하기
7.[스탑와치] 7. 갑자기 deploy
stopwatch-todolist.surge.sh여기에 접속하면 내가 만든 스탑와치를 사용할 수 있다. 예전에 sns에서 정적웹을 간단하게 배포할 때, surge.sh를 추천한다는 글을 봤던게 생각나서 배포해봤다.정말 간단하다. npm install --global s