CREATIVE

'Web Design/Programming' 카테고리의 글 목록

이매지네이션 라이브러리 소프트웨어의 제작과 배포 그리고 프로그래밍 프로그래밍 귀찮은 것은 싫고 노가다도 싫다면 역시 프로그래밍을 배우는 것이 좋은 것 같다. 그도 그럴 것이, 만약 반복 작업을 해야 하거나 귀찮은 것들을 해야 한다면 프로그램으로 쉽게 하는 것이 가장 편하기 때문이다. 그래서 프로그래밍을 배우는 건데, 쉽게 얘기하면 컴퓨터 언어를 배워서 언어대로 컴퓨터에게 명령하는 거다. 얼마나 편한가! 물론, 프로그래밍 언어를 배우는 일 자체가 귀찮을 수 있다. 만약 그정도라면 숨 쉬는 것도 귀찮아서 차라리 죽어버리는 것이 낫다고 생각할 수도 있겠지만, 그래도 프로그래밍 정도는 배우면 뭔가 쓰임새가 많다. 프로그램을 배포하는 것 까지는 상당한 시간이 걸리고 많은 테스트를 거쳐야 하지만, 능숙한 프로그래머는 프로그램 하나도 뚝딱 만들어낸다. 비교하는 것을 좋아하는 한국사..
이매지네이션 라이브러리 <video> : 비디오 삽입 요소 간단 사용방법 간단 사용방법은 아래와 같습니다. 비디오 영상을 별도의 데이터베이스를 통해서 삽입할 필요 없이, 외부 주소값을 불러와서 아래의 요소로 적용시킬 수 있습니다. Autoplay 부울(boolean) 속성. 이 값이 설정되면, 데이터 로딩이 완료되지 않더라도 재생 가능한 시점에 자동으로 재생이 시작됩니다. Buffered 미디어의 어느 시간대가 버퍼에 들어 있는지 확인할 수 있는 속성입니다. 이 속성은 TimeRanges 객체를 포함합니다. Controls 이 속성이 존재하면, 소리 조절(volume), 동영상 탐색(seek), 일시 정지(pause)/재시작(resume)을 할 수 있는 컨트롤러를 제공합니다. Height 비디오의 출력 영역 높이이며, CSS 픽셀 단위 입니다. Loop 부울(boolean) ..
이매지네이션 라이브러리 HTTP → HTTPS 리다이렉션 전환(.htaccess) 루트 위치에서 .htaccess 문서파일을 찾아 아래와 같이 작성해준다. 이 값을 추가하면 301, 302 리다이렉션 문제를 해결할 수 있다. 사이트 도메인을 변경하거나 SSL 도입할 경우에 HTTP 접속 주소값을 영구적으로 HTTPS로 리다이렉션을 해주는 방법이다. RewriteEngine On RewriteCond %{HTTPS} off RewriteRule (.*) https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
이매지네이션 라이브러리 리디렉션(리다이렉션) 하는 자바스크립트 코드 (도메인 변경 또는 이벤트 페이지 이동) 리디렉션(리다이렉션) 자바스크립트 코드입니다. 저처럼 도메인을 변경하거나, 특정 페이지에서 다른 페이지로 이동을 시켜야하는 경우, 이벤트 페이지로 이동을 시켜야 하는 경우 자바스크립트로 쉽게 주소를 변경할 수 있습니다. 기본적으로는 도메인 자체에서 다른 도메인으로 변경을 하는 방법이 있는데, 이 경우를 포워딩이라고 합니다. 흔히 볼 수 있는 현상으로는 낚시사이트나 성인사이트 등에서 다른 결제사이트로 피싱(낚시)하는 방법으로 자주 사용을 하지만, 포워딩은 다른 경우에도 많이 쓰이는 방법입니다. 자바스크립트로 쉽게 구현을 할 수 있기도 하며, 도메인 제공사이트(가비아, 후이즈 등)에서도 일반적으로 포워딩 서비스를 제공하고 있습니다. 자바스크립트로 리디렉션 하는 경우는 일반적이지 않은 경우이기 때문에 사용에 ..
이매지네이션 라이브러리 배경음악 다는 방법(티스토리 배경음악, 자동재생, Audio 태그) HTML5 부터 Audio 태그를 지원하면서 아주 간단하게 글에 배경음악을 설치하는 방법이 있습니다. 구글 크롬 정책에 의하여 자동재생이 일부 막혔지만, 다른 방법으로 구현할 수 있습니다. 아래의 경우에는 일반적인 경우로 배경음악을 설치하는 방법이므로, 사이트 자체에 배경음악을 설치하기 위해서는 인덱스페이지에 Div 태그로 감싸 요소를 가려주시면 됩니다. 글에 배경음악을 다는 방법입니다. 일반적으로 티스토리 기준으로 설명을 하면 HTML 지원이 가능한 사이트 혹은 블로그에서 위의 태그로 오디오 태그를 활용할 수 있습니다. 태그에 각 속성을 추가하면 여러가지를 구현할 수 있습니다. 일반적으로 와 같은 방식으로 태그를 작성합니다. . . 와 같은 식으로 구현하고 음악 소스파일 주소를 와 같이 적용하면 오디오..
이매지네이션 라이브러리 캡챠(captcha) 풀어주는 API 제공 사이트 https://anti-captcha.com/mainpage 돈 드는게 흠이지만, 개발하는 사람들 중에서 자동화 시스템을 만드는 사람들에게는 정말 중요한 API라고 할 수 있겠다. 보안이 설정되어 있는 대부분의 요소에는 Captcha가 걸려있어서 하다못해 웹문서 작업을 할 때에도 굉장히 중요할 수 밖에 없다. 어쩔 수 없이 다양한 플랫폼, 다양한 도메인에서 웹문서를 발행할 수 밖에 없는 운명의 컨텐츠들이 있기 때문이다.
이매지네이션 라이브러리 윈도우 10 기본앱 원격 프로시저 호출 오류 해결방법 기본앱을 자주 사용하는 나로서는 기본앱이 실행이 안되면 정말 짜증이 난다. 윈도우 10의 대표적인 오류 중 하나인 원격프로시저 호출오류! 다양한 해결방법들이 있지만 아주 간단히 해결방법을 모색해보자면 아래의 마이크로소프트에서 해당 미디어 기능 팩을 다운 받으면 된다. 윈도우 10 n KN의 오류라고 하는데, 윈도우 10도 참 오류가 많다. 그래도 윈도우 7보다 좋은건 사실이다. Download Windows 10 N 및 KN 버전을 위한 미디어 기능 팩 from Official Microsoft Download Center www.microsoft.com https://www.microsoft.com/ko-KR/download/details.aspx?id=48231 2개의 파일을 다운받을 수 있는데 모두..
이매지네이션 라이브러리 특정 페이지 및 카테고리의 HTML 구조를 변환하기 (IF조건문) if ( window.location.pathname == '/category/Protect' ) { document.write( '' ); } 해당 내용은 코코소프트의 내용을 참고하여 응용하였습니다. 위 방법으로 간단하게 특정 카테고리나 특정페이지의 Document를 수정하거나 새롭게 작성할 수 있습니다. 저의 경우, 보호글 카테고리(자료보관용)을 생성하게 되면서 본문에 작성되는 내용이 없기 때문에 게시글의 레이아웃이 변형되거나 오류가 생기는 부분이 발생했습니다. 게시글의 2문단 내지 3문단 정도를 일정하게 작성하면 문제가 발생하지는 않지만, 자료보관용이기 때문에 별도의 글을 작성할 필요도 없고, 단순히 자료보관만 하면 되기 때문입니다. 따라서, 위와 같이 보호되어 있는 글이라는 요약설명 부분이 굳이 ..
이매지네이션 라이브러리 jQuery / Method / .append() (문자열 추가) 자바스크립트로 페이지의 요소를 수정하거나 문자열을 추가할 때 사용하는 메소드 .append() 사용방법은 아주 간단하다. 클래스명을 변경하고, .append('추가할 내용' ); 으로 실행을 시키면 페이지의 맨 앞에 접두어를 붙이거나 수식어를 추가할 수 있다. .prepend의 경우에는 맨 뒤에 추가할 수 있다. $( '클래스명' ).append( '추가할 내용' );
이매지네이션 라이브러리 유튜브 반응형 자바스크립트 소스 간단한 자바스크립트 코드로 쉽게 유튜브를 반응형으로 만들어줄 수 있다. 데스크탑 보다 모바일의 경우 화면이 짤리는 경우가 많은데, 쉽게 구현할 수 있는 코드다.
이매지네이션 라이브러리 백링크 작업을 위한 트윗봇 링크주소 숫자출력문 이전에도 내용을 작성했었지만, 개인적으로 쉽게 사용하기 위해서 다시 한번 정리하는 내용이다. 게시글이 많아지면서 새롭게 추가해야할 트윗봇의 링크주소를 추가해주기 위해서 쉽게 사이트의 주소와 게시글 숫자를 출력하는 숫자출력문이다. 이전까지 작업한 숫자(N-1)로 하고, 그 다음부터 반복숫자를 N+(1000번)에 치환해서 적용시키면 된다. 그 다음에 메모장 등을 활용해서 #으로 되어 있는 앞 부분을 일괄변경해주면 링크주소를 숫자나열식으로 출력시킬 수 있다. 백링크 작업의 경우, 매우 중요하기 때문에 이를 간편하게 작업해줄 트윗봇 등의 애플리케이션을 이용하면 쉽게 백링크를 생성할 수 있다. 텀블러와 페이스북 등의 작업도 가능하지만, 번거로운 부분이 있어 트위터만 사용해도 충분하다. 무엇보다도 백링크보다 사이트..
이매지네이션 라이브러리 OSS Notice | KEditor OSS Notice | KEditor This application is Copyright © Kakao Corp. All rights reserved. The following sets forth attribution notices for third party software that may be contained in this application. If you have any questions or concerns, please contact us at opensource@kakaocorp.com @babel/polyfill https://github.com/babel/babel/tree/master/packages/babel-polyfill MIT License @ephox/agar https:/..
이매지네이션 라이브러리 HTML5 웹문서 작성에 대한 고찰 어떻게 보면 단순한 웹문서 작성하는 것은 책을 구성하는 것과 같다. 내가 제목을 쓰고, 본문에 내용을 담고, 어떤 내용을 채우고 색을 입히거나 강조를 하는 것은 모두 문서를 작성하는 것이다. 그것이 페이지(Page)로써, 한 페이지씩 채워나간다고 생각하면 되는 것이기도 하고 그러한 페이지들이 쌓여 하나의 사이트이 되는 것이기도 하다. 그러니, 귀찮더라도 표준웹을 지키면서 처음부터 써나가는 습관을 기르고, 책 한권을 만드는 연습을 해야겠다. 프로그래밍 언어를 배우는 것은 매우 재밌는 일, 신기한 일이 벌어지기도 하고 마법같은 기술을 배우는 것 같기도 하다. 프로그래밍이야 말로, 현대의 마법이 아닐까 싶다. 마법을 외우는 주문을 외워 놀라운 세상으로 만들어가는 것이다. 그 즐거운 여정이 계속되기를 바라면서 ..
이매지네이션 라이브러리 해당 요소의 텍스트를 변경하는 자바스크립트 너무 간단해서 유용하게 활용할 수 있는 자바스크립트, 이번 티스토리 구독하기 버튼이 생기면서 페이지의 메타태그 값을 불러오는데, 한 단어로 짧게 구현하고 싶지만 HTML 스킨 편집에 해당 내용을 수정할 수 없고 치환값을 따로 제공하지 않아서 자바스크립트로 텍스트를 변경했다. 티스토리 메인에서 제공되는 어드민 기능의 텍스트 값을 자바스크립트를 활용하여 텍스트를 쉽게 변경하였다. 너무 단순하지만, 의외로 자주 사용되는 기능이다.
이매지네이션 라이브러리 Naver Cloud Services | Products & Services ComputeServer UpdateSSD ServerGPU Server UpdateVirtual Dedicated Server UpdateBare Metal ServerAuto ScalingCloud FunctionsHPC(High Performance Computing)Container RegistryKubernetes Service NewStorageObject Storage UpdateArchive StorageFile StorageBlock Storage UpdateNASBackupData Teleporter UpdateNetworkingLoad BalancerDNSGlobal Internet ServiceCDNGlobal CDNIPsec VPNNAT GatewayGlobal Route Mana..
이매지네이션 라이브러리 User JavaScript and CSS 문자열 앞 해시태그 추가 및 공백제거 User JavaScript and CSS 확장프로그램을 활용하여 해당 사이트의 JavaScript를 추가하거나 수정할 수 있다. Stylebot의 확장 기능인 User JavaScript and CSS를 통해서 해당 해시태그를 수정하거나 추가해줄 수 있다. 위의 해시태그를 추가하여 .before() 속성을 통해 문자열 앞에 내용이나 속성을 추가할 수 있고 Replace() 정규식을 통해서 단어 또는 문자열 사이의 공백을 제거하여 쉽게 해시태그로 활용할 수 있게 된다. 따라서, 해시태그를 복사하거나 편하게 붙여넣기를 하기 위해서 중간 공백을 삭제하거나, 해시태그를 추가하기 쉽기 때문에 해시태그를 추가하는 시간을 효율적으로 단축시킬 수 있게 된다. 티스토리의 경우, .before()에 comma(,)를 추..