개발 공부 기록

Chrome Animation Tool Chorme의 개발자 도구에서 애니메이션을 상세하게 볼 수 있는 기능이 있습니다. 해당 기능을 통해 코드 편집기에서 코드를 수정하지 않고, Chorme에서 쉽게 애니메이션 타이밍을 조절할 수 있습니다. 우선 크롬 개발자도구에서 애니메이션 탭을 열어줍니다. 애니메이션 탭을 활용하기 위해서는 탭이 열린 채로 페이지가 로드되어야 합니다. 중간에 열게 되면 비어있는 탭이 나타나는 경우가 있는데 이때 새로고침하여 애니메이션 정보를 불러올 수 있습니다. 생성된 애니메이션 썸네일 바를 클릭하여 애니메이션 상세 정보를 볼 수 있습니다. - 색상이 진한 부분 : 애니메이션 - 색상이 연한 부분 : 반복되는 애니메이션 - 색상이 채워진 원 : 애니메이션의 시작/끝 - 비어있는 원 :..

CSS와 Javascript를 개발 할 때, 일반 Chrome의 경우 캐시 때문에 변경한 내용이 즉시 반영되지 않는 경우가 많다. 이럴 때 해결할 수 있는 방법으로 두가지 방법이 있다. 첫번째 방법은 크롬의 새로고침 버튼을 길게 클릭하거나 마우스 우측 버튼을 클릭하면 아래의 메뉴가 나와 캐시를 비우면서 새로고침하는 것이다. 두번째 방법은 시크릿 모드에서 실행하는 것이다. 나는 두번째 방법이 더 편하기 때문에 크롬 시크릿 모드를 기본으로 실행하도록 설정을 변경하였다. 우선 크롬의 속성 창을 띄운다. 그 다음 속성창의 대상의 끝에 --incognito 를 추가해준다. 적용을 누르면 시크릿 모드가 기본 모드로 설정된 것을 확인할 수 있다.