TIL_2020년 9월 19일 (토)

목차

• 1.오늘 한 일
• 2.오늘 배운 것과 깨달은 것
• 3.오늘 진행한 작업물 (사진)

1.오늘 한 일

1. 바보같은 실수…
   • Github Repository를 지울 때는 이런 일까지 염두를 했어야했다. 뭔가 깔끔하게 정리하고싶은 마음에 하나를 지웠는데…이빨이 빠진 그림이 되었다. 지금까지 매일 채워오고있었는데…하아…그래 이것도 다 초보때 하는 실수다 생각하고 다음부터는 더 주의하자! (진짜 이렇게 되는거 싫어하는데….눈물이 앞을 가린다)

   
   (파일명 : 마음아픈 내 이빨….jpg)

2. 자기소개 페이지 완성!
   • 영상 넣기 + 영상 자동재생 기능 추가

     • “코딩이 문제가 아니라, 코덱이 문제였다.”

       HTML5에서 video tag라는 것이 생겼다. (이전에는 iframe으로만 했었다) mp4, webm, ogg 총 3가지 형식을 지원한다. 브라우저별로 지원되는 파일 형식이 다르니 mp4를 기본으로 하되, WebM과 ogg 파일 형식도 변환해서 같이 넣어두면 좋다 (1순위가 안될 때 2순위, 3순위로 진행됨) 또한 파일형식만 신경써야하는 것이 아니라 코덱종류도 확인해야한다. 나는 코드때문인줄 알고 엄청 헤맸는데 알고보니 코덱을 바꾸니 바로 해결되었다. 아이폰에서 찍은 동영상은 AAC, HEVC 코덱을 사용하고 있었는데 이건 웹에서 지원되는 코덱이 아니다. 웹에서 지원하는 코덱은 H.264(MP4), 오그테오(ogg), VP8(WebM) 세가지이다.
       혹시 코드가 문제없는데 영상이 출력이 안된다면 영상의 코덱종류를 확인해보자 !

       

     오늘 문제 해결에 도움을 받았던 ref

     • HTML / video / 동영상 삽입하는 태그
     • HTML video 태그로 동영상 플레이어 만드는 방법
     • [HTML5
   • CSS 코드 인라인으로 진행한 것 CSS파일로 다 빼내기
     • 인라인 스타일로 적었던 것 다 빼내니 클린코드(?ㅋㅋㅋ)가 되는 것같았다
3. 자바스크립트 강의 듣기
   • 이 내용은 추후에 TIL에 따로 정리하기

2.오늘 배운 것과 깨달은 것

• 오늘도 열심히 했다! 코딩만 알아야하는게 아니라 관련된 컴퓨터 상식도 많이 알수록 확실히 업무하는데 도움이 될듯. 뭐가됐든지 컴퓨터사이언스쪽은 다 공부하고 알고있으면 좋을 것같다. 차근차근 지평을 넓혀가자~

3.지금까지 작업물 (사진)