전체 글 33

[북마크] mydevice.io: 디바이스 스크린 정보

mydevice.io : web devices capabilities Mobile devices, in Responsive Web Design, relate to a core value which is the value of CSS width or ("device-width"), in CSS Device Independant Pixels, which depends both of the browser and user zoom settings. Choose your weapon : www.mydevice.io 접속한 디바이스 및 다른 메이저 디바이스 스크린 정보 제공 사이트. 현재 디바이스 정보 스크린 메트릭(Screen metrics): 스크린 크기, 픽셀 레티오(pixel ratio), 해상도(resol..

북마크 2021.07.08

IE 10에서 MIME type이 "application/octet-stream" 일 때, video 재생 오류

문제 상황 IE 10에서 video tag를 사용하여 동영상을 노출 시켰을 때, Invalid Source 라고 노출되며 재생 불가 해당 비디오는 서버에서 MIME type "application/octet-stream" 으로 내려주고 있었음 MIME type: application/octet-stream 이란 application/octet-stream 는 다른 모든 경우를 위한 기본값입니다. 알려지지 않은 파일 타입은 이 타입을 사용해야 합니다. 브라우저들은 이런 파일들을 다룰 때, 사용자를 위험한 동작으로부터 보호하도록 개별적인 주의를 기울여야 합니다. 출처: MDN - MIME 타입의 전체 목록 해결 방안 서버에서 비디오의 MIME type을 video/mp4로 반환하도록 변경. 참고 링크 HTM..

[Git 미세팁] 특정 유저가 수정한 파일 목록 보기

git log --author="유저 이름" --name-only --pretty=format: | sort | uniq git log --author="유저 이름" : 특정 유저의 로그만 필터링 git log --name-only : 커밋 정보중에서 수정된 파일의 목록 출력 git log --pretty=format: : 지정 형식으로 출력하는 옵션. 여기에서는 파일 외의 string 제거용 sort : 정렬 uniq : 중복 제거 큰 프로젝트 인수인계시에 직접 작업한 내용이 무엇이 있었는지 확인하려다가 사용했습니다. Git commit 히스토리 내에서 수정한 적이 있는 모든 파일이 나오므로, 이미 삭제된 파일도 목록에 노출될 수 있습니다. 참고 링크

Git 2020.12.17

[번역] 듀얼 스크린과 폴더블 디바이스를 위한 웹 API 소개

이 글은 Microsoft의 Introducing Web APIs for Dual Screen and Foldable Devices 포스트 내용을 번역, 요약하였습니다. 9월 10일 출시된 Surface Duo를 포함하여, 요즘엔 다양하고 새로운 듀얼 스크린, 폴더블 디바이스가 시장에 나오고있습니다. 이에 따라서 사이트를 이러한 규격을 어떻게 수용할 지 생각해볼 좋은 시기입니다. 그래서 마이크로소프트는 웹 개발자들이 브라우저 창이 여러 디스플레이 영역에 걸쳐있는 경우에 콘텐츠를 효과적으로 배치하고, 해당 디바이스에 자연스럽게 반응형 웹 사이트를 만들 수 있도록 하는 두 가지 실험 기능을 발표했습니다. CSS 스크린 확장 미디어 기능(screen-spaning media feature)과 접힌 형상을 설명..

웹 프론트엔드 2020.10.08

[기술 영어] low-fidelity / high-fidelity

Adaptive serving allows sites to ensure users on slow connections can get “a” version of the experience, even if at a lower-fidelity. 해외 아티클을 번역 하던 중 위의 문장에서 막히기 시작했다. 대체 "lower-fidelity"가 무엇일까? 몇 가지 찾아본 결과는 다음과 같다. 맨 처음 찾아 본 것은 번역기와 사전이였다. 구글 번역기와 네이버 파파고로 돌려보면 "충실도", 네이버 영어사전을 찾아보면 "충실도", "정확도"로 나온다. 아래는 네이버 영어사전의 예문. the fidelity of the translation to the original text 원본 텍스트에 대한 번역본의 충실도 [정확..

기술 영어 2020.07.07 (1)

Mac에서 사파리(Safari) Web inspector를 이용한 아이폰(iPhone) 디버깅

Safari 버전 13 부터는 모바일 디버깅 미지원하며, Safari Technology Preview으로 디버깅 가능합니다. Mac과 iPhone을 케이블로 연결 [iPhone] "이 컴퓨터를 신뢰하겠습니까?" 팝업에 "신뢰"버튼 누르기 [Mac] "Safari > 환경설정(Preferences) > 고급(Advanced)"에서 메뉴 막대에서 개발자용 메뉴 보기(Show Develop menu in menu bar) 체크박스 활성화 [iPhone] "설정(Setting) > Safari > 고급(Advanced)"에서 웹 속성(Web Inspector) 활성화 [Mac] "Safari > 개발자용(Develop) > 디버깅하려는 iPhone (예: ~의 아이폰)> 개발용으로 사용(Use for Deve..

디버깅 가이드 2020.03.09 (3)

[용어] Above the Fold / Below the Fold

Above the Fold 웹페이지에서 아무 행동(스크롤, 클릭 등)을 하지 않은 부분. 접은 신문의 첫 페이지의 상단에서 따옴 Below the Fold 웹페이지에서 스크롤하지 않으면 볼 수 없는 부분. Above the Fold가 아닌 부분. 출처: 위키피디아 - Above the fold Above the fold - Wikipedia Top section of the front page of a newspaper or website Above the fold is the upper half of the front page of a newspaper or tabloid where an important news story or photograph is often located. Papers are ..

기술 영어 2020.03.09
반응형