반응형

서브라임텍스트3(Sublime Text 3) SFTP/FTP 설치하고 환경 설정하기입니다.

 

서브라임텍스트3(Sublime Text 3) SFTP/FTP 설치

1. 메뉴 → Tools → Command Palette... 를 선택합니다.
2. Package Control: Install Package 를 선택합니다.
3. sftp 로 검색을 한 후 패키지를 선택하게 되면 설치가 됩니다.

서브라임텍스트3(Sublime Text 3) SFTP/FTP 설치

 

 

서브라임텍스트3(Sublime Text 3) SFTP/FTP 셋팅

1. 메뉴 → Project → Add Folder to Project... 클릭하여 미리 만들어 놓은 폴더를 선택합니다.
2. 좌측 Project Folder가 생성되었으면 최상위 폴더에서 우 마우스를 클릭합니다.
3. SFTP/FTP → Map to Remote... 을 선택합니다.

서브라임텍스트3(Sublime Text 3) SFTP/FTP 셋팅

 

서브라임텍스트3(Sublime Text 3) SFTP/FTP 환경설정

1. host, user, password, port, romote_path 를 설정합니다.
2. upload_on_save : 파일 저장 시 서버에 반영을 하는 옵션입니다.

서브라임텍스트3(Sublime Text 3) SFTP/FTP 환경설정

 

주의사항

아톰(Atom)의 경우 SFTP/FTP 연결시 Romote로 먼저 연결 할 경우 서버에 있는 소스를 로컬에 먼저 저장을 시킨 후 로컬에서 저장 시 서버에 반영이 됩니다.
하지만 서브라임텍스트3(Sublime Text 3)는 서버 소스와 Sync 작업을 하지 않았을 경우 서버의 최신 소스를 로컬의 소스로 덮어쓰기를 하게 됩니다.
이점을 꼭 주의해서 작업을 하셔야 하겠습니다.

 

2019/11/21 - [유용한 활용팁] - 서브라임텍스트3 설치하기, 환경 설정하기

 

서브라임텍스트3 설치하기, 환경 설정하기

서브라임텍스트3(Download - Sublime Text 3) 설치하기하고 환경 설정하기입니다. 서브라임텍스트3(Download - Sublime Text 3) 다운로드 및 설치 검색 사이트에서 서브라임텍스트3를 검색하고 맨 상단에 있는 사..

han288.tistory.com

2019/11/20 - [유용한 활용팁] - 서브라임 에디터 EUC-KR 한글 인코딩, 탭 인덴트(들여쓰기) 설정 방법

 

서브라임 에디터 EUC-KR 한글 인코딩, 탭 인덴트(들여쓰기) 설정 방법

서브라임(Sublime Text 3) 에디터에서 EUC-KR 한글 인코딩 및 탭 인덴트 설정 방법입니다. 서브라임(Sublime Text 3) 에디터에서는 한글 인코딩 EUC-KR을 지원하지 않아서 패키지를 설치하여야 합니다. ConvertToU..

han288.tistory.com

 

반응형


반응형

서브라임텍스트3(Download - Sublime Text 3) 설치하기하고 환경 설정하기입니다.

 

서브라임텍스트3(Download - Sublime Text 3) 다운로드 및 설치

검색 사이트에서 서브라임텍스트3를 검색하고 맨 상단에 있는 사이트로 들어가서 다운로드를 받습니다.

(서브라임텍스트3(Download - Sublime Text 3) 다운로드)

 

서브라임텍스트3(Download - Sublime Text 3) 환경 설정하기

1. PACKAGE CONTROL 가져오기

import urllib.request,os,hashlib; h = '6f4c264a24d933ce70df5dedcf1dcaee' + 'ebe013ee18cced0ef93d5f746d80ef60'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); by = urllib.request.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); print('Error validating download (got %s instead of %s), please try manual install' % (dh, h)) if dh != h else open(os.path.join( ipp, pf), 'wb' ).write(by)

(서브라임텍스트3(Download - Sublime Text 3) Package Control)

2. 메뉴 → View → Show Console menu

(서브라임텍스트3(Download - Sublime Text 3) Package Control 설치)

 

2019/11/20 - [유용한 활용팁] - 서브라임 에디터 EUC-KR 한글 인코딩, 탭 인덴트(들여쓰기) 설정 방법

 

서브라임 에디터 EUC-KR 한글 인코딩, 탭 인덴트(들여쓰기) 설정 방법

서브라임(Sublime Text 3) 에디터에서 EUC-KR 한글 인코딩 및 탭 인덴트 설정 방법입니다. 서브라임(Sublime Text 3) 에디터에서는 한글 인코딩 EUC-KR을 지원하지 않아서 패키지를 설치하여야 합니다. ConvertToU..

han288.tistory.com

 

반응형


반응형

서브라임(Sublime Text 3) 에디터에서 EUC-KR 한글 인코딩 및 탭 인덴트 설정 방법입니다.

서브라임(Sublime Text 3) 에디터에서는 한글 인코딩 EUC-KR을 지원하지 않아서 패키지를 설치하여야 합니다.

 

ConvertToUTF8 설치

1. 메뉴 → Tools → Command Palette... (Ctrl + Shift + P)
2. package install 검색
3. ConvertToUTF8 검색 및 설치

ConvertToUTF8 설치

 

EUC-KR 한글 인코딩

메뉴 → File → Set File Encoding to → Korean(EUC-KR) 선택
깨져 있던 한글이 정상적으로 보입니다.

EUC-KR 한글 인코딩 해결 화면

 

탭(Tab) 인덴트(indent, 들여쓰기) 설정 방법

아톰과 서브라임을 같이 사용하고 있습니다.


아톰과 동일하게 탭을 넣었을 때 2개 간격만 들어가게 변경하는 방법입니다.
에디터 우측 하단을 보면 Tab Size: 4라고 표시된 곳을 마우스로 클릭합니다.
Tab Width: 2를 선택하면 동일하게 변경을 할 수 있습니다.

탭(Tab) 인덴트(indent, 들여쓰기) 설정 방법

반응형


반응형

Microsoft Windows10(마이크로소프트 윈도우10)에서 유닉스, 리눅스처럼 Symbolic Link(심볼릭 링크, 바로가기) 

생성하는 방법입니다.

예전 윈도우 버전에서는 자체 기능이 없어서 별도 프로그램을 이용하여 만들었습니다.

하지만 Microsoft Windows10(마이크로소프트 윈도우10)에서는 파워쉘(PowerShell)을 이용하여 유닉스, 리눅스처럼 Symbolic Link(심볼릭 링크) 을 구성할 수 있습니다.


아래는 마이크로소프트(Microsoft) 사이트에서 발췌한 내용입니다.

심볼 링크는 다른 파일 시스템 개체를 가리키는 파일 시스템 개체입니다. 가리키는 개체를 대상 이라고 합니다. 사용자에 게 기호 링크가 투명 하 게 제공 됩니다. 링크는 일반 파일 또는 디렉터리로 표시 되며, 같은 방식으로 사용자 또는 응용 프로그램에 의해 처리 될 수 있습니다. 심볼 링크는 마이그레이션 및 UNIX 운영 체제와의 응용 프로그램 호환성에 도움이 되도록 설계 되었습니다. Microsoft는 UNIX 링크와 마찬가지로 함수에 대 한 심볼 링크를 구현 했습니다.

 

심볼릭링크 명령을 넣는 화면 열기

- 윈도우10 돋보기를 클릭 후 "powershell" 을 입력합니다.
- 관리자로 실행을 합니다.

심볼릭링크 명령을 넣는 화면 열기

심볼릭링크 만들기

명령어)
New-Item -ItemType SymbolicLink -Path "원하는 디렉토리" -Name "신규 이름" -Target "실제 디렉토리 위치"

예시)
New-Item -ItemType SymbolicLink -Path "C:\Users\USER\Google 드라이브\" -Name "회사" -Target "C:\Users\USER\OneDrive"

심볼릭링크 만들기

반응형


반응형

PHP에서 2차원(다차원) Array(배열)에 있는 값을 UNSET을 이용하여 삭제 후
array_values을 이용하여 배열의 인덱스를 재 정렬하는 방법입니다.

1. 2차원 배열을 for 반복문을 돌리면서 in_array를 이용하여 원하는 조건을 찾습니다.

2. 해당 조건에 맞는 배열값을 찾았을 때 그 인덱스(index) 정보를 저장을 합니다.

3. 삭제를 해야 하는 인덱스 정보를 이용하여 unset으로 해당 배열을 삭제합니다.
- 삭제를 하고 나면 인덱스 정보가 0, 1, 2, 3 에서 0, 2 만 남게 됩니다.
- 이 상태로 이 배열을 for 반복문을 돌리게 되면 0 인덱스 값은 가져 오지만 2의 인덱스는
  맞지가 않아서 가져 오지 못합니다.

4. array_values를 이용하여 인덱스 값을 재정렬합니다.
- 0, 2의 인덱스가 0,1로 바뀌게 됩니다.

$prd_list = array
(
    array
        (
            'company' => '가',
            'sale_yn' => '판매가능'
        ),
    array
        (
            'company' => '나',
            'sale_yn' => '판매중지'
        ),
    array
        (
            'company' => '다',
            'sale_yn' => '판매가능'
        ),
    array
        (
            'company' => '라',
            'sale_yn' => '판매중지'
        )

);

print_r2($prd_list);

for($i=0;$i<count($prd_list);$i++){

  if(in_array("판매중지", $prd_list[$i]) == true){
    $sale_end[] = $i;
  }
}

print_r2($sale_end);

for( $j=0; $j < count($sale_end); $j++ )
{
  unset($prd_list[$sale_end[$j]]);
}

print_r2($prd_list);

$prd_list = array_values($prd_list);
print_r2($prd_list);

 

PHP 2차원 Array에서 unset후 배열 index 재 정렬 방법

in_array

(PHP 4, PHP 5, PHP 7)

in_array Checks if a value exists in an array

Description

in_array ( mixed $needle , array $haystack [, bool $strict = FALSE ] ) : bool

Searches for needle in haystack using loose comparison unless strict is set.

Parameters

needle

The searched value.

Note:

If needle is a string, the comparison is done in a case-sensitive manner.

haystack

The array.

strict

If the third parameter strict is set to TRUE then the in_array() function will also check the types of the needle in the haystack.

Return Values

Returns TRUE if needle is found in the array, FALSE otherwise.

Examples

Example #1 in_array() example

$os = array("Mac", "NT", "Irix", "Linux");
if (
in_array("Irix", $os)) {
echo
"Got Irix";
}
if (
in_array("mac", $os)) {
echo
"Got mac";
}
?>

The second condition fails because in_array() is case-sensitive, so the program above will display:

Got Irix

Example #2 in_array() with strict example

$a = array('1.10', 12.4, 1.13);

if (
in_array('12.4', $a, true)) {
echo
"'12.4' found with strict check\n";
}

if (
in_array(1.13, $a, true)) {
echo
"1.13 found with strict check\n";
}
?>

The above example will output:

1.13 found with strict check

Example #3 in_array() with an array as needle

$a = array(array('p', 'h'), array('p', 'r'), 'o');

if (
in_array(array('p', 'h'), $a)) {
echo
"'ph' was found\n";
}

if (
in_array(array('f', 'i'), $a)) {
echo
"'fi' was found\n";
}

if (
in_array('o', $a)) {
echo
"'o' was found\n";
}
?>

The above example will output:

'ph' was found 'o' was found

반응형


반응형

HTML5, CSS 편집기 아톰(Atom)에서 Emmet을 이용한 A태그(Tag) 생성 방법입니다.

 

HTML5, CSS 편집기 아톰(Atom) Emmet A 태그(Tag) 단축키

a[#].icon$>span{icon$} + TAB

HTML5, CSS 편집기 아톰(Atom) Emmet 유용한 단축키 - A 태그(Tag) 생성 방법

 

HTML5, CSS 편집기 아톰(Atom) Emmet A 태그(Tag) 생성

A태그 및 그 안의 SPAN 태그도 같이 한번에 생성하였습니다.

HTML5, CSS 편집기 아톰(Atom) Emmet A 태그(Tag) 생성

HTML5, CSS 편집기 아톰(Atom) Emmet A 태그(Tag) 복사

생성된 태그에 뒤에 마우스를 놓고 Ctrl + Shift + D 를 통해서 줄 복사를 합니다.

HTML5, CSS 편집기 아톰(Atom) Emmet A 태그(Tag) 복사

 

HTML5, CSS 편집기 아톰(Atom) Emmet A 태그(Tag) 편집 및 완성

줄복사한 내용이 숫자들을 순서에 맞게 변경하여 완료합니다.

HTML5, CSS 편집기 아톰(Atom) Emmet A 태그(Tag) 편집 및 완성

 

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
</head>
<body>

  a[#].icon$>span{icon$}
  
  <a href="#" class="icon1"><span>icon1</span></a>
  <a href="#" class="icon2"><span>icon2</span></a>
  <a href="#" class="icon3"><span>icon3</span></a>
  <a href="#" class="icon4"><span>icon4</span></a>
  <a href="#" class="icon5"><span>icon5</span></a>

</body>
</html>

 

2019/10/25 - [유용한 활용팁] - HTML5, CSS3, JavaScript, PHP, Python 편집기 아톰(Atom) 유용한 단축키 활용법 - 줄복사, 줄찾기(검색), 일괄주석, 파일검색

 

HTML5, CSS3, JavaScript, PHP, Python 편집기 아톰(Atom) 유용한 단축키 활용법 - 줄복사, 줄찾기(검색), 일괄주석, 파일검색

HTML5, CSS3, JavaScript, PHP, Python 편집기 아톰(Atom) 사용 시 유용한 단축키입니다. 줄 복사 한줄 내용을 그대로 다음줄에 복사합니다. 단축 키 : Ctrl + Shift + d 주석 일괄 처리 원하는 블럭을 한번에 주..

han288.tistory.com

 

반응형


반응형

JavaScript(자바스크립트)에서 구분자를 이용하여 배열 만들기

// 구분자로 구성된 문자열
var str = "aa/bb/cc/dd/ee"; 

// 구분자(/)를 통해 나뉜 결과는 배열로 저장된다.
var arr = str.split("/");  

// 결과값 : ["aa", "bb", "cc", "dd", "ee"]
console.log(arr);

JavaScript(자바스크립트)에서 구분자를 이용하여 배열 만들기

 

JavaScript(자바스크립트) 타입 변경하기(String, Number)

// 숫자를 스트링로 바꾸기
var tt = 2
console.log(typeof tt);    // Result : number
tt = String(tt);
console.log(typeof tt);    // Result : string

// 스트링을 숫자로 바꾸기
tt = "2"
console.log(typeof tt);    // Result : string
tt = Number(tt);
console.log(typeof tt);    // Result : number

JavaScript(자바스크립트) 타입 변경하기(String, Number)

Number 이외에 parseInt를 사용할 수 있습니다.
- Number는 문자열이 숫자가 아닌 경우 NaN으로 리턴을 합니다.
- parseInt는 문자열이 숫자로 시작하는 경우에는 숫자가 끝날때 까지만 형변환하여 리턴을 합니다.

var num = Number('1000달러');

console.log (num);
// 결과값 NaN

var num = parseInt('1000달러'); 

console.log (num);
// 결과값 1000

Number와 parseInt 비교

※ parseFloat() : 문자열을 실수로 바꿔줍니다.

tt = "2.1"

tt = parseFloat(tt);
console.log(tt);
// Result : 2.1

tt = parseInt(tt);
console.log(tt);             
// Result : 2

parseFloat와 parseInt 비교

 

2019/10/23 - [유용한 활용팁] - JavaScript Input 날짜 체크, Date 만들기 - isDate, getDate, calcDate

 

JavaScript Input 날짜 체크, Date 만들기 - isDate, getDate, calcDate

JavaScript로 Input type의 날짜를 체크하는 함수들입니다. isDate 함수 날짜 형식이 맞는지 체크하는 함수입니다. 입력값 형식은 yyyymmdd, yyyy-mm-dd, yyyy/mm/dd 3가지 사용을 할 수 있습니다. function isDat..

han288.tistory.com

2019/10/29 - [유용한 활용팁] - JavaScript Input 생년월일 유효성 검사하기 - isBirthDay, 2월 29일 윤년 계산

 

JavaScript Input 생년월일 유효성 검사하기 - isBirthDay, 2월 29일 윤년 계산

JavaScript로 input 입력값에 대한 생년월일 유효성 검사하기 1. 입력값 : YYYYMMDD 2. return 값: true / false 3. 2월 29일(윤년) 체크 function isBirthday(dateStr) { var year = Number(dateStr.substr(0,4))..

han288.tistory.com

2019/11/07 - [유용한 활용팁] - JavaScript(자바스크립트), Jquery를 이용하여 이미지 바뀌게(토글, toggle) 하는 방법 - replace 활용

 

JavaScript(자바스크립트), Jquery를 이용하여 이미지 바뀌게(토글, toggle) 하는 방법 - replace 활용

자바스크립트(JavaScript), Jquery를 이용하여 이미지 바뀌게(토글, toggle) 하는 방법입니다. 1. 클릭 이벤트를 캡쳐합니다. 2. 클릭한 객체로 children를 이용하여 이미지 노드를 찾아갑니다. 3. 현재 이미지 속..

han288.tistory.com

 

반응형


반응형

사이트를 운영하다 보면 별도의 디렉토리를 이용하여 서브 도메인을 구성한 후
해당 디렉토리로 접근 시 서브 도메인으로 리다이렉트(Redirect, 이동)해야 할 때가 있습니다.

이 때는 해당 디렉토리에서 .htaccess를 생성 후 아래와 같이 처리를 하게 되면
원하는 대로 페이지가 이동하게 됩니다.

RewriteEngine On

RewriteCond %{HTTP_HOST} ^domain.com [NC]
RewriteRule ^(.*)$ http://www.domain.com$1 [L,R=301]
RedirectMatch 301 ^/test/(.*)$ http://test.domain.com/$1

위와 같이 설정을 하였을 때의 결과는
http://www.domain.com/test 로 들어오게 되면 http://test.domain.com/로 바뀌게 됩니다. 

 

.htaccess를 이용하여 301 리다이렉트(Redirect, 이동)하기 - 아파치(Apache) mod_rewrite 이용

RewriteEngine On
RewriteEngine을 사용하는 것을 설정합니다.

HTTP_HOST
URL 에서 호스트 이름 부분이며 클라이언트가 보낸 HTTP 헤더중 Host: 헤더에 있는 값이 됩니다.
가상 호스트 기반 rewrite 규칙을 설정할 경우에 많이 사용됩니다.

NC
대소문자를 구분하지 않습니다.

R=301은 그 주소로 영구 이동하는 것입니다.
R=301로 기재를 하면 도메인 주소를 바꿨을 때에 검색 엔진이, 예전 주소를 바뀐 새 주소로 갱신하여 줍니다.

프로그램으로 리다이렉트를 할 수 있지만 이 경우 단순 페이지 이동이기 때문에 전체 URL변경은 할 수 없습니다.
하지만 .htaccess를 활용하게 되면 하위 주소까지 모두 도메인을 바꿀 수가 있습니다.

반응형

+ Recent posts