-
Tools 2020‧12‧14
ffmpeg 이용해서 HLS 파일 인코딩
일단 brew를 이용해서 ffmpeg를 설치한다. brew가 설치되어 있지 않으면 https://brew.sh/index_ko 에서 터미널에 복붙할 커멘드를 복사한 뒤 터미널에서 설치한다. brew가 설치되었으면 터미널에서 ffmpeg를 설치한다. 설치가 완료되었으면 터미널로 동영상 변환할 폴더로 이동하여 아래처럼 입력하고 실행한다. 위 예제는 test.mp4 를 1920x1080 사이즈로 10초로 영상을 쪼개어 만들고 testindex.m3u8의 인덱스 파일에 이 쪼갠 파일들을 리스트업 한다는 것이다.
-
Tools 2017‧10‧20
github로 무료 웹호스팅, 미디어 호스팅 이용하기(for 디자이너)
출처 : http://koreawebdesign.com/github-web-hosting-build-guide/ 개인적으로 운영하는 사이트들 중에 서버 이용 때문에 웹호스팅 업체를 전전하던 경우가 종종 있으실 겁니다. 트래픽도 제한 걸리고, 용량도 제한 걸리고, 속도도 제한이 많죠. (물론 비싼 비용의 서비스는 그렇지 않습니다만…) 이번에 정리할 내용은 gitHub에 무료로 기본 웹사이트를 만들어서 올려놓을 수 있는 웹호스팅 또는 미디어 호스팅을 만드는 것입니다. 물론 찾아보시면 여러가지 좋은 가이드가 있지만 저는 설치형 블로그나 db를 […]
-
Tools 2017‧05‧17
아톰 에디터 - 자동 한줄 내림 취소 설정
코딩하는데 자꾸 얼마 안치고 한줄 밑으로 내려서 코딩된다. 우측 영역에 공간이 많은데도 계속 내려간다. 한줄 최대 글자 입력수가 얼마인지 어디서 설정하는지 모르지만 일단 스크롤이 생기더라도 우측 공간 활용을 위해 해당 자동 내림 기능을 제거해야겠다. Settings 의 Editor 안에 Soft Wrap 체크 아웃 하면 된다.(아래 그림처럼)
-
Tools 2017‧04‧11
Gulp - 플러그인 설치 및 사용하기
gulpfile.js 를 열고 이제 자동화 설정 셋팅을 해보자. 내가 하려는 자동화 작업은 이렇다. js는 js폴더에 작업한 여러개의 js를 합치고, 코드를 압축한다. scss는 컴파일해서 css로 만들되 역시 코드를 압축해 놓는다. html 파일은 그냥 개발폴더에 추가되거나 수정될 때 배포 폴더에 자동으로 수정된다. localhost로 서버화 시켜서 웹브라우져에서 미리 보면서 작업하고 수정될 때마다 실시간 반영된다. 이미지는 압축과정을 거쳐 배포 […]
-
Tools 2017‧04‧11
Gulp - 시작전 준비하기
어제 Gulp(걸프)란 걸 접하고 구글링을 통해서 습득해보는 도중 적어놔야겠다 생각 들어서 정리를 해보려고 한다. (왼쪽은 Gulp 로고라고 하니 알아두자) Gulp는 처음 접하였고 Grunt도 들어는 보았지만 아직 해보진 않았다. 결론은 셋팅해두면 실무에 작업 하는데 도움이 되는 좋은 '자동 빌드 도구'이다. 본인은 이미 비슷한 도구로 GUI형식의 Prepros를 써왔다. 무료다. 다만 유료로 사용하라고 자꾸 뜨는게 귀찮지만 나름 scss도 […]
-
Tools 2016‧10‧11
구글 통계 - 캠페인 url 만들기
구글 애널리틱스에 캠페인과 관련된 링크를 만들어 사용하게 되면 접속하는 경로의 파라미터들을 통해 어디서 접속해서 어떤 캠페인을 통해 어떤 것을 클릭했는지 등과 같은 좀 더 자세한 추적을 알아낼 수 있다. https://ga-dev-tools.appspot.com/campaign-url-builder/
-
Javascript, jQuery, Tools 2015‧01‧26
Javascript - 모바일 브라우저 접속 체크
모바일 기기로 접속하였는지 여부를 확인한 후 개별적으로 링크를 따로 구현하게 될 때가 많다. 특히 모바일웹을 따로 구축하게 되는 경우가 이러한데 모바일이 시대가 흐를수록 다양해지다보니 오래전 스크립트가 제대로 작동되지 않을 때가 있다. 이를 해소해주는 사이트가 있다. http://detectmobilebrowsers.com/ 위 사이트로 이동한 뒤 javascript 파일을 다운 받아 사용하여도 된다. jQuery등 그 외 Apache, ASP, ASP.NET, ColdFusion, C#, IIS, JSP, […]
-
Tools 2015‧01‧07
페이스북 공유시 나오는 정보 수정 방법
일단 페이스북에 주소를 입력하거나 공유하게 되면 나오는 정보들이 있다.이 정보들을 사이트에 설정하려면 아래 링크를 찾아가서 메타 태그를 헤더안에 넣으면 된다. https://developers.facebook.com/docs/sharing/best-practices?locale=ko_KR 그리고 나온 정보가 제대로 반영되지 않을 때는 페이스북 개발툴에서 캐시를 삭제한다. https://developers.facebook.com/tools/debug/og/object/ 위 주소로 접속하면 캐시를 지울 사이트 주소를 입력하는 칸이 나온다.주소를 입력하고 'Show existing scrape information'를 누르면 설정된 값들이 나열 된다. 'Fetch new […]
-
Tools 2014‧10‧17
sublime text2 sftp 접속시 encoding error
서브라임 텍스트로 SFTP 플러그인을 통해서 서버에 접속하려 할 때 어떤 호스팅의 경우에는 아래와 같은 오류가 나면서 접속이 되지 않는다. sublime sftp an encoding error was encountered trying to read from the server. please adjust the "remote_encoding" setting in sft-config.json 이라고 하면서 뭐라고 뜬다. (사실 무슨 말인지 도통 모르겠다.) 확인을 누르면 바로 또 아래와 같은 경고창이 […]
-
Tools, Web Design 2014‧04‧01
디자이너들에게 추천하는 크롬 브라우저 앱기능
실무자 중에서도 크롬이나 파이어폭스를 이용해서 웹을 서핑하는 분들이 많이 계실꺼라 생각합니다. 그 중에 크롬에는 크롬 웹스토어를 통해 새로운 기능들을 추가할 수 있는데요. 이 앱들로 인해서 작업하기도 수월하고 간단합니다. 1. 창 크기를 조절하여 반응형웹을 테스트하기 적합한 'Window Resizer' 다운로드 경로 : https://chrome.google.com/webstore/detail/window-resizer/kkelicaakdanhinjdeammmilcgefonfh 크롬 브라우저로 위 경로를 접속해서 설치하게 되면 브라우저에 아래와 같이 아이콘이 생깁니다. 이렇게 추가된 […]