HTML 편집기_서브라임 텍스트 편집기서브라임 텍스트 (Sublime Text)는 현재 많은개발자분들이 사용하는 편집기중 하나입니다.필자는 코딩을 처음 시작할 때 에디터 플러스를 사용하였습니다.그 후 작업시 맥을 사용하면서 서브라임을 사용하기 시작했습니다.서브라임 텍스트는다양한 기능을 제공하면서사용자의 편리를 강화한 텍스트 편집기 입니다.특별히, 서브라임에서 사용 가능한 플러그인을 사용하면효율적으로 작업을 할 수 있습니다.다음은, 유튜브에 소개된 베스트 플러그인 영상입니다.플러그인을 설치하기 위해서는우선, Package Control 을 설치하여야 합니다.다음 링크로 가시면 설치 방법을 보실 수 있습니다.https://packagecontr.......

Mac OS_맥 터미널 vi에디터를 이용한 아파치 경로 수정vi 에디터 사용법-vi 에디터는 대부분의 Unix 시스템에서 사용할 수 있습니다.-방향키와 기능키에 의존하지 않고 표준 알파벳 키를 사용해서 명령어를 전달합니다. vi 에디터를 사용해서 기본적인 텍스트 추가, 변경, 삭제가 가능합니다.-vi 에디터를 사용하는 첫번째 방법은 vi filename 명령어를 사용합니다. 만약 파일이 현재 폴더에 없을 경루 전체 경로를 사용해야 합니다.-텍스트를 입력하기 위해서는 초기 command mode에서 타이핑이 가능한 insert mode로 전환을 해줘야 합니다. 그때 사용하는 키가 바로 ‘i’ 키 입니다.-텍스트 입력을 완료하면 키를 눌러 command mo.......

자바스크립트 정규식표현 정리 정규표현식에서 사용하는 기호를 Meta문자라고 합니다. Meta문자는 표현식 내부에서 특정한 의미를 갖는 문자를 말하며,공통적인 기본 Meta문자의 종류는 다음과 같습니다. JavaScript에서 정규표현식은 객체입니다.이러한 패턴은 RegExp의 exec와 test 메소드들, 그리고 String의 match, replace, search, split 메소들과 함께 사용됩니다. (정규표현식 테스트 링크)http://gskinner.com/RegExr/ 정규식표현설명 ^x문자열이 x로 시작한다 x$문자열이 x로 끝난다 .x임의의 한 문자를 표현한다 x+x가 1번이상 반복한다 x? x가 존재하거나 존재하지 않는다 x* x가 0번이상 반복한다 x|yx또는 y를 찾는다 (x)()안의 내.......

GIT 분산 버전 관리 시스템 -HEAD: 현재 브랜치/저장소의 위치를 알려줍니다.-master: 저장소를 만들때 브랜치 초기 설정 이름 = main branch-origin: 원격 main 저장소-Git은 SHA-1 해시를 이용하여 40자 길이의 16진수 문자열인 체크섬을 만든다. Git은 파일을 이름으로 저장하지 않고 해당 파일의 해시로 저장한다-Committed란 데이터가 로컬 데이터베이스에 안전하게 저장됐다는 것을 의마한다-Modified는 수정한 파일을 아직 로컬 데이터베이스에 커밋하지 않은 것을 말한다-Staged란 현재 수정한 파일을 곧 커밋할 것이라고 표시한 상태를 의미한다-워킹 디렉토리에서 파일을 수정한다-Staging Area에 파일을 Stage해서 커밋할 스냅샷을 만.......

사용자 인터페이스 (UI)_하드코딩 웹표준 마크업 코딩 관련 UI자료를 공유합니다.관련 이미지 참고후 마크업 코딩을 복사하셔서JS Bin에 있는 HTML 페이지에 붙여넣기 하시면결과를 확인하실 수 있습니다. 모바일_Flicking Page 소스코드 확인1234567891011121314151617181920212223JS Bin.mflick{overflow:hidden;height:200px;border:1px solid #e85349}.flick-ct{float:left;width:80px;height:150px;margin-right:10px;background:#00a178}.flick-ct a{display:block;height:100%}

HTML/CSS 마크업 정리_실무편 -이미지 opacity 설정 img(opacity:0.4;filter:alpha(opacity=40))-font-family 지정시 sans-serif 도 함께 지정해 준다 ex) font-family{tahoma, sans-serif}-모바일 이미지 스프라이트 제작시 폰트 숨김처리는 color:transparent 속성으로 한다-pc제작시에는 font-size:0;line-height:0 속성 적용-IE8 까지 싱글콜론 CSS2 속성 (:before) 지원하고 더블콜론 (::before) CSS3 속성은 IE9부터 적용-webkit 관련자료 https://developer.mozilla.org/en/docs/Web/CSS/Reference/Webkit_Extensions-가상 선택자를 활용한 모바일 클릭영역 확보-http vs. https의 차이점-git diff/ css/ 완성화면 전달 시 폰트/디자인 레.......

HTML/CSS_반응형 이미지 자동 최적화 다양한 스마트기기의 등장으로, 반응형 이미지는 마크업에서 매우 중요한 이슈가 되었습니다. 오늘 제가 공유할 내용은 2015년 9월 1일자 크롬뉴스에 소개된 "이미지 최적화 문제" 입니다. "이미지 최적화의 어려움과 이미지 자동화만이 해답이다"라는 소제목으로 소개된 저자 Ilya Grigorik의 글은 반응형 이미지에 대한 심도깊은 내용을 담고 있습니다. 우선 이미지 최적화의 몇 가지 어려움이 있습니다. 1) 적합한 이미지 포맷 정하기 (벡터 vs. 래스터=픽셀)2) 이미지 인코딩 포맷 정하기 (jpeg, WebP, etc)3) 이미지 압축시 손실되는 정보 최소화하기4) 다양한 디스플레이 크기와 DPR (Device Pixel Rat.......

Xcode(엑스코드) 아이폰시뮬레이터 설치하기웹퍼블리셔 작업을 하다보면 자신이 만든 산출물이다양한 모바일 기기에서도 잘 나오는지 꼭 확인이 필요합니다.저는 작업시 맥을 사용해서iOS에서 쉽게 사용할 수 있는 XCODE를 소개합니다.사실, 이 앱은 웹퍼블리싱을 목적으로 만들어진프로그램은 아닙니다.앱 개발자가 자신이 만든 앱을 컴퓨터에서다양한 모바일 기기를 사용하는 것처럼테스트 하기 위해 사용합니다.오늘은 그 다양한 기능중에서IOS 시뮬레이터 사용방법에 대한포스팅을 소개합니다.링크된 웹사이트에 설치 절차가 자세하게 나와있지만영어가 어려우신 분들을 위해 한국어로 간단히 설명하였습니다.1. 앱스토어에서 Xcode를 다운.......