발생일: 2015.11.08 키워드: word-wrap, word-break, 줄바꿈 문제: word-wrap 과 word-break는 늘 헷갈린다. 어떤 경우에 어떤 것을 써야할 지 헷갈려서, 대충 검색 후에 붙여넣어 왔던 것 같다. 이참에 어떻게 적용하면 될 지를 명확하게 정리해두자. 해결책: word-wrap 은 긴 텍스트를 강제로 자를 것인지에 대한 옵션이다. 이 속성이 누락되어 있으면 보통 긴 URL이 엘리먼트 밖으로 삐져나오게 된다. normal 과 break-word 옵션이 있고, 줄바꿈을 적용할 것이라면 break-word 를 할당하면 된다. word-break 는 줄바꿈을 어떻게 할 것인지에 대한 옵션이다. 아시아/비아시아 언어 기준으로 구분되지만, 간단하게- 한글을 포함해 단어 기준으로..
발생일: 2015.10.08 키워드: translate3d, translate2d, GPU 렌더링 문제: 피드 형태의 길이가 긴 페이지에서 한 카드에 translate3d 로 플리킹을 적용해뒀다. 시간이 지나면 피드가 급격히 느려진다. 왜 그런 걸까? 해결책: translate3d는 GPU 렌더링을 사용하고 있는데, GPU 렌더링은 스크롤 영역을 벗어난 이후에도 계속 발생했기 때문이다. 해당 카드가 자주 노출되는 것이 아니라서, 일단은 tranlsate2d 변경하는 것으로 해결했다. 논의: 만약 해당 카드가 자주 노출되는 것이었다면, 성능 개선이 필요하겠다. 스크롤 된 이후에은 translate3d 속성을 제거하는 방식으로 처리하면 될 것 같다. 참고: https://developers.google.co..
사파리에서 플래시가 재생되지 않는 이슈
발생일: 2015.09.03 키워드: 사파리, Safari, 전력 절약, 플래시, flash 문제: 사파리에서 플래시 동영상 플레이어가 재생되지 않는다. 해결책: 사파리 설정이 고급 설정에 전력 절약 옵션이 켜져있었기 때문이다. 전력 절약을 위해 인터넷 플러그인을 중단하는 옵션이 있는데, 이 플러그인에 플래시가 포함되어 있어서이다. 옵션을 끄니 잘 재생된다. 참고: http://shallaa.github.io/post/safari-%E1%84%8C%E1%85%A5%E1%86%AB%E1%84%8B%E1%85%AF%E1%86%AB-%E1%84%8C%E1%85%A5%E1%86%AF%E1%84%8B%E1%85%A3%E1%86%A8/
발생일: 2015.09.02 키워드: git blame 문제: 커맨드 라인에서 깃 블레임을 사용하려고 한다. 해결책: $ git blame 파일명 $ git blame -s 파일명 $ git blame -L , 파일명 $ git blame -L ,[상대값] 파일명 논의: - 대부분의 에디터에서는 전체 파일명을 찾는 기능을 제공한다. 해당 페이지에서 오른쪽 마우스를 눌러보자~ - 어떤 커밋인지 찾았다면 아래 명령으로 커밋을 확인할 수 있다. $ git show 커밋 특정 커밋의 파일의 내용을 보고 싶다면, $ git show 커밋:파일명 단, 여기서의 파일명은 git 루트로부터의 상대 경로이다.
발생일: 2015.09.02 키워드: 크론탭, crontab, npm, npmrc, config 문제: 노드 커맨드를 크론탭에서 사용하려고 하는데, 노드에 설정한 기본 설정을 읽어오지 못한다. 해결책: 아래 명령으로 아무 것도 없는 환경을 재현할 수 있다. $ env - 먼저, 이 환경(크론탭이 동작하는 환경)에서 npm이 어떤 파일로부터 전역 설정을 상속받는지 확인해본다. $ env - npm config list -l | grep globalconfig 내 건 전역 설정인 /etc/usr/npmrc 의 것을 사용하고 있었다. 아래와 같이 수정해서 전역 파일에 설정(난 프록시 설정이 필요했다)을 추가했다. $ sudo vi /etc/usr/npmrc
발생일: 2015.08.06 키워드: 탭 하이라이트 제거, webkit-tap-highlight, tab highlight 문제: 삼성 계열 디바이스에서 탭 하이라이트가 제거되지 않는다. 해결책: rbga, transparent, outline 모두 정의해줘야 한다. .no_tab_highlight { outline:none; -webkit-tap-highlight-color:rgba(0,0,0,0); -webkit-tap-highlight-color:transparent; }
발생일: 2015.07.27 키워드: 웹뷰 비디오, web view video 문제: 얼마 전에 웹뷰로 비디오를 재생하는 작업을 진행했다. iOS 와 안드로이드 동일하게 올라가는 뷰였는데, 작업하면서 꽤 많은 버그가 발생했다. 다음 작업을 위해 메모해둔다. 해결책: - 태그는 동기로 넣자. 비동기로 넣을 경우, 디바이스에 따라 전체 재생이 되지 않는 경우가 있다. iframe으로 선언해 바로 추가하는 방법으로 해결했다. - 풀스크린 전환 시엔 webkitEnterFullScreen() 을 호출한다. - 풀스크린 종료 후, 줌이 틀어지는 이슈 (안드로이드 4.1) meta 태그의 비율을 1.01 로 바꿨다가 다시 1.0 으로 설정하는 방식으로 해결했다. (setTimeout을 적용해줘야 된다) - iOS에..
발생일: 2015.07.20 키워드: nginx, 설정, 디렉티브, directive 문제: nginx 설정의 상속 모델에 대해 잘 설명한 포스트가 있어 요약해봤다. 해결책: nginx에서는 아래 6개의 컨텍스트가 존재한다. - Global. - Http. - Server. - If. - Location. - Nested Location. - If in location. - limit_except. 기본 상속 모델은 부모 블럭에서 자식 블럭으로 상속받는 순이다. 형제 블럭이나 부모 블럭으로 전달되는 경우는 없다. nginx에서 상속이 동작하는 방식은 아래 4개의 타입으로 구분할 수 있다. - Normal directive 컨텍스트 당 한 개의 값 (예: root, index) - Array directi..
발생일: 2015.07.08 키워드: chsh, 쉘, bash, zsh, oh-my-zsh 문제: 주변에서 zsh 이 좋다는 얘기를 듣고, 이런 저런 쉘을 설치해보고 있다. oh-my-zsh 을 설치한 후에, Prezto 가 더 좋은 것 같아 쉘을 변경하려고 oh-my-zsh 을 삭제했다. 헌데, 터미널을 열 때마다 여전히 zsh 이 열린다. 어떻게 다시 bash 로 되돌리지? 해결책: 기본 쉘을 변경하는 `chsh`라는 명령이 있다. $ chsh 명령을 실행하면 기본 파일이 열리는데, 기본 쉘 파일을 `bash`나 원하는 쉘로 변경하면 된다.
발생일: 2015.06.23 키워드: iOS, playsinline, webkit-playsinline, 인라인 플레이, iOS 웹뷰, inline play, allowInlineMediaPlayback 문제: iOS에서 웹뷰에서 동영상 재생 시, 풀스크린 대신 인라인으로 재생하려고 한다. 해결책: 1. iOS 웹뷰에서 인라인 플레이 여부 옵션을 true로 설정한다. - UIWebView 의 allowsInlineMediaPlayback 속성을 YES 2. 웹뷰에서 video 태그에서 인라인 플레이 여부 옵션을 추가한다. - 논의: 유튜브 비디오를 인라인으로 재생하려는 경우라면, embeded URL 에 &playsinline=1 파라미터를 넣어주면 된다. 참고: http://stackoverflow.c..