확장형 뇌 저장소

[MSSQL] DateTime(날짜) 범위 조건 검색 시 주의 사항

떨어지는 용 — Thu, 2 Nov 2023 09:51:24 +0900

DateTime(날짜) 범위 조건 검색 시 주의 사항

특정 날짜 이하인 경우

발생했던 문제

WHERE inserted_datetime <= '2023-10-30 23:59:59'

위와 같이 조건을 설정했을 경우
2023-10-30 23:59:59.305 같이 마이크로 초에 입력한 데이터가 조건에 포함되지 않는 문제를 확인

해결 방법

방법 1. 날짜에 하루를 더하고 00:00:00으로 조건을 미만으로 수정

WHERE inserted_datetime < '2023-10-31 00:00:00'

방법 2. 마이크로 초를 조건에 추가

WHERE inserted_datetime <= '2023-10-30 23:59:59.999'

1000마이크로 초 = 1초

[git] 커밋하고 푸시하기 과정 (git commit, push)

떨어지는 용 — Tue, 25 Apr 2023 16:12:51 +0900

▶[git] 커밋하고 푸시하기 과정 (git commit, push)

▶설명

오늘은 일반적으로 git에서 파일을 수정한 후에

커밋(commit)하고 푸시(push)하는 과정에 대해 다뤄보겠습니다.

▶과정

해당 과정은 파일을 수정한 후부터 다루고 있습니다.

1. git pull 명령어로 원격 저장소의 데이터를 로컬 저장소에 최신화합니다.

만약 이 과정을 건너뛰고 커밋(commit)하면 푸시(push)할 때 충돌이 발생하여 pull하고나서 병합(merge) 된 내용을 푸시(push)하게 될 것입니다.

git pull

Already up to date.

만약 Already up to date.라고 뜨면 이미 최신화되어 있다는 의미입니다.

2. git status 명령어로 로컬 작업 공간의 상태를 확인합니다.

git status

예시로 README.md 파일을 수정하였습니다.

3. git diff 명령어로 수정된 파일의 내용을 확인합니다.

git diff

4. 내용을 확인했으면 git add 명령어로 작업 사항을 스테이지에 추가합니다.

git add .

. 은 모든 파일을 의미합니다.

모든 파일을 스테이지에 올리고 싶지 않은 경우에는 파일명으로 스테이지에 추가하시기 바랍니다.

예시)

git add README.md

5. git status 명령어로 상태를 확인합니다.

git status

스테이지에 파일이 추가된 것을 확인합니다.

6. git commit 명령어로 커밋(commit)합니다.

-m 옵션은 커밋 메시지를 남길 때 사용하는 옵션입니다.

git commit -m "Message Text"

7. git status 명령어로 상태를 확인합니다.

git status

예시에서는 현재 원격 저장소에 푸시(push)할 수 있는 커밋(commit)이 1건 존재하는 것을 확인할 수 있습니다.

8.git push 명령어를 사용하여 로컬 저장소에 있는 커밋(commit)을 원격 저장소로 올립니다.

git push

만일 작업 중에 원격 저장소에 누군가가 올렸을 경우 최신화가 되지 않았기 때문에 git pull 과정을 거쳐야 할 수도 있습니다.

이로써 파일을 수정한 후에 커밋(commit)하고 푸시(push)하는 과정은 끝입니다.

▶마치며

이번에는 git에서 커밋(commit)하고 푸시(push)하는 과정을 상세하게 다뤄봤습니다.

도움이 되었으면 좋겠습니다.

[TIP] 원격 데스크톱 클립보드 붙여넣기 문제 해결

떨어지는 용 — Tue, 25 Apr 2023 15:07:54 +0900

▶[TIP] 원격 데스크톱 클립보드 붙여넣기 문제 해결

▶설명

원격 데스크톱에서 클립보드 붙여넣기 같은게 안되는 경우가 있습니다.

그럴 때는 다음과 같이 진행합니다.

참고 : https://extbrain.tistory.com/123

[TIP] 원격 데스크톱 연결 실행하기

▶ [TIP] 원격 데스크톱 연결 실행하기 ▶ 설명 프로그래머로서 업무를 진행하다보면, 원격 접속을 위해 원격 데스크톱 연결을 실행하는 경우가 많습니다. 많은 원격 리스트를 관리하기 위해 프

extbrain.tistory.com

▶확인

1. 원격 데스크톱 연결에서 [로컬 리소스] 탭에 들어갑니다.

2. 클립보드가 체크되어 있는지 확인합니다. 클립보드를 체크해야 클립보드 내용을 원격 데스크톱에 붙여넣을 수 있습니다.

▶방법

위와 같이 정상적으로 체크되었지만, 안되는 경우에는 아래와 같이 진행합니다.

1. 원격 데스크톱에서 [작업 관리자]를 실행합니다.

2. ①[RDP 클립보드 모니터]를 찾은 후 ②[작업 끝내기]를 합니다.

3. 작업 관리자에서 [파일] > [새 작업 실행] 또는 단축키 [Win + R]을 입력합니다.

4. [rdpclip]를 입력하고 [Enter] 또는 [확인]을 눌러 실행합니다.

5. 정상적으로 클립보드의 내용이 붙여지는 것을 확인하면 끝입니다.

▶마치며

원격 데스크톱 환경에서 클립보드 붙여넣기가 안되는 경우 또한 자주 있습니다.

도움이 되었으면 좋겠습니다.

[TIP] 키보드 자음 모음 분리 문제 해결하기 (ㅈㅏㅇㅡㅁ ㅁㅗㅇㅡㅁ ㅂㅜㄴㄹㅣ)

떨어지는 용 — Tue, 25 Apr 2023 14:28:58 +0900

▶ [TIP] 키보드 자음 모음 분리 문제 해결하기 (ㅈㅏㅇㅡㅁ ㅁㅗㅇㅡㅁ ㅂㅜㄴㄹㅣ)

▶ 설명

키보드 자음 모음이 분리되어 입력되는 문제가 발생할 때가 있습니다.

보통 아래처럼 자음 모음 분리 같은 형식으로 검색합니다.

ㅋㅣㅂㅗㄷㅡㄹ ㅈㅏㅇㅡㅁ ㅁㅗㅇㅡㅁㅇㅣ ㅂㅜㄴㄹㅣ ㄷㅗㅣㄴㅡㄴ ㅁㅜㄴㅈㅔ

간단하게 해결할 수 있는 방법을 알아보도록 하겠습니다.

▶ 원인

여러가지일 수 있지만, 일반적으로는 단축키를 잘못 눌러서 발생합니다.

문제가 되는 단축키는 [Win + H]입니다.

눌러보시면 자음 모음이 분리되는 것을 확인할 수 있습니다.

▶ 방법1

해결 방법 역시 단축키로 해결 할 수 있습니다.

해결을 위한 단축키는 [Win + V]입니다.

자음 모음 문제가 정상적으로 돌아온 것을 확인할 수 있습니다.

▶ 방법2

첫 번째 방법으로 안되었거나, 단축키를 까먹을 것 같으면 다음과 같은 방법도 있습니다.

1. 단축키는 [Ctrl + Shift + ESC]를 눌러 작업 관리자를 실행합니다.

2. ①[Microsoft Text Input Application] 을 찾은 후 ②[작업 끝내기] 해주세요.

자음 모음 문제가 정상적으로 돌아온 것을 확인할 수 있습니다.

▶ 마치며

몇 달에 한 번은 해당 문제로 고생하고 있습니다.

도움이 되었으면 좋겠습니다.

[Javascript] Math.floor 와 parseInt 차이점

떨어지는 용 — Mon, 24 Apr 2023 15:44:42 +0900

▶Javascript Math.floor 와 parseInt 차이점

▶설명

Javascript 함수 중에 Math.floor와 parseInt 2가지 모두 역할이 비슷해서 헷깔립니다.

2개의 함수의 차이점을 알아보도록 하겠습니다.

▶설명

Math.floor

참고 : https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/floor

Math.floor() - JavaScript | MDN

The Math.floor() static method always rounds down and returns the largest integer less than or equal to a given number.

developer.mozilla.org

Math.floor 함수의 설명을 보면 항상 소수점을 내림한다고 나옵니다.

parseInt

참고 : https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/parseInt

parseInt() - JavaScript | MDN

The parseInt() function parses a string argument and returns an integer of the specified radix (the base in mathematical numeral systems).

developer.mozilla.org

parseInt 함수는 정수로 반환해주는 함수입니다.

▶차이점

Math.floor 와 parseInt 모두 소수점을 없애는 것은 동일합니다. 그러면 차이점은 무엇일까요?

간단한 예시를 통해 확인해보도록 하겠습니다.

양수

Math.floor(3.14)        // 3
Math.floor(15.29)       // 15
Math.floor(2003.777)    // 2003

parseInt(3.14)          // 3
parseInt(15.29)         // 15
parseInt(2003.777)      // 2003

아래는 크롬 개발 도구의 콘솔에서 실행한 결과입니다.

크롬 개발자 도구의 콘솔에서 실행한 결과

양수일 경우 2개의 함수의 결과는 동일하게도 소수점을 버린 정수 값이 오는 것을 확인할 수 있습니다.

차이점은 음수의 경우 발생합니다.

음수

Math.floor(-3.14)        // -4
Math.floor(-15.29)       // -16
Math.floor(-2003.777)    // -2004

parseInt(-3.14)          // -3
parseInt(-15.29)         // -15
parseInt(-2003.777)      // -2003

아래는 크롬 개발 도구의 콘솔에서 실행한 결과입니다.

크롬 개발자 도구의 콘솔에서 실행한 결과

parseInt의 경우 소수점 버리는 것으로 끝이지만, Math.floor 는 소수점을 내림 했기 때문에 값이 다른 것을 알 수 있습니다.

▶마치며

2개의 함수 모두 자주 사용하는 함수 입니다.

본인의 의도에 맞게 사용하는게 좋다고 생각합니다.

도움이 되었으면 좋겠습니다.

[Javascript] 랜덤 정수 생성하기 (Random Number)

떨어지는 용 — Mon, 24 Apr 2023 15:05:33 +0900

▶Javascript 랜덤 정수 생성하기 (Random Number)

▶설명

Javascript 함수 중에 Math.random 함수가 존재합니다.

이 함수를 이용해 램덤한 정수를 반환하는 함수를 만들어보겠습니다.

참고 : https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/random

Math.random() - JavaScript | MDN

The Math.random() static method returns a floating-point, pseudo-random number that's greater than or equal to 0 and less than 1, with approximately uniform distribution over that range — which you can then scale to your desired range. The implementation

developer.mozilla.org

▶Math.random 함수

우선 Math.random 함수에 대해 간단히 알아보겠습니다.

이 함수는 0~1 값을 반환하는 난수 생성 함수입니다.

코드

Math.random()

아래는 크롬 개발 도구의 콘솔에서 실행한 결과입니다.

크롬 개발자 도구의 콘솔에서 실행한 결과

첫 번째 실행 결과

0.0844180861809749

두 번째 실행 결과

0.5368967883531293

세 번째 실행 결과

0.7504543498870786

위의 결과를 확인해보면 3개의 값이 모두 다른 것을 확인 할 수 있습니다.

▶범위 내의 랜덤 정수 가져오기

이제 범위 내의 랜덤 정수를 가져오는 함수를 알아보도록 하겠습니다..

함수

function getRandom(min, max)
{
	return Math.floor(Math.random() * (max - min + 1) + min);
}

함수 테스트 코드

getRandom(1, 10)

1~10 사이의 랜덤한 정수를 가져오는 것을 확인하기 위한 테스트 코입니다.

아래는 크롬 개발 도구의 콘솔에서 실행한 결과입니다.

1~10 사이에서 랜덤한 정수를 가져오는 것을 확인할 수 있습니다.

▶마치며

랜덤 함수 또한 자주 사용하는 함수입니다.

도움이 되었으면 좋겠습니다.

[git] 변경점 비교하기 (git diff)

떨어지는 용 — Fri, 21 Apr 2023 12:04:16 +0900

▶[git] 변경점 비교하기 (git diff)

▶설명

git에서 커밋(commit)을 진행하기 전에 반드시 파일의 변경 사항을 확인하고 진행하는걸 추천합니다.

오늘은 변경점을 비교할 수 있는 명령어를 간단히 알아보겠습니다.

극히 일부만 다루는 점 알아주세요.

▶사용법

아래의 내용은 git 에서 제공한 사용법입니다. 이 중에 자주 사용하는 몇 가지만 알아보겠습니다.

usage: git diff [<options>] [<commit>] [--] [<path>...]
   or: git diff [<options>] --cached [--merge-base] [<commit>] [--] [<path>...]
   or: git diff [<options>] [--merge-base] <commit> [<commit>...] <commit> [--] [<path>...]
   or: git diff [<options>] <commit>...<commit> [--] [<path>...]
   or: git diff [<options>] <blob> <blob>
   or: git diff [<options>] --no-index [--] <path> <path>

common diff options:
  -z            output diff-raw with lines terminated with NUL.
  -p            output patch format.
  -u            synonym for -p.
  --patch-with-raw
                output both a patch and the diff-raw format.
  --stat        show diffstat instead of patch.
  --numstat     show numeric diffstat instead of patch.
  --patch-with-stat
                output a patch and prepend its diffstat.
  --name-only   show only names of changed files.
  --name-status show names and status of changed files.
  --full-index  show full object name on index lines.
  --abbrev=<n>  abbreviate object names in diff-tree header and diff-raw.
  -R            swap input file pairs.
  -B            detect complete rewrites.
  -M            detect renames.
  -C            detect copies.
  --find-copies-harder
                try unchanged files as candidate for copy detection.
  -l<n>         limit rename attempts up to <n> paths.
  -O<file>      reorder diffs according to the <file>.
  -S<string>    find filepair whose only one side contains the string.
  --pickaxe-all
                show all files diff when -S is used and hit is found.
  -a  --text    treat all files as text.

아래의 이미지는 해당 글에서 다루는 내용의 요약입니다.

▶작업 폴더와 스테이지 영역 비교

현재 작업 폴더(Working Directory)와 스테이지 영역(Staging Area) 모든 파일을 비교합니다.

모든 파일 비교

git diff

특정 파일 비교

git diff [filename]

예시

예시는 파일을 수정한 것을 전제로 작성하였습니다.

1. git 상태를 확인합니다.

git status

①수정된 파일
②새로 추가되어 추적되지 않는 파일

2. git diff 명령어로 전체 변경점을 비교해보도록 하겠습니다.

git diff

①첫 번째 파일 변경점
②두 번째 파일 변경점
새로 추가되어 추적되지 않는 파일은 비교점이 없는 것을 알 수 있습니다.

3. 특정 파일의 변경점만 비교해보겠습니다.

git diff [filename]

4. 모든 파일을 스테이지 영역에 추가해보겠습니다.

git add .

5. 다시 전체 파일 변경점을 비교해보겠습니다.

git diff

모든 파일이 스테이지 영역에 추가되었으므로 변경점이 없는 것을 알 수 있습니다.

6. 스테이지에 추가된 파일 중 하나를 수정해보겠습니다. 상태를 보면 아래와 같습니다.

git status

7. git diff 명령어로 전체 변경점을 비교해보도록 하겠습니다.

git diff

위와 같이 스테이지 영역에 올라간 파일과 어떻게 다른지 비교할 수 있습니다.

▶스테이지 영역과 저장소 HEAD 비교

명령어.

git diff --staged

--staged 옵션을 사용하면 스테이지 영역과 저장소 HEAD를 비교합니다.

예시

이 예시는 이전 예시에서 이어집니다.

1. git 상태를 확인합니다.

git status

2. 스테이지 추가되어 있는 파일과 저장소를 비교합니다.

git diff --staged

3. 현재 작업 폴더와 스테이지를 비교한 아래와 같습니다.

git diff

작업 영역에서 test가 test2로 수정되었습니다.

▶작업 사항과 HEAD 비교

명령어

git diff HEAD

명령어 HEAD를 추가하면 스테이지와 작업 폴더를 포함하여 HEAD 커밋과 비교합니다.

예시

이 예시는 이전 예시에서 이어집니다. 파일 수정 상황은 이전과 동일합니다.

1. git 상태를 확인합니다.

git status

2. git diff HEAD 명령어를 사용합니다.

git diff HEAD

스테이지 : test
작업 영역 : test2

스테이지와 작업 폴더를 포함하여 HEAD 커밋과 비교하였기 때문에 작업 영역의 test2로 표시되는 것을 확인할 수 있습니다.

▶파일 변경 줄 수 확인 옵션

명령어

git diff --stat

--stat 을 추가하면 어떤 파일이 몇줄 변경되었는지 개수를 표현해줍니다.

예시

이 예시는 이전 예시에서 이어집니다. 파일 수정 상황은 이전과 동일합니다.

1. git 상태를 확인합니다.

git status

2. 작업 영역과 스테이지 비교

git diff --stat

3. 스테이지와 저장소 HEAD 비교

git diff --staged --stat

4. 작업 사항과 HEAD 비교.

git diff HEAD --stat

▶마치며

이외에도 브랜치끼리 비교, 커밋끼리 비교 등이 가능합니다.

git 을 사용할 때 정말 자주 사용하는 명령어입니다.

도움이 되었으면 좋겠습니다.

[git] 스테이지에서 제외하기 (git restore --staged)

떨어지는 용 — Thu, 20 Apr 2023 16:40:28 +0900

▶[git] 스테이지에서 제외하기 (git restore --staged)

▶설명

git 에서 커밋(commit)을 하기 위해 스테이지(stage)에 추가했던 파일을 제외할 떄 사용하는 명령어를 알아보도록 하겠습니다.

▶스테이지에서 특정 파일 제외

특정 파일

git restore --staged filename.txt

예시

예시는 파일이 스테이지(staged) 되어 있다는걸 전제로 작성하였습니다.

1. git 상태를 확인합니다.

git status

2. 이제 특정 파일 한개를 스테이지(stage)에서 제외합니다.

git restore --staged README.md

3. git 상태를 확인합니다.

git status

4. 제외된 파일이 스테이지(stage)에서 빠진 것을 확인할 수 있습니다.

▶스테이지에서 전체 파일 제외

명령어

git restore --staged .

git에서 . 은 모든 파일을 의미합니다.

예시

1. git 상태를 확인합니다.

git status

2. 이제 전체 파일을 스테이지(stage)에서 제외합니다.

git restore --staged .

3. git 상태를 확인합니다.

git status

4. 모든 파일이 스테이지(stage)에서 빠진 것을 확인할 수 있습니다.

▶마치며

git 을 사용할 때 정말 자주 사용하는 명령어입니다.

도움이 되었으면 좋겠습니다.

[git] 스테이지에 추가하기 (git add)

떨어지는 용 — Thu, 20 Apr 2023 16:27:03 +0900

▶[git] 스테이지에 추가하기 (git add)

▶설명

git 에서 커밋(commit)을 하기 위해 스테이지(stage)에 추가하는 명령어를 알아보도록 하겠습니다.

▶특정 파일 추가

특정 파일

git add filename.txt

예시

1. git 상태를 확인합니다.

git status

2. 이제 특정 파일 한개를 스테이지(stage)에 추가합니다.

git add untracked.txt

3. git 상태를 확인합니다.

git status

4. 추가한 파일이 스테이지(stage)에 추가된 것을 확인할 수 있습니다.

▶전체 파일 추가

명령어

git add .

git에서 . 은 모든 파일을 의미합니다.

예시

1. git 상태를 확인합니다.

git status

2. 이제 전체 파일을 스테이지(stage)에 추가합니다.

git add .

3. git 상태를 확인합니다.

git status

4. 모든 파일이 스테이지(stage)에 추가된 것을 확인할 수 있습니다.

▶마치며

git 을 사용할 때 정말 자주 사용하는 명령어입니다.

도움이 되었으면 좋겠습니다.

[git] 상태 확인하기 (git status)

떨어지는 용 — Thu, 20 Apr 2023 16:11:01 +0900

▶[git] 상태 확인하기 (git status)

▶설명

git 명령어 중에 git의 현재 상태를 알 수 있는 명령어를 알아보도록 하겠습니다.

▶명령어

git status

해당 명령어를 통하여 확인할 수 있는 정보는 일반적으로 아래와 같습니다.

현재 브랜치가 main 브랜치라는 것을 알 수 있습니다.
현재 스테이징 된 새로운 파일과 수정된 파일을 알 수 있습니다.
현재 스테이징 되지 않은 수정된 파일을 알 수 있습니다.
현재 스테이징 되지 않은 새로운 파일 목록을 알 수 있습니다.

이 외에도 충돌이 발생하였다거나, 문제가 발생하였을 경우에 대한 상태도 확인할 수 있습니다.

▶마치며

git 을 사용할 때 정말 자주 사용하는 명령어입니다.

도움이 되었으면 좋겠습니다.

[git] 가장 최근의 커밋 취소 (git reset HEAD^)

떨어지는 용 — Thu, 20 Apr 2023 15:33:05 +0900

▶[git] 가장 최근의 커밋 취소 (git reset HEAD^)

▶설명

git 명령어 중에 가장 최근의 커밋(commit)을 취소하는 방법을 알아보도록 하겠습니다.

자주 사용하는 명령어라서 간단하게 명령어만 적도록 하겠습니다.

자세한 내용은 git 가이드 문서를 참고하시면 좋습니다.

참고 : https://git-scm.com/book/ko/v2/Git-%EB%8F%84%EA%B5%AC-Reset-%EB%AA%85%ED%99%95%ED%9E%88-%EC%95%8C%EA%B3%A0-%EA%B0%80%EA%B8%B0

Git - Reset 명확히 알고 가기

지금까지 reset 명령을 실행하는 기본 형태와 사용 방법을 살펴봤다. reset 명령을 실행할 때 경로를 지정하면 1단계를 건너뛰고 정해진 경로의 파일에만 나머지 reset 단계를 적용한다. 이는 당연한

git-scm.com

▶명령어

기본

git reset HEAD^

HEAD는 현재 브랜치를 가리키는 포인터입니다.

HEAD^ 의 경우 HEAD의 바로 이전 커밋(commit)으로 돌린다는 의미이다.

reset 에서 제공하는 옵션을 간단하게 정리하였습니다.

soft

git reset --soft HEAD^

커밋(commit) 취소
커밋 취소된 파일은 스테이징으로 복구
파일 수정사항 유지

mixed (기본 옵션)

git reset --mixed HEAD^

두 개의 명령어가 동일합니다.

git reset HEAD^

커밋(commit) 취소
커밋 취소된 파일은 스테이징 취소
파일 수정사항 유지

hard

git reset --hard HEAD^

커밋(commit) 취소
커밋 취소된 파일은 스테이징 취소
파일 수정사항 삭제

간단히 정리하면 아래의 표와 같습니다.

	커밋(Committed) 취소	스테이징(Staged) 취소	파일 수정사항(Modified) 취소
soft	O	X	X
mixed	O	O	X
hard	O	O	O

▶마치며

git 을 사용할 때 정말 자주 사용하는 명령어입니다.

도움이 되었으면 좋겠습니다.

[TIP] 티스토리 글 복구 (삭제, 덮어쓰기)

떨어지는 용 — Thu, 20 Apr 2023 14:51:17 +0900

▶[TIP] 티스토리 글 복구 (삭제, 덮어쓰기)

▶설명

이전 글의 서식을 복사하여 새 글을 작성하다가 이전 글에 새 글을 덮어씌워버리는 글 실수가 있었습니다.

삭제되거나 덮어씌워진 글을 복구하는 방법을 찾기 시작했습니다.

티스토리 정책상 삭제 된 글에 대한 복구가 불가능하다고 합니다.

검색을 통하여 어떻게든 글을 복구하는 방법을 찾긴 찾았습니다.

바로 구글이 크롤링한 글의 내용을 찾는 것입니다.

구글의 크롤링을 의지하는 것이기 때문에 해당 방법은 시간이 생명입니다.

만약 검색 했을 때, 해당 글이 나오지 않을 경우에는 거의 가망이 없다고 보면 됩니다.

2023년 4월 20일 기준으로 아직까지 유효한 방법입니다.

▶방법

1. 구글에서 복구해야하는 글의 제목을 검색합니다. (가급적 블로그 명까지 포함하여 본인의 글이 노출되도록 검색어를 입력합니다.)

2. 복구해야하는 글을 찾았으면 링크 옆에 있는 버튼을 클릭합니다.

3. 우측 하단의 [저장된 페이지] 버튼을 클릭합니다.

4. 구글에서 저장한 블로그 글을 확인할 수 있습니다. 해당 글이 어느 시점에 저장됐는지도 확인할 수 있습니다.

구글의 스냅샷

5. 해당 글을 복사하여 복구합니다.

▶마치며

저도 앞으로 이런 실수를 자주 할 것 같습니다.

벌써 두렵습니다.

본인의 글을 자주 검색하면 도움이 된다고 합니다.

도움이 되었으면 좋겠습니다.

[Javascript] 영어 대소문자와 숫자만 포함하는 정규식

떨어지는 용 — Thu, 20 Apr 2023 14:17:29 +0900

▶Javascript 영어 대소문자와 숫자만 포함하는 정규식

▶설명

사용자의 입력 값을 검사할 때,

일반적으로 아이디 같은 경우에는 영어 대소문자와 숫자만으로 이루어진 문자열인지 검사가 필요합니다.

▶정규식

문자열이 영어 대소문자와 숫자만으로 존재하는지 확인을 위한 정규식은 아래와 같습니다.

/^[a-zA-Z0-9]*$/

정규식으로 검사 방법은 아래처럼 진행하면 됩니다.

var username = "이름";
var regex = /^[a-zA-Z0-9]*$/;
if (!regex.test(username))
{
	alert("실패");
}
else
{
    alert("성공");
}

▶사용 예제

정규식을 사용한 간단한 테스트 코드입니다.

아래는 크롬의 개발자 도구의 콘솔 창에서 작성한 테스트 코드입니다.

테스트 코드

개발자 도구에서 console.log 테스트 결과

var regex = /^[a-zA-Z0-9]*$/;

console.log(regex.test("이름"));
// result : false

console.log(regex.test("이름123"));
// result : false

console.log(regex.test("이름!"));
// result : false

console.log(regex.test("name"));
// result : true

console.log(regex.test("Name"));
// result : true

console.log(regex.test("Name123"));
// result : true

console.log(regex.test("Name!"));
// result : false

영어, 숫자 외에 한국어 또는 특수문자가 있는 경우에는 false로 반환되는 것을 확인할 수 있습니다.

▶마치며

해당 정규식은 의외로 자주 사용하는 정규식입니다.

도움이 되었으면 좋겠습니다.

[TIP] 현재 PC의 CPU, RAM 사양 확인하기

떨어지는 용 — Thu, 20 Apr 2023 12:10:25 +0900

▶ [TIP] 현재 PC의 CPU, RAM 사양 확인하기

▶ 설명

그래픽 카드 사양을 확인하는 방법을 적었으니,

이제 CPU와 RAM 사양을 확인하는 방법입니다.

▶ 방법

Windows 10 기준 방법입니다.

표시되는 디자인만 다르지 대부분의 Windows 환경에서는 동일한 방법으로 확인 가능합니다.

1. 단축키 [Win + E] 입력하여 탐색기를 엽니다.

2. ⓛ[내 PC]를 우클릭 후 ②[속성]을 클릭합니다.

Windows 7까지는 내 컴퓨터였던 것으로 기억합니다.

3. 해당 부분에서 현재 PC의 CPU와 RAM의 사양을 확인할 수 있습니다.

프로세서 : 현재 PC의 CPU
설치된 RAM : 현재 PC의 RAM 용량

▶ 마치며

저도 잊어버릴 수도 있고,

모르는 사람이 있을까 싶은 내용이라도,

모르는 사람이 있기 때문에 적습니다.

도움이 되었으면 좋겠습니다.

[TIP] 현재 PC의 그래픽 카드 사양 확인하기

떨어지는 용 — Thu, 20 Apr 2023 11:53:38 +0900

▶ [TIP] 현재 PC의 그래픽 카드 사양 확인하기

▶ 설명

일반적으로 알 사람은 다 알고 있는 방법입니다.

현재 PC의 그래픽 카드의 사양을 확인하고 싶을 때,

DirectX 진단 도구를 실행하면 간단하게 확인할 수 있습니다.

▶ 방법

1. 단축키를 [Win + R] 누르고 dxdiag를 입력 후 확인 또는 [Enter]를 눌러 실행합니다.

dxdiag

또는 Windows 8 이상인 경우

1.1. [Win] 키 또는 시작 버튼을 누르고 ①dxdiag를 입력한 후 ②dxdiag 프로그램을 클릭하여 실행합니다.

dxdiag

2. DirectX 진단 도구에서 상단 탭 중에 ①[디스플레이]를 클릭하면 ②현재 그래픽 카드의 정보를 확인할 수 있습니다.

상당히 오래된 그래픽 카드...

▶ 마치며

알만한 사람은 다 아는 방법이지만,

잊어버릴 수도 있기 때문에 정리하였습니다.

[TIP] Windows 10 God Mode(갓 모드) 만들기

떨어지는 용 — Thu, 20 Apr 2023 11:33:58 +0900

▶ [TIP] Windows 10 God Mode(갓 모드) 만들기

▶ 설명

Windows 10 기준으로 작성된 글입니다.

God Mode(갓 모드)라고 숨겨진 기능이 존재합니다.

제어판에서 볼 수 없는 숨겨진 설정 등을 확인할 수 있는 기능입니다.

전문직이 아니면 사실 의미 없는 기능이지만, 이런 기능도 있으니 재미로 봐주시기 바랍니다.

초보자의 경우 알 수 없는 설정은 가급적 건드리지 말도록 합시다.

▶ 방법

1. 원하는 위치에 폴더를 생성합니다. (바탕화면 추천)

2. 아래와 같은 이름으로 폴더 이름을 설정합니다.

God Mode.{ED7BA470-8E54-465E-825C-99712043E01C}

3. 그러면 이름이 없는 God Mode(갓 모드)가 생성된 것을 확인할 수 있습니다.

4. 해당 폴더를 실행해보면 God Mode라는 이름으로 여러가지 설정들이 표시되는 것을 확인할 수 있습니다.

▶ 마치며

Windows에 숨겨진 기능입니다.

유용함보다는 재미로 작성했습니다.

[TIP] 프로그램 관리자 권한 실행 바로 가기 만들기

떨어지는 용 — Thu, 20 Apr 2023 11:15:07 +0900

▶ [TIP] 프로그램 관리자 권한 실행 바로 가기 만들기

▶ 설명

해당 글은 Windows 10 기준으로 작성한 글입니다.

프로그램 중에 관리자 권한으로 자주 실행하는 프로그램이 있을 겁니다.

매번 우측 클릭하여 관리자 권한 실행하는 것도 번거롭습니다.

그럴 때는 프로그램의 바로 가기를 생성하고 해당 바로 가기를 실행할 경우 관리자 권한으로 실행되도록 설정하면 됩니다.

오늘은 그 방법을 알아보도록 하겠습니다.

▶ 방법

우선 바로 가기를 생성합니다.

예시로 저는 자주 사용하는 CMD(명령 프롬프트)를 관리자 권한으로 실행하는 바로 가기를 생성하도록 하겠습니다.

CMD 바로가기 생성

1. [Win] 키 또는 시작 버튼을 눌러 시작 메뉴에서 cmd 를 입력하여 나온 ①명령 프롬프트를 우측 클릭합니다. ②[파일 위치 열기]를 클릭합니다.

2. 보통 명령 프롬프트는 이미 바로 가기 경로로 설정되어 있습니다. 바로 가기인 경우 명령 프롬프트를 복사합니다. 복사 단축키 [Ctrl + C]

2.1. 일반적인 프로그램인 경우 [Ctrl + Shift + 마우스 드래그] 또는 우측 클릭하여 [바로 가기 생성]로 바로가기를 생성하시면 됩니다.

3. 2번에서 바로 가기를 복사한 경우 원하는 폴더에 붙여넣습니다. 붙여넣기 단축키 [Ctrl + V] (이미 바로 가기를 생성했으면 생략해도 됩니다.)

바로 가기 관리자 권한 실행 설정

1. ①바로 가기를 우측 클릭 한 후에 ②[속성]을 클릭합니다.

이미지를 깔끔하게 짤라서 정말 우측 클릭 헀을 떄 짧게 나오는 것처럼 보입니다.

2. 속성에서 상단에 ①[바로 가기] 탭을 클릭하고 ②[고급] 버튼을 클릭합니다.

일반적인 바로가기 보다 탭이 많은 이유는 cmd.exe 이기 때문입니다.

3. ①[관리자 권한으로 실행] 을 체크하고 ②[확인] 버튼을 클릭합니다.

4. [적용] 버튼을 클릭합니다.

5. 이제 방금 설정한 바로 가기가 관리자 권한으로 실행되는 확인합니다. 명령 프롬프트의 경우 왼쪽 상단에 관리자: 명령 프롬프트로 표시되어 쉽습니다.

▶ 작업 표시줄에 등록

방금 설정한 바로가기를 작업 표시줄에 등록하면 편리합니다.

작업 표시줄에 등록된 바로 가기도 관리자 권한으로 실행됩니다!

▶ 마치며

관리자 권한으로 자주 실행하는 경우에는 상당한 유용한 기능입니다.

많은 도움이 되었으면 좋겠습니다.

[TIP] Windows 10 타임라인 기록 끄기 (필독)

떨어지는 용 — Wed, 19 Apr 2023 12:32:03 +0900

▶ [TIP] Windows 10 타임라인 기록 끄기 (필독)

▶ 설명

Windows 10부터 추가된 기능 중에 타임라인이라고 존재합니다.

최근에 어떤 이미지, 영상, 파일 등을 열었는지 기록이 남습니다.

▶ 타임라인 확인하기

Windows 10 기준 방법입니다.

1. 단축키 [Win + Tab] 또는 시작 표시줄에 있는 좌측 하단에 있는 작업 보기 버튼을 클릭합니다.

2. 작업 보기 상태에서 스크롤을 아래로 내려면 최근 한 달동안 실행한 파일 등이 표시됩니다.

타임라인 기능을 유용하게 사용하거나, 정말 혼자만 사용하는 PC인 경우에는 더 이상 글을 읽지 않아도 됩니다. 이런 기능이 있구나하고 넘어가시면 됩니다.

그렇지만, 내가 어떤 영상이나 이미지를 열었는지 알리고 싶지 않은 사람에겐 이런 기능은 정말 프라이버시에 대한 위험 요소입니다.

타임라인은 지울 수가 있습니다만 일일이 지우기에는 너무 불편합니다.

이제 해당 기능을 끄는 방법에 대해 알아보겠습니다.

▶ 타임라인 기능 끄기

Windows 10 기준 방법입니다.

1. 단축키 [Win + I] 를 눌러 설정을 엽니다.

2. [개인 정보]를 클릭합니다.

3. 좌측 메뉴에서 [활동 기록]을 클릭합니다.

4. ①[이 장치에 내 활동 기록 저장] 체크 박스를 해제하고, 활동 기록 지우기에서 ②[삭제] 버튼을 클릭하여 활동 기록을 지웁니다.

이제 타임라인이 정상적으로 꺼졌는지 확인해보시면 됩니다.

▶ 마치며

컴퓨터 포멧하고 꺼야하는 기능 중 하나인데, 계속 잊어버리니 생각이 나지 않아서 힘들때가 많습니다.

해당 기능을 꺼놓으면 조금 더 안심하고 PC를 사용할 수 있을겁니다.

[Javascript] 문자열을 공백 구분자로 split 하는 방법

떨어지는 용 — Tue, 18 Apr 2023 13:50:08 +0900

▶Javascript 문자열을 공백 구분자로 split 하는 방법

▶설명

문자열을 공백 구분자로 split 하여 배열에 저장할 때, 공백이 여러개 있는 경우에 공백을 전부 무시하고 split 하고 싶은 경우가 있습니다.

그런 경우 해결 방법을 알아보도록 하겠습니다.

참고 : https://stackoverflow.com/questions/225337/how-to-split-a-string-with-any-whitespace-chars-as-delimiters

▶잘못된 방법 예시

먼저 공백으로 나눈다고 생각했을 때, 제일 먼저 생각나는 방법입니다.

아래는 크롬의 개발자 도구의 콘솔 창에서 작성한 테스트 코드입니다.

코드

console.log("a         b    c".split(" "));

결과

['a', '', '', '', '', '', '', '', '', 'b', '', '', '', 'c']

위처럼 단순 공백으로 하면 공백 하나 하나마다 구분이되어 나눠집니다.

▶올바른 방법 예시

정규식을 사용하여 구분하면 위와 같은 문제가 해결됩니다.

아래는 크롬의 개발자 도구의 콘솔 창에서 작성한 테스트 코드입니다.

코드

console.log("a         b    c".split(/\s+/g));

결과

['a', 'b', 'c']

결과 값이 모든 공백을 구분 값으로 사용하여 유효한 단 3개의 문자만이 남을 것을 확인헀습니다.

▶마치며

의도에 따라서는 첫 번째의 잘못된 예시 방법도 사용되어 질 수 있습니다.

언젠가 다시 사용할 일이 있을 것 같아서 이렇게 작성했습니다.

도움이 되었으면 좋겠습니다.

[TIP] CMD(명령 프롬프트) Windows 사용자 비밀번호 변경 명령어

떨어지는 용 — Tue, 18 Apr 2023 12:05:00 +0900

▶ [TIP] CMD(명령 프롬프트) Windows 사용자 비밀번호 변경 명령어

▶ 설명

CMD(명령 프롬프트)를 이용하여 Windows 사용자 비밀번호를 변경하는 방법과

배치 파일(.bat)로 비밀번호 변경 파일을 만드는 방법을 알아보도록 하겠습니다.

▶ 명령어

해당 방법은 Windows 10 기준으로 작성되었습니다.

Windows 사용자 비밀번호 변경을 위한 명령어는 반드시 관리자 권한으로 진행되어야 합니다.

1. [Win] 키 또는 윈도우 좌측 하단의 시작 버튼을 누릅니다.

2. ①cmd 입력 후 ②[명령 프롬프트]를 우측 클릭하고 ③[관리자 권한으로 실행] 버튼을 클릭합니다.

3. 명령 프롬프트에서 아래의 명령어를 테스트 해보도록 합시다.

net user username password

net user username password

username : 변경할 사용자 이름
password : 변경할 비밀번호

4. 해당 명령어를 실행 후 정상적으로 비밀번호가 변경되었는지 확인합니다.

▶ 배치 파일 만들기

비밀번호 변경을 위한 배치 파일을 만들어보겠습니다.

1. 단축키 [Win + R] 입력

2. notepad 입력

3. 확인 또는 [Enter]

4. 메모장에 비밀번호 변경 명령어 입력

net user username password

net user username password

username : 변경할 사용자 이름
password : 변경할 비밀번호

5.해당 배치 파일을 저장합니다. 확장자는 반드시 *.bat 으로 저장합니다.

6.해당 배치 파일을 실행할 때는 반드시 관리자 권한으로 실행해야합니다. ①해당 배치 파일을 우클릭하고 ②[관리자 권한으로 실행] 버튼을 눌러 정상적으로 동작하는지 확인합니다.

▶ 마치며

Windows 환경에서 이런 방식으로 비밀번호를 변경하는 경우는 거의 없지만, 필요할 떄가 있어서 기록한 것입니다.

도움이 되었으면 좋겠습니다.

[MSSQL] 로컬DB(LocalDB) 접속

떨어지는 용 — Tue, 18 Apr 2023 10:55:23 +0900

▶ [MSSQL] 로컬DB(LocalDB) 접속

▶ 설명

SSMS(SQL Server Management Studio)에서 로컬DB(LocalDB)에 접속하려고 할 때마다 정보를 잊어버릴때가 있어서 작성합니다.

▶ 로컬 접속 정보

SSMS에서 로컬DB에 접속하려면 아래와 같이 설정하면 됩니다.

1. 서버 이름 : (LocalDB)\MSSQLLocalDB

2. 인증 : Windows 인증

▶ 마치며

로컬DB 접속에 도움이 되었으면 좋겠습니다.

[TIP] 파일 탐색기를 내 PC로 열기

떨어지는 용 — Tue, 18 Apr 2023 10:24:10 +0900

▶ [TIP] 파일 탐색기를 내 PC로 열기

▶ 설명

Windows 8부터였던걸로 기억하는데,

파일 탐색기를 실행했을 때, 하드 드라이브 목록이 보이는 내 PC(내 컴퓨터) 경로가 아닌 즐겨찾기로 파일 탐색기가 열리기 시작했습니다.

하드 드라이브 목록을 자주 보는 경우 파일 탐색기를 실행 후에 왼쪽 목록에서 내 PC를 클릭해야하는 번거로움이 있기 때문에 해당 옵션을 변경하는 방법을 알아보도록 하겠습니다.

▶ 방법

Windows 10 기준 방법입니다. 이전 버전의 Windows에서도 동일하게 동작할 수 있습니다.

1. 단축키 [Win + E]를 입력하여 파일 탐색기 실행

2. 파일 탐색기의 좌측 상단에 [보기] 버튼 클릭 (일반적으로 상단의 보기가 접혀 있을경우 클릭하여 열어줘야합니다. 이미 열려 있으면 신경쓸 필요가 없습니다.)

3. [옵션] 버튼 클릭

4. [파일 탐색기 열기]에서 선택 항목 클릭 (현재는 즐겨찾기로 선택되어 있을 것입니다.)

5. [내 PC] 선택

5. [적용] 버튼 클릭

6. 단축키 [Win + E]를 입력하여 파일 탐색기 실행하여 정상적으로 내 PC로 열리지는 확인

▶ 마치며

이번에도 간단하지만 모르는 사람도 있을까하여 작성한 팁입니다.

사실 알만한 사람은 이미 다 아는 팁일것 같습니다.

그래도 도움이 되었으면 좋겠습니다.

[PowerShell] PowerShell(파워셸) 탐색기 경로에서 실행하기

떨어지는 용 — Tue, 18 Apr 2023 09:51:38 +0900

▶ [PowerShell] PowerShell(파워셸) 탐색기 경로에서 실행하기

▶ 설명

파일 탐색기에 열려있는 폴더의 경로로 PowerShell(파워셸)를 실행하고 싶은 경우가 있을 것입니다.

PowerShell를 실행하고 cd 로 들어가려면 번거롭습니다.

간단하게 탐색기 경로에서 실행하는 방법을 공유합니다.

이 방법은 이전에 작성한 [TIP] CMD(명령 프롬프트) 탐색기 경로에서 실행하기와 동일한 방법입니다.

해당 글은 powershell의 경우 카테고리가 분리되어서 따로 작성한 글입니다.

▶ 방법

Windows 10 기준 방법입니다. 이전 버전의 Windows에서도 동일하게 동작할 수 있습니다.

1. 파일 탐색기에서 원하는 경로로 이동합니다.

2. 파일 탐색기의 경로 부분에 빈 공간을 클릭합니다.

3. powershell를 입력 후 [Enter]를 입력합니다.

4. powershell 창에서 해당 경로로 열린 것을 확인할 수 있습니다.

▶ 마치며

powershell(파워셸)를 자주 열어야하는 프로그래머의 경우 간단하지만 상당히 유용한 팁이라고 생각합니다.

[TIP] CMD(명령 프롬프트) 탐색기 경로에서 실행하기

떨어지는 용 — Tue, 18 Apr 2023 09:42:50 +0900

▶ [TIP] CMD(명령 프롬프트) 탐색기 경로에서 실행하기

▶ 설명

파일 탐색기에 열려있는 폴더의 경로로 CMD(명령 프롬프트)를 실행하고 싶은 경우가 있을 것입니다.

cmd를 실행하고 cd 로 들어가려면 번거롭습니다.

간단하게 탐색기 경로에서 실행하는 방법을 공유합니다.

▶ 방법

Windows 10 기준 방법입니다. 이전 버전의 Windows에서도 동일하게 동작할 수 있습니다.

1. 파일 탐색기에서 원하는 경로로 이동합니다.

2. 파일 탐색기의 경로 부분에 빈 공간을 클릭합니다.

3. cmd를 입력 후 [Enter]를 입력합니다.

4. cmd 창에서 해당 경로로 열린 것을 확인할 수 있습니다.

▶ 마치며

cmd(명령 프롬프트)를 자주 열어야하는 프로그래머의 경우 간단하지만 상당히 유용한 팁이라고 생각합니다.

[TIP] PC 이름 변경 (호스트 네임 변경)

떨어지는 용 — Mon, 17 Apr 2023 10:21:26 +0900

▶ [TIP] PC 이름 변경 (호스트 네임 변경)

▶ 설명

PC 이름 (호스트 네임) 변경하는 간단한 방법을 설명하도록 하겠습니다.

▶ 방법

Windows 10 기준 방법입니다.

1. 단축키 [Win + E] 입력하여 탐색기를 엽니다.

2. ⓛ 내 PC를 우클릭 후 ② 속성을 클릭합니다.

3. 이 PC의 이름 바꾸기 버튼을 클릭합니다.

4. 바꿀 이름을 입력 후 다음을 클릭합니다.

5. PC를 재시작합니다. PC를 재시작해야하만 적용이 됩니다.

6. 재시작 후 정상적으로 변경되었는지 확인하면 끝입니다.

▶ 마치며

PC 이름(호스트 네임) 변경 방법을 작성했습니다.

Windows 환경에서 작업할 때 도움이 되었으면 좋겠습니다.

[TIP] PC 이름 확인 (호스트 네임 확인)

떨어지는 용 — Mon, 17 Apr 2023 10:11:37 +0900

▶ [TIP] PC 이름 확인 (호스트 네임 확인)

▶ 설명

PC 이름 (호스트 네임)을 알아야하는 경우가 있습니다.

그럴 때는 2가지 방법이 있습니다.

▶ 방법 1

1. 단축키 [Win + R] 입력

2. cmd 입력 후 [Enter] 명령 프롬프트 실행

3. hostname 입력 후 [Enter]

▶ 방법 2

Windows 10 기준 방법입니다.

1. 단축키 [Win + E] 입력하여 탐색기를 엽니다.

2. ⓛ 내 PC를 우클릭 후 ② 속성을 클릭합니다.

3. 장치 이름이 현재 PC 이름 (호스트 네임) 입니다.

▶ 마치며

PC 이름(호스트 네임)을 확인할 수 있는 두 가지 방법을 적었습니다.

Windows 환경에서 작업할 때 도움이 되었으면 좋겠습니다.

Vampire Survivors: Tides of the Foscari 팁

떨어지는 용 — Sat, 15 Apr 2023 11:06:16 +0900

이번에 새로 출시한 Vampire Survivors 의 두번째 DLC

Vampire Survivors: Tides of the Foscari 에 대한 몇가지 팁입니다.

아직 새로 나온 Vampire Survivors: Tides of the Foscari 에 대한 한국어 공략이 안보여서

영어 공략을 보고 진행하여서 몇 가지 팁을 공유합니다.

개인적으로 풀 업적이라 뿌듯하네요.

대략적인 지도

진짜 플레이하면서 느낀 대략적인 지도입니다.

진짜진짜 대략입니다.

Foscari 호수

Foscari 심연

캐릭터 해금

엘리노어 유지론

첫 번째 캐릭터인 마법사는 Foscari 호수 좌측 상단쯤 위치한 관을 열면 해금됩니다. 보통 DLC 맵 할 정도면 지도에 표시되기 때문에 찾기 어렵지 않을 겁니다.

엘리노어 유지론

마루토 컷츠 (이거 아무리 봐도 어떤 오마주인지...)

두 번째 캐릭터인 대검전사는 엘리노어의 무기를 진화 시키면 해금됩니다.

마루토 컷츠

케이타 무오르트

세 번째 캐릭터인 궁수는 마루토의 무기를 진화 시키면 해금됩니다

케이타 무오르트

루미네어 포스카리

네 번째 캐릭터인 공주(?)는 마루토로 Foscari 심연을 시작하고, 마루토의 무기를 진화 시킨 후에 심연의 봉인을 파괴하면 해금됩니다.

루미네어 포스카리

쥬느비에브 그루예르

타락 공주(?)는 엘리노어로 Foscari 심연을 시작하고, 엘리노어의 무기를 진화 시킨 후에 추방자의 봉인을 파괴하면 해금됩니다.
저의 경우 심연의 봉인을 파괴하고, 추방자의 봉인을 파괴하였습니다. 봉인에 파괴 순서가 있는지는 알 수가 없네요.
추방자의 봉인을 파괴하면 컷씬과 함께 제네비가 출현하며 보스전이 시작됩니다. 모든 무기가 해제됩니다. (악세사리 제외)

쥬느비에브 그루예르

제네비를 처치하면 하이퍼 모드가 해금됩니다.

새미

애벌레는 Foscari 호수에서 봉인의 밑에 쪽에 숨겨진 동굴 같은게 존재하는데, 그 근처에만 위치해도 많이 출현합니다. 동굴 내부로 들어가면 더 좋습니다.

새미

썩어가는 구울

구울의 경우 Foscari 심연의 스타트 지점에서 많이 출현했던걸로 기억합니다.

썩어가는 구울

제네비

쥬느비에브 그류예르로 100000명의 몬스터를 처치하면 해금됩니다.

제네비

맵 해금

Foscari 심연의 해금 방법입니다.
케이타의 무기를 진화시킨 후에 Foscari 호수의 봉인으로 향하면 봉인이 파괴됩니다.
봉인이 파괴된 후에는 Foscari 심연 맵으로 이동하면 모든 장비가 해제되어 맵에 드롭됩니다.
하이퍼 모드의 경우 Foscari 심연에서 제네비를 처치하면 해금됩니다. (위의 쥬느비에브 캐릭터 해금 참고)

조합식

기타 업적

가에야의 아바타

Foscari 호수 근처에서 일정 시간마다 출현하는 엘리트 or 보스급 몬스터인 것 같습니다. 자힐을 가지고 있는 것 같았습니다.

이상입니다.

게임 플레이에 도움이 되었으면 좋겠습니다.

[Node.js + Vue.js] Visual Studio Code 디버그 모드

떨어지는 용 — Wed, 1 Jul 2020 15:37:02 +0900

▶Node.js + Vue.js Visual Studio Code 디버그 모드

▶설명

Node.js 개발을 진행하면서 디버그 모드를 사용하지 않는다면, 많은 불편이 있을 수 있습니다.

Visual Studio Code에서 제공하는 디버그 모드를 설정하여, 개발 편의성을 올리도록 하겠습니다.

아래의 내용은 Visual Studio Code에서 디버그 모드를 사용한 경험을 기반으로 작성한 것입니다.

다른 분들은 더 많은 기능을 아실 거로 생각하지만, 제가 아는 내용만 간단히 작성하도록 하겠습니다.

▶Visual Studio Code 디버그 모드로 실행

이제 개발을 위해 백엔드 프로젝트를 Visual Studio Code 디버그 모드로 실행하는 방법을 알아보겠습니다.

우선 터미널에서 [Ctrl + C] 단축키로 백엔드 프로젝트가 실행되어 있으면 종료시킵니다. (디버그 모드로 실행할 때, 충돌이 발생하지 않도록 하기 위해서입니다.)

1.[F5] 키를 누르고, Select Enviroment에서 Node.js를 선택합니다.

디버그 모드 설정 파일 생성

2. 또는 좌측에 Run 버튼을 클릭한 후에, create a launch.json file을 클릭 후 Select Enviroment에서 Node.js를 선택합니다.

디버그 모드 설정 파일 생성

3. 생성된 launch.json에 내용 중 program 부분을 아래와 같이 수정합니다.

node 실행 프로그램 설정

...
"program": "${workspaceFolder}\\backend\\bin\\www"
...

4. [F5] 키를 눌러 디버그 모드를 실행합니다.

5. 또는 좌측에 Run 버튼을 클릭한 후에, Start Debugging 버튼을 클릭하여 디버그 모드를 실행합니다.

(3) 디버그 실행시 활성화되는 패널

6. 실행 확인

위에처럼 표시되면 성공입니다.

http://localhost:3000 으로 접속하여 위에처럼 표시되면 성공입니다.

이제 Visual Studio Code에서 디버그 모드를 사용할 수 있게 되었습니다.

백엔드 프로젝트에서 작업을 진행하면서 브레이크 포인트 등으로 디버그에 큰 도움이 될 것입니다.

[참고] launch.json 파일 위치는 root 폴더에서 .vscode 아래에 생성됩니다.

.vscode 하위에 위치하는 launch.json

※ [Shift + F5] 단축키로 디버그 모드를 종료할 수 있습니다.

▶Visual Studio Code 브레이크 포인트 설정

대부분 디버그 단축키는 비슷하지만, 모르는 분도 있을 수 있어서 작성합니다.

테스트 코드를 작성하고 브레이크 포인트를 설정하여 디버그하는 방법을 알아보도록 하겠습니다.

Express 기본 인덱스 페이지에 테스트 코드를 입력하고, 브레이크 포인트를 설정하도록 하겠습니다.

1. backend/routes/index.js 파일에 테스트 코드 입력하고 저장

테스트 코드 입력

...
const data = 1;
console.log("data : ", data);
...

2. 변수 선언 줄에 커서를 위치하고 [F9] 키를 눌러, 좌측 줄 번호에 빨간색으로 브레이크 포인트 설정된 것을 확인할 수 있습니다. (단축키가 아닌, 좌측 줄 번호 옆을 클릭하여 브레이크 포인트를 설정할 수도 있습니다.)

브레이크 포인트 설정

3. [F5] 키를 눌러서 backend 프로젝트를 디버그 모드 실행

4. 실행 확인. http://localhost:3000을 접속하면 브레이크 포인트에서 멈춰서 진행되지 않는 것을 알 수 있습니다.

Visual Studio Code를 확인하겠습니다.

디버깅 화면

(1) 변수를 확인하는 곳입니다. 아직은 data 값이 undefined인 것을 알 수 있습니다.

(2) 코드 어느 부분에서 멈춰있는지 알 수 있습니다.

5. [F10] 키를 눌러서 다음 단계로 진행합니다.

변수 값이 변경 된 것을 알 수 있습니다.

(1) 다음 단계로 진행되면서 변숫값이 변경된 것을 알 수 있습니다.

(2) 현재 단계를 알 수 있습니다.

6. [F5] 키를 누르면 다음 브레이크 포인트로 이동합니다. 다음 브레이크 포인트 없으면 코드가 실행됩니다.

7. 코드가 변경되면 [Ctrl + Shift + F5] 단축키로 재실행 후 진행하시기 바랍니다.

8. 단축키로 설명해 드리고 있지만, 상단 패널에 버튼을 눌러서 사용해도 됩니다.

상단 패널의 디버그 모드 버튼

▶마치며

Visual Studio Code에서 Node.js 작업을 진행할 때, 디버그 모드 사용법을 알아봤습니다.

다음 글에서는 frontend, backend 프로젝트 개발 시에 연동하는 방법을 알아보도록 하겠습니다.

[Node.js + Vue.js] 백엔드(Backend) 환경 세팅 with Express

떨어지는 용 — Fri, 12 Jun 2020 09:00:46 +0900

▶Node.js + Vue.js 백엔드(Backend) 환경 세팅 with Express

▶설명

프론트엔드의 경우에는 Vue.js를 사용하기로 하였습니다.

백엔드는 Node.js에서 흔하게 사용한는 Express 프레임워크를 사용하도록 하겠습니다.

이번 글에서는 Express Generator를 이용하여 Express 백엔드 환경을 세팅하도록 하겠습니다.

▶Express Generator 설치

[참고] Express Generator : https://expressjs.com/ko/starter/generator.html

Express 애플리케이션 생성기

Express 애플리케이션 생성기 애플리케이션의 골격을 신속하게 작성하려면 애플리케이션 생성기 도구인 express를 사용하십시오. 다음의 명령을 이용해 express를 설치하십시오. $ npm install express-gener

expressjs.com

아래의 방법은 이전에 설치한 Visual Studio Code를 이용한 방법입니다.

1. Visual Studio Code 좌측에 EXPLORER 영역에서 우측 클릭

2. [Open in Terminal] 선택

3. 하단 터미널이 표시되는 것을 확인

4. Express Generator 설치 여부 확인을 위해 아래의 명령어 실행

Express Generator 설치 여부 확인

express --version

5. Express Generator가 설치되어 있지 않다면 아래를 실행

5.1. Yarn을 이용하여 Express Generator 설치하는 경우

Yarn으로 Express Generator 설치

yarn global add express-generator

5.2. NPM을 이용하여 Express Generator 설치하는 경우

NPM으로 Express Generator 설치

npm install express-generator -g

6. 설치된 Express Generator 버전 확인

express --version

7. 정상적으로 버전이 표시되면 설치 완료

[에러가 발생하는 경우]

- 만약 설치했는데, express 를 찾을 수 없다는 에러가 발생하면 아래의 경로가 [환경 변수]>[Path]에 추가되어 있는지 확인하고, 없으면 추가합니다.

- 환경 변수 경로 : C:\Users\{Your User}\AppData\Roaming\npm

- 저의 경우에는 현재 개인 PC를 Administrator 계정으로 사용해서 권한이 문제인지 Yarn으로 설치하면 express를 찾을 수 없어서, NPM으로 설치를 진행하였습니다.

▶백엔드(backend) 프로젝트 생성

백엔드 프로젝트는 backend라는 폴더명으로 진행하겠습니다.

1. 터미널의 프로젝트 root 폴더에서 아래의 명령어 실행

express --view=pug backend

--view=pug는 View Engine을 PUG로 사용하겠다는 의미입니다.

저희는 View에 해당하는 frontend를 Vue.js로 사용할 것이기 때문에, 어떤 View Engine을 사용해도 상관없어서 pug로 설정하였습니다.

2. backend 폴더가 생성된 것을 확인할 수 있습니다. backend 폴더로 이동합니다.

cd backend

cd backend

3. 패키지 설치를 진행합니다.

3.1. Yarn을 이용하여 패키지 설치

Yarn으로 패키지 설치

yarn install

3.2 NPM을 이용하여 패키지 설치

NPM으로 패키지 설치

npm install

4. 이제 프로젝트를 실행해보도록 하겠습니다.

4.1. Yarn을 이용하여 프로젝트 실행

yarn start

4.2. NPM을 이용하여 프로젝트 실행

npm start

5. 실행 확인

위에처럼 표시되면 성공입니다.

http://localhost:3000 으로 접속하여 위에처럼 표시되면 성공입니다.

▶.gitignore 파일 수정

이 내용은 git을 사용하지 않는다면 생략하셔도 좋습니다.

백엔드 프로젝트를 추가했기 때문에 .gitignore 파일을 수정하도록 하겠습니다.

root 폴더에 .gitignore 파일을 열어서 아래와 같이 수정합니다.

/dist 폴더는 frontend 프로젝트를 빌드하면서 생성되는 배포 파일이 생성되는 폴더로 기본 세팅이 되어 있는 것입니다.

빌드 파일의 경우에는 git에 저장할 필요없기 때문입니다.

저희는 backend 폴더에 public에 frontend 프로젝트가 빌드되도록 할 것입니다.

그렇기 때문에 /dist를 backend/public으로 수정합니다.

/dist를 backend/public으로 수정

▶마치며

이번 글에서는 Express Generator를 설치하고, Express Generator를 이용하여 백엔드 환경 세팅을 진행하였습니다.

다음 글에서는 Visual Studio Code 디버그 모드 설정을 진행하도록 하겠습니다.

[Node.js + Vue.js] 프론트엔드(Frontend) 환경 세팅 with Vue CLI

떨어지는 용 — Fri, 5 Jun 2020 13:24:32 +0900

▶Node.js + Vue.js 프론트엔드(Frontend) 환경 세팅 with Vue CLI

▶설명

이번 글에서는 Vue CLI를 이용하여 Vue.js 프론트엔드 환경을 세팅하도록 하겠습니다.

▶Vue CLI 설치

[참고] Vue CLI : https://cli.vuejs.org/

Vue CLI

cli.vuejs.org

아래의 방법은 이전에 설치한 Visual Studio Code를 이용한 방법입니다.

1. Visual Studio Code 좌측에 EXPLORER 영역에서 우측 클릭

2. [Open in Terminal] 선택

3. 하단 터미널이 표시되는 것을 확인

4. Vue CLI 설치 여부 확인을 위해 아래의 명령어 실행

Vue CLI 설치 여부 확인

vue -V

5. Vue CLI가 설치되어 있지 않다면 아래를 실행

5.1. Yarn을 이용하여 Vue CLI 설치하는 경우

Yarn으로 Vue CLI 설치

yarn global add @vue/cli

5.2. NPM을 이용하여 Vue CLI를 설치하는 경우

NPM으로 Vue CLI 설치

npm install -g @vue/cli

6. 설치된 Vue CLI 버전 확인

Vue CLI 버전 확인

vue -V

7. 정상적으로 버전이 표시되면 설치 완료

[에러가 발생하는 경우]

- 만약 설치했는데, vue를 찾을 수 없다는 에러가 발생하면 아래의 경로가 [환경 변수]>[Path]에 추가되어 있는지 확인하고, 없으면 추가합니다.

- 환경 변수 경로 : C:\Users\{Your User}\AppData\Roaming\npm

- 저의 경우에는 현재 개인 PC를 Administrator 계정으로 사용해서 권한이 문제인지 Yarn으로 설치하면 Vue CLI를 찾을 수 없어서, NPM으로 설치를 진행하였습니다.

또는 아래 URL을 참고

extbrain.tistory.com/118

▶프론트엔드(frontend) 프로젝트 생성

Vue.js 작업을 진행할 프론트엔드 프로젝트는 frontend라는 폴더명으로 진행하겠습니다.

1. 프로젝트 root 폴더에서 터미널에서 아래의 명령어 실행

vue create frontend

vue create frontend

2. 그러면 아래와 같은 선택 사항이 나옵니다. 저희 default로 진행하겠습니다. 엔터.

default (babel, eslint) 선택

3. 이제 또 다른 선택 사항이 나옵니다. 패키지 매니저를 선택하는 것인데, Yarn을 선택하겠습니다. 엔터.

Use Yarn 선택

4. 이제 프로젝트 생성이 진행되고, 아래의 이미지와 같이 친절하게 실행하는 방법을 알려줍니다.

프로젝트 생성 완료

5. 이제 알려주는 대로 명령어를 실행하도록 하겠습니다.

cd frontend

cd frontend

6. 실행

6.1. Yarn으로 설치한 경우

yarn serve

6.2. NPM으로 설치한 경우

npm run serve

7. 터미널에 표시되는 Local URL로 접속하여 정상적으로 표시되는지 확인.

※ Visual Studio Code에 터미널에서는 URL를 [Ctrl + Click]으로 열 수 있습니다.

Local URL을 [Ctrl + Click] 합시다.

8. 실행 확인

브라우저에 위처럼 표시되면 성공입니다.

▶.gitignore 파일 이동

이 내용은 git을 사용하지 않는다면 생략하셔도 좋습니다.

frontend 폴더에 자동으로 생성된 .gitignore 파일을 프로젝트 root 폴더로 이동시킵니다.

그러면 프로젝트 폴더의 구조는 아래처럼 됩니다. (README.md는 없을 수도 있습니다.)

- frontend
- .gitignore
- README.md

위에처럼 설정되어 있으면, git에 .gitignore 에 설정된 파일 등은 변경 사항으로 표시되지 않습니다.

▶마치며

이번 글에서는 Vue CLI를 설치하고, Vue CLI를 이용하여 프론트엔드 환경 세팅을 진행하였습니다.

다음 글에서는 백엔드 환경 세팅을 진행하도록 하겠습니다.

[Node.js + Vue.js] Yarn 패키지 매니저 설치

떨어지는 용 — Wed, 3 Jun 2020 15:35:11 +0900

▶Node.js + Vue.js Yarn 패키지 매니저 설치

▶설명

Node.js + Vue.js 프로젝트를 진행하면서 사용할 패키지 매니저는 Yarn입니다.

그러면 Yarn은 무엇일까요?

▶Yarn이란?

Yarn은 facebook에서 개발한 javascript 패키지 매니저입니다.

Yarn은 NPM 보다는 사용량이 적지만, 많은 인기를 누리고 있는 패키지 매니저입니다.

Yarn에서 소개하는 기능은 아래와 같습니다.

Ultra Fast (초고속)

Yarn은 다운로드 한 모든 패키지를 캐시하므로 다시 다운로드 할 필요가 없습니다.

또한 작업을 병렬화하여 리소스 사용률을 극대화하므로 설치 시간이 빨라집니다.

Mega Secure (뛰어난 보안)

Yarn은 체크섬을 사용하여 코드가 실행되기 전에 설치된 패키지의 무결성을 확인합니다.

Super Reliable (매우 신뢰할 수 있는)

상세하고 간결한 잠금 파일 형식 및 설치 확정 알고리즘을 사용하여 Yarn은 한 시스템에서 작동하는 설치가 다른 시스템에서도 동일하게 작동하는지 확인할 수 있습니다.

그 외에도

Offline Mod (오프라인 모드)

패키지를 이전에 설치한 경우 인터넷에 연결하지 않고 다시 설치할 수 있습니다.

Deterministic (결정론)

설치 순서에 관계없이 모든 시스템에 동일한 종속성이 동일한 방식으로 설치됩니다.

Network Performance (네트워크 성능)

Yarn은 네트워크 활용도를 극대화하기 위해 요청을 효율적으로 대기, 요청 폭포를 방지합니다.

Same Packages (동일한 패키지)

NPM에 패키지를 설치하고 패키지 workflow를 동일하게 유지합니다.

Network Resilience (네트워크 탄력성)

단일 요청이 실패해도 설치가 실패하지 않습니다. 실패하면 요청이 재시도됩니다.

Flat Mode (플랫 모드)

중복이 발생하지 않도록 일치하지 않는 종속성 버전을 단일 버전으로 해결합니다.

위에 내용들은 Yarn의 홈페이지에서 가져온 것입니다.

자세한 내용은 홈페이지를 참고하시기 바랍니다.

참고 : yarnpkg.com/lang/en/

Yarn

Fast, reliable, and secure dependency management.

classic.yarnpkg.com

▶Yarn 설치

아래의 방법은 이전에 설치한 Visual Studio Code를 이용한 방법입니다.

1. Visual Studio Code 좌측에 EXPLORER 영역에서 우측 클릭

2. [Open in Terminal] 선택

3. 하단 터미널이 표시되는 것을 확인

4. Yarn 설치 여부 확인을 위해 아래의 명령어 실행

Yarn 설치 여부 확인

yarn -v

5. Yarn이 설치되어 있지 않다면 아래를 진행

6. NPM을 이용해 글로벌로 Yarn 설치 (설치되어 있지 않은 경우에만)

Yarn 설치

npm install -g yarn

7. 설치된 Yarn 버전 확인

Yarn 버전 확인

yarn -v

8. 정상적으로 버전이 표시되면 설치 완료

▶마치며

이번 글에서는 Yarn 패키지 매니저 설치를 진행하였습니다.

다음 글에서는 Vue.js 프론트엔드 환경 세팅을 진행하도록 하겠습니다.

[TIP] 화면 캡처

떨어지는 용 — Wed, 27 May 2020 14:47:57 +0900

▶ [TIP] 화면 캡처

▶ 설명

화면을 캡처는 많은 경우에 사용됩니다.

프로그램을 따로 설치하지 않으면, Windows에 기본 캡처 사용합니다.

Print Screen 버튼을 이용한 방법 등이죠.

그렇지만, 화면의 일부만을 캡처하고 싶으면 어떻게 해야 할까요?

▶ 캡처 도구 (Windows 7 이상)

1. 시작 메뉴에서 캡처 도구를 실행

2. 새로 만들기 버튼을 클릭하여 원하는 영역을 선택하여 캡처

▶ 단축키 (Windows 10 이상)

1. 단축키 [Win + Shift + S] 입력

2. 원하는 영역을 선택하여 캡처 (이 화면은 캡처가 안되기 때문에 이미지를 첨부하지 않았습니다.)

3. 클립 보드에 저장되었기 때문에 그냥 붙여넣기해도 됩니다. 저장하고 싶으면 아래를 참고해주세요.

4. 저장하려면 우측 하단에 표시되는 메시지를 클릭

5. 단축키 [Win + S]를 눌러 저장하거나 간단한 스케치를 추가할 수 있습니다.

▶ 마치며

정말 간단합니다.

Windows 환경에서 작업할 때 도움이 되었으면 좋겠습니다.

[TIP] 원격 데스크톱 연결 실행하기

떨어지는 용 — Wed, 27 May 2020 14:26:18 +0900

▶ [TIP] 원격 데스크톱 연결 실행하기

▶ 설명

프로그래머로서 업무를 진행하다보면, 원격 접속을 위해 원격 데스크톱 연결을 실행하는 경우가 많습니다.

많은 원격 리스트를 관리하기 위해 프로그램을 설치하여 사용한 경우가 많지만,

Windows에서 기본적으로 제공하는 원격 데스크톱 연결에 대해서만 설명하겠습니다.

일반적으로 시작 메뉴에서 원격 데스크톱 연결을 찾아 실행하거나, 바로가기로 등록하여 실행합니다.

그렇지만, 실행을 통해서 원격 데스크톱 연결을 실행하는 간단한 방법을 공유하고자 합니다.

이미 아시는 분들은 많겠지만, 모르는 사람이 있기 때문에 공유 차원에서 글을 작성했습니다.

▶ 방법

1. 단축키 [Win + R] 입력

2. mstsc 입력

3. 확인 또는 [Enter]

▶ 마치며

정말 간단합니다.

Windows 환경에서 작업할 때 도움이 되었으면 좋겠습니다.

[TIP] 계산기 실행하기

떨어지는 용 — Wed, 27 May 2020 14:15:12 +0900

▶ [TIP] 계산기 실행하기

▶ 설명

프로그래머로서 업무를 진행하다보면, 계산기를 실행하는 경우가 많습니다.

일반적으로 시작 메뉴에서 계산기를 찾아 실행하거나, 바로가기로 등록하여 실행합니다.

그렇지만, 실행을 통해서 계산기를 실행하는 간단한 방법을 공유하고자 합니다.

이미 아시는 분들은 많겠지만, 모르는 사람이 있기 때문에 공유 차원에서 글을 작성했습니다.

▶ 방법

1. 단축키 [Win + R] 입력

2. calc 입력

3. 확인 또는 [Enter]

▶ 마치며

정말 간단합니다.

Windows 환경에서 작업할 때 도움이 되었으면 좋겠습니다.

[TIP] 메모장 실행하기

떨어지는 용 — Wed, 27 May 2020 14:11:39 +0900

▶ [TIP] 메모장 실행하기

▶ 설명

프로그래머로서 업무를 진행하다보면, 메모장을 실행하는 경우가 많습니다.

일반적으로 시작 메뉴에서 메모장을 찾아 실행하거나, 바로가기로 등록하여 실행합니다.

그렇지만, 실행을 통해서 메모장을 실행하는 간단한 방법을 공유하고자 합니다.

이미 아시는 분들은 많겠지만, 모르는 사람이 있기 때문에 공유 차원에서 글을 작성했습니다.

▶ 방법

1. 단축키 [Win + R] 입력

2. notepad 입력

3. 확인 또는 [Enter]

▶ 마치며

정말 간단합니다.

Windows 환경에서 작업할 때 도움이 되었으면 좋겠습니다.

[Javascript] 화면 크기 변경 시에 축소

떨어지는 용 — Thu, 6 Feb 2020 11:33:56 +0900

▶Javascript 화면 크기 변경 시에 축소

▶설명

일반적이 반응형 홈페이지가 아닌 고정된 사이즈의 홈페이지를 만들어야 하는 경우가 있습니다.
그런경우 창의 최소 넓이 미만인 경우에는 Javascript로 zoom을 조정하여 비율 그대로 줄어들게 처리하면 편리합니다.

▶예제

코드

function resizeApply() {
  var minWidth = 1200;
  var body = document.getElementsByTagName('body')[0];
  if (window.innerWidth < minWidth) { body.style.zoom = (window.innerWidth / minWidth); }
  else body.style.zoom = 1;
}

window.onload = function() {
  window.addEventListener('resize', function() {
    resizeApply();
  });
}

resizeApply();

설명

해당 스크립트는 body 태그 최하단에 추가하였습니다.
resizeApply 함수는 화면 사이즈가 minWidth 미만인 경우에 zoom 값을 조정합니다.
그리고 window.onload는 페이지의 리소스가 모두 로드 되면 실행되며,
창의 넓이가 조정되면 resizeApply를 실행하도록 이벤트를 추가했습니다.

▶마치며

언젠가 다시 사용할 일이 있을 것 같아서 이렇게 작성했습니다.
요즘은 CSS로도 충분히 처리할 방법이 있다고 생각합니만, Javascript로 처리하는 방법을 찾는 분도 있을거라고 생각합니다.

[PowerShell] PSSecurityException : UnauthorizedAccess

떨어지는 용 — Wed, 18 Dec 2019 11:11:23 +0900

▶PowerShell 보안 오류 - PSSecurityException

▶설명

[들어가며]

Node.js 프로젝트를 Windows 환경에서 진행하고 있습니다.

PowerShell 환경에서 스크립트를 실행 중 보안 오류가 발생하여 해결 방법을 작성하였습니다.

▶오류

저 같은 경우에 yarn을 설치하고, yarn의 버전을 확인하는 중에 아래의 오류가 발생하였습니다.

yarn : 이 시스템에서 스크립트를 실행할 수 없으므로 C:\Users\Administrator\AppData\Roaming\npm\yarn.ps1 파일을 로드할 수 
없습니다. 자세한 내용은 about_Execution_Policies(https://go.microsoft.com/fwlink/?LinkID=135170)를 참조하십시오.
위치 줄:1 문자:1
+ yarn -v
+ ~~~~
    + CategoryInfo          : 보안 오류: (:) [], PSSecurityException
    + FullyQualifiedErrorId : UnauthorizedAccess

▶해결 방법

1. 관리자 권한으로 PowerShell 실행.

2. 실행 정책을 확인하기 위해 'ExecutionPolicy' 명령어 실행.

3. 'Restricted'라고 표시되고 있으면, 현재 정책 때문에 위에 오류가 발생한 것을 알 수 있습니다.

4. 스크립트를 허용하기 위해 'Set-ExecutionPolicy Unrestricted' 명령어 실행.

5. 변경된 실행 정책을 확인하기 위해 'ExecutionPolicy' 명령어 실행

6. 'Unrestricted'라고 표시되면 스크립트가 허용되는 것을 알 수 있습니다.

7. 이전 스크립트로 테스트.

▶마치며

이번 글에서는 PowerShell 환경에서 발생하는 PSSecurityException 해결 방법을 알아봤습니다.

PowerShell은 전문 영역이 아니고, 해결 방법도 결국 검색으로 찾아봤습니다.

내용이 다소 미흡하더라도, 너그럽게 봐주시면 감사하겠습니다.

[Node.js + Vue.js] 프로그램 설치

떨어지는 용 — Sun, 22 Sep 2019 18:41:25 +0900

▶Node.js + Vue.js 프로그램 설치

▶설명

[들어가며]

최근에 Node.js + Vue.js로 회사에서 작업을 진행해서 간단하게 프로젝트에서 사용한 TIP 같은 것을 정리합니다.

상세한 지식을 작성하기에는 배움이 모자라므로 어디까지나 참고만 하시고, 제대로 배우고 싶으신 분은 공식 문서를 보시는 것을 추천합니다.

이 글은 어디까지나 수박 겉핥기처럼 간단한 내용만을 담고 있습니다.

[환경]

OS : Windows 10
Node.js : 10.16.3 LTS
Vue.js : 2.X
Editor : Visual Studio Code

우선 Node.js와 Visual Studio Code를 설치하도록 하겠습니다.

▶Node.js 설치

Node.js 다운로드

1. https://nodejs.org/ko 접속

Node.js

Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine.

nodejs.org

2. [LTS] 버전을 클릭하여 설치. (현재는 12가 최대 LTS 버전이다. 12로 설치해도 문제 없습니다.)

Node.js 버전 확인 및 REPL 동작 확인

1. 설치 후에 [Window + R] 단축키 또는 윈도우에서 cmd를 입력 후 실행 (명령 프롬프트).

2. (1) Node.js 버전 확인. node -v 입력 후 엔터. 다운로드한 버전이 표시되면 정상적으로 설치 완료.

3. (2) node 를 입력 후 엔터를 입력하면 REPL(Read Eval Print Loop)에 진입.

4. 아래의 코드를 입력 후 엔터.

console.log("Hello World");

5. 결과를 확인.

6. [Ctrl + C] 단축키를 연속으로 입력하여 REPL 종료.

▶Visual Studio Code 설치

Visual Studio Code 다운로드

1. https://code.visualstudio.com 접속

Visual Studio Code - Code Editing. Redefined

Visual Studio Code is a code editor redefined and optimized for building and debugging modern web and cloud applications. Visual Studio Code is free and available on your favorite platform - Linux, macOS, and Windows.

code.visualstudio.com

2. [Download for Windows]를 클릭하여 설치.

확장 프로그램 설치

Visual Studio Code에서 유용한 확장 프로그램을 설치하도록 하겠습니다.

1. [Extensions]를 클릭하거나, [Ctrl + Shift + X] 단축키 입력.

2. (1) [Node.js]를 검색, [Node.js Modules Intellisense] (2)설치.

3. (1) [vue]를 검색, [Vuetur] (2)설치.

4. (1) [prettier]를 검색, [Prettier - Code formatter] (2)설치.

5. (1) [project]를 검색, [Project Manager] (2)설치.

6. 선택 사항 - (1) [sublime]]를 검색, [Sublime Text Key] (2)설치.

(저는 subliem text와 atom를 많이 사용했는데, 멀티 라인은 sublime text가 좀 더 편해서 sublime text 단축키를 사용하기 위해 설치했습니다.)

Prettier 저장 시마다 동작하도록 설정

코드 포맷을 잡아주는 Prettier를 저장할 떄마다 동작하도록 하려면 아래와 같은 방법으로 설정하면 됩니다.

1. [File]

2. [Preferences]

3. [Settings]

4. [save] 검색

5. [Editor: Format On Save] 체크

Visual Studio 프로젝트 저장

작업할 때마다 매번 폴더 열기를 번거로우므로, 이제 프로젝트를 저장하도록 하겠습니다.

폴더 열기

1. (1) [Explorer] 클릭하거나, [Ctrl + Shfit + E] 단축키 입력

2. (2) [Open Folder] 클릭.

(상단에 [File] > [Open Folder]를 클릭 또는 [Ctrl + K Ctrl + O] 단축키를 입력하는 방법도 있습니다.

3. 작업하실 폴더를 열어주세요. (저는 Vue.js라는 폴더로 생성하였습니다.)

프로젝트 저장

현재 열려 있는 폴더를 프로젝트로 저장하는 방법입니다.

1. (1) [Project Manager] 클릭.

2. (2) [Project Manager: Save Project] 클릭.

3. (3) [프로젝트 이름](기본적으로 현재 폴더 이름) 입력 후 엔터.

([Ctrl + Shift + P] 단축키를 입력 후 [Save Project]를 검색하여 저장하는 방법도 있습니다.])

프로젝트 열기

이제 저장한 프로젝트를 여는 방법입니다.

1. (1) [Project Manager] 클릭.

2. (2) [프로젝트 이름] 클릭.

Visual Studio 디버그 테스트(Debug Test)

Node.js를 디버그(Debug)하는 방법을 알아보도록 하겠습니다.

1. (1) [Explorer] 클릭하거나, [Ctrl + Shfit + E] 단축키 입력.

2. (2) 현재 폴더에 우측 클릭 후 (3)[New File] 클릭.

3. app.js라는 파일 생성 후 아래의 코드 입력.

console.log("Hello World");

4. [F5] 단축키를 입력하여 디버그 모드 실행.

5. 하단 [DEBUG CONSOLE]에 결과가 나오면 성공.

디버그 오류

위와 같은 오류가 발생하면 PC를 재부팅 후에 재시도.

▶마치며

이번 글에서는 프로그램 설치에 관해 정리하였습니다.

다음 글에서는 Node.js + Vue.js 프로젝트 만들도록 하겠습니다.

[MySQL] 테이블 구조와 데이터 복사 (Table Structure and Data Copy)

떨어지는 용 — Tue, 29 Jan 2019 14:58:58 +0900

▶MySQL 테이블 구조와 데이터 복사 (Table Structure and Data Copy)

▶설명

현재 생성된 테이블을 복사하는 방법에 대해서 정리하도록 하겠습니다.

이 글에서는 총 4가지를 설명하도록 하겠습니다.

테이블에 구조만 복사하여 테이블 생성
테이블에 구조와 데이터를 복사하여 테이블 생성
테이블에 데이터만 복사하여 입력
테이블 생성 쿼리

[참고]

[MySQL] SHOW 명령어 : https://extbrain.tistory.com/59

▶사용법

테이블 구조 복사

CREATE TABLE IF NOT EXISTS `복사 테이블` LIKE `원본 테이블`;

원본 테이블 구조를 복사하여 복사 테이블로 만듭니다.

IF NOT EXISTS를 통해 이미 테이블이 존재하면 복사하지 않습니다.

※ IF NOT EXISTS 없이 사용해도 문제 없습니다.

테이블 구조와 데이터 복사

CREATE TABLE IF NOT EXISTS `복사 테이블` SELECT * FROM `원본 테이블`;

원본 테이블 구조와 데이터를를 복사하여 복사 테이블을 생성하고 데이터도 저장합니다.

마찬가지로 IF NOT EXISTS를 통해 이미 테이블이 존재하면 복사하지 않습니다.

※ 기본키(Primary Key)와 인덱스(Index), Auto Increment는 제외하고 복사합니다!!!

테이블 데이터 복사

INSERT INTO `복사 테이블` SELECT * FROM `원본 테이블`;

데이터 복사라고 하지만 단순히 INSERT SELECT문을 사용하면 됩니다.

테이블 데이터 부분 복사

INSERT INTO `복사 테이블` (컬럼1 [, 컬럼2 ...]) SELECT 컬럼1 [, 컬럼2 ...] FROM `원본 테이블`;

INSERT SELECT 할 때, 특정 컬럼만 지정할 수도 있습니다.

테이블 생성 쿼리 가져오기

SHOW CREATE TABLE `테이블`;

해당 쿼리를 통해 테이블을 생성하는데 필요한 쿼리를 알 수 있습니다.

기존에 SHOW 명령어에 대한 작성한 글에서도 정리했지만,

비슷한 분류끼리 작성을 위에 추가했습니다.

[Javascript] 테이블을 CSV 파일로 다운로드

떨어지는 용 — Mon, 28 Jan 2019 17:26:59 +0900

▶Javascript 테이블을 CSV 파일로 다운로드

▶설명

테이블에 있는 데이터를 CSV 파일로 다운로드하고 싶은 경우 사용하는 코드입니다.

출처는 아래의 주소입니다.

출처 : https://stackoverflow.com/questions/16078544/export-to-csv-using-jquery-and-html

출처에는 jQuery를 사용한 방법으로 작성됐기 때문에,

제가 기존의 코드에서 변경한 점을 작성하자면 아래와 같습니다.

jQuery가 아닌 Javascript로 동작하도록 수정
파일이 UTF-8 BOM이 되도록 처리하였습니다. (엑셀로 볼 때, 한글 깨짐 현상 방지)

▶예제

export-csv.zip

export-csv 폴더

export.js
index.html

export.js

function exportTableToCsv(tableId, filename) {
    if (filename == null || typeof filename == undefined)
        filename = tableId;
    filename += ".csv";

    var BOM = "\uFEFF";

    var table = document.getElementById(tableId);
    var csvString = BOM;
    for (var rowCnt = 0; rowCnt < table.rows.length; rowCnt++) {
        var rowData = table.rows[rowCnt].cells;
        for (var colCnt = 0; colCnt < rowData.length; colCnt++) {
            var columnData = rowData[colCnt].innerHTML;
            if (columnData == null || columnData.length == 0) {
                columnData = "".replace(/"/g, '""');
            }
            else {
                columnData = columnData.toString().replace(/"/g, '""'); // escape double quotes
            }
            csvString = csvString + '"' + columnData + '",';
        }
        csvString = csvString.substring(0, csvString.length - 1);
        csvString = csvString + "\r\n";
    }
    csvString = csvString.substring(0, csvString.length - 1);

    // IE 10, 11, Edge Run
    if (window.navigator && window.navigator.msSaveOrOpenBlob) {

        var blob = new Blob([decodeURIComponent(csvString)], {
            type: 'text/csv;charset=utf8'
        });

        window.navigator.msSaveOrOpenBlob(blob, filename);

    } else if (window.Blob && window.URL) {
        // HTML5 Blob
        var blob = new Blob([csvString], { type: 'text/csv;charset=utf8' });
        var csvUrl = URL.createObjectURL(blob);
        var a = document.createElement('a');
        a.setAttribute('style', 'display:none');
        a.setAttribute('href', csvUrl);
        a.setAttribute('download', filename);
        document.body.appendChild(a);

        a.click()
        a.remove();
    } else {
        // Data URI
        var csvData = 'data:application/csv;charset=utf-8,' + encodeURIComponent(csvString);
        var blob = new Blob([csvString], { type: 'text/csv;charset=utf8' });
        var csvUrl = URL.createObjectURL(blob);
        var a = document.createElement('a');
        a.setAttribute('style', 'display:none');
        a.setAttribute('target', '_blank');
        a.setAttribute('href', csvData);
        a.setAttribute('download', filename);
        document.body.appendChild(a);
        a.click()
        a.remove();
    }
}

index.html

<!DOCTYPE html>
<html lang="ko">
<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,chrome=1" />
    <title>Javascript To Csv</title>
    <script src="export.js"></script>
</head>
<body>
    <button type="button" onclick="exportTableToCsv('example-table', 'Export example')">
        Export
    </button>

    <table id="example-table" border="1">
        <thead>
            <tr>
                <th>Column 1</th>
                <th>Column 2</th>
                <th>Column 3</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>row 1, 'Col1'</td>
                <td>row 1, 'Col2'</td>
                <td>row 1, "Col3"</td>
            </tr>
            <tr>
                <td>row 2, 'Col1'</td>
                <td>row 2, 'Col2'</td>
                <td>row 2, "Col3"</td>
            </tr>
            <tr>
                <td>row 3, 'Col1'</td>
                <td>row 3, 'Col2'</td>
                <td>row 3, "Col3"</td>
            </tr>
            <tr>
                <td>row 4, 'Col1'</td>
                <td>row 4, 'Col2'</td>
                <td>row 4, "Col3"</td>
            </tr>
            <tr>
                <td>row 5, 'Col1'</td>
                <td>row 5, 'Col2'</td>
                <td>row 5, "Col3"</td>
            </tr>
        </tbody>
    </table>
</body>
</html>

▶실행 결과

[index.html]

[Export example.csv]

[index.html] 페이지에서 Export 버튼을 누르면,

[Export example.csv] 파일이 다운로드 되는 것을 확인할 수 있습니다.

[CodeIgniter] IP 주소 가져오기 (Input 확장)

떨어지는 용 — Tue, 22 Jan 2019 23:41:08 +0900

▶CodeIgniter IP 주소 가져오기 (Input 확장)

▶설명

코드이그나이터에서 제공하는 현재 사용자의 IP 주소를 가져오는 함수에 대해 알아보도록 하겠습니다.

또한, IP 주소를 가져올 때 정확도를 높이기 위한 개선 방법 또한 알아보도록 하겠습니다.

▶IP 주소 가져오기

현재 사용자의 IP 주소 가져오기는 정말 간단합니다.

사용법

$this->input->ip_address();

현재 사용자의 IP 주소를 반환합니다.

만약 유효하지 않은 IP 주소에 경우 '0.0.0.0' 주소를 반환합니다.

그렇지만, 위에 함수를 그대로 사용하면 IP 주소를 못 가져오는 경우가 발생할 수도 있습니다.

현재 사용자가 프록시 서버를 사용중인 경우가 대표적인 예입니다.

그러면 이제 IP 주소를 가져오는 것에 대한 개선 방법을 알아보도록 하겠습니다.

▶코어 Input 확장

IP 주소를 가져오는 함수는 system/core/Input.php라는 파일에 CI_Input이라는 클래스에 위치하고 있습니다.

시스템 코어 파일을 직접 수정하는 것은 좋지 않기 때문에,

코어 Input을 확장하여 IP 주소 가져오기 함수를 개선하도록 하겠습니다.

나만의 접두어 확인

application/config/config.php

$config['subclass_prefix'] = 'MY_';

접두어가 'MY_' 이기 때문에 확장을 위해 생성하는 로그 파일 이름은 'MY_Log'입니다.

※ 다른 이름으로 사용하고 싶으시다면 접두어를 변경하시기 바랍니다.

※ 'CI_' 는 코드이그나이터 기본 접두어이므로 사용해서는 안됩니다!!!

확장 파일 추가

저는 접두어가 'MY_'이므로 MY_Input.php로 추가하겠습니다.

application/core/MY_Input.php

<?php  if ( ! defined('BASEPATH')) exit('No direct script access allowed');

class MY_Input extends CI_Input
{
    public function __construct()
    {
        parent::__construct();
    }
    
    public function ip_address()
    {
        if($this->ip_address !== FALSE)
        {
            return $this->ip_address;
        }

        if( ! empty($this->server('HTTP_CLIENT_IP')) && $this->valid_ip($this->server('HTTP_CLIENT_IP')) )
        {
            $this->ip_address = $this->server('HTTP_CLIENT_IP');
        }
        else if( ! empty($this->server('HTTP_X_FORWARDED_FOR')) && $this->valid_ip($this->server('HTTP_X_FORWARDED_FOR')) )
        {
            $this->ip_address = $this->server('HTTP_X_FORWARDED_FOR');
        }
        else if( ! empty($this->server('HTTP_X_FORWARDED')) && $this->valid_ip($this->server('HTTP_X_FORWARDED')) )
        {
            $this->ip_address = $this->server('HTTP_X_FORWARDED');
        }
        else if( ! empty($this->server('HTTP_FORWARDED_FOR')) && $this->valid_ip($this->server('HTTP_FORWARDED_FOR')) )
        {
            $this->ip_address = $this->server('HTTP_FORWARDED_FOR');
        }
        else if( ! empty($this->server('HTTP_FORWARDED')) && $this->valid_ip($this->server('HTTP_FORWARDED')) )
        {
            $this->ip_address = $this->server('HTTP_FORWARDED');
        }
        else
        {
            parent::ip_address();
        }
        
        return $this->ip_address();
    }
}

이제 기존과 동일하게 $this->input->ip_address(); 함수를 호출해도,

확장된 MY_Input 클래스에 위치한 ip_address 함수를 먼저 호출할 것입니다.

HTTP_CLIENT_IP
HTTP_X_FORWARDED_FOR
HTTP_X_FORWARDED
HTTP_FORWARDED_FOR
HTTP_FORWARDED

위의 값들은 보내지 않을 수도 있는 값이기 때문에,

값 존재 여부와 함께 IP 주소 유효성 검사도 함께 처리하도록 작성했습니다.

▶마치며

위에 코드에 문제점이나, 추가적인 개선 방법이 존재하면 수정하도록 하겠습니다.

[CodeIgniter] 기본 URL 설정

떨어지는 용 — Tue, 22 Jan 2019 22:42:08 +0900

▶CodeIgniter 기본 URL 설정

▶설명

코드이그나이터에서 URL 헬퍼에를 사용할 때,

site_url(), base_url() 함수는 설정 파일에 저장되어 있는 기본 URL(base_url) 값을 기준으로 URL 가져옵니다.

그렇지만, 문제가 발생하는 경우가 있습니다.

▶문제점

만약 기본 URL 값이 아래와 같이 설정되어 있다고 합시다.

application/config/config.php

$config['base_url'] = 'http://www.example.com';

저렇게 설정되어 있다고 해도, 사이트를 접근할 수 있는 방법은 한가지 아닙니다.

http://www.example.com
https://www.example.com (SSL이 설치된 경우)
http://example.com

이와 같이 다양한 로 사이트를 접근할 수 있습니다.

설정된 http://www.example.com이 아닌 다른 방법으로 사이트에 접근하는 경우,

base_url() 함수로 이미지 파일이나, CSS를 호출하면 문제가 발생할 수 있습니다.

(현재 접근한 사이트의 도메인과 파일 경로를 나타내는 도메인이 일치하지 않기 때문입니다.)

▶해결법

그러면 어떻게 설정하면 해결할 수 있을까요?

코드이그나이터 포럼에 글 중 하나에서 해결 방법을 찾을 수 있었습니다.

(출처를 찾게 되는 경우, 수정을 통하여 출처를 기재하도록 하겠습니다.)

application/config/config.php

// $config['base_url'] = 'http://www.example.com';
$config['base_url'] = ((isset($_SERVER['HTTPS']) && $_SERVER['HTTPS'] == "on") ? "https" : "http");
$config['base_url'] .= "://" . $_SERVER['HTTP_HOST'];
$config['base_url'] .= str_replace(basename($_SERVER['SCRIPT_NAME']), "", $_SERVER['SCRIPT_NAME']);

위에처럼 설정하면 좋은 점을 간단히 정리하도록 하겠습니다.

사이트에 사용자가 접근한 프로토콜이 http, https인 경우 모두 정상 동작합니다.
사이트에 도메인이 변경되도 수동으로 작업이 필요 없습니다.

▶마치며

이전에 코드이그나이터 URL 헬퍼를 알아봤기 때문에,

그와 관련된 내용을 간단히 정리했습니다.

[CodeIgniter] URL 헬퍼 (URL Helper)

떨어지는 용 — Tue, 22 Jan 2019 15:46:32 +0900

▶CodeIgniter URL 헬퍼 (URL Helper)

▶설명

코드이그나이터 URL관련된 기능을 쉽게 사용 할 수 있게 도와주는 URL 헬퍼(URL Helper)에 대해 알아보도록 하겠습니다.

이 글에서는 URL 헬퍼에 함수 중 자주 사용하는 함수만을 정리했습니다.

자세한 내용은 아래의 링크를 참고하시기 바랍니다.

URL Helper : http://www.ciboard.co.kr/user_guide/kr/helpers/url_helper.html

▶URL 헬퍼 로드

URL 헬퍼를 로드하는 방법은 간단합니다.

$this->load->helper('url');

그렇지만, 모든 사용하고자 하는 코드에서 개별로 로드하고 싶지 않다면,

아래와 같이 자동으로 로드하도록 처리하면 됩니다.

application/config/autoload.php

// $autoload['helper'] = array();
$autoload['helper'] = array('url');

헬퍼 자동 로드 목록에 URL 헬퍼를 추가하시면 됩니다.

이제는 URL 헬퍼 로드에 관해 신경쓰지 않아도 됩니다.

▶site_url 함수

설정 파일에서 설정된 사이트의 URL을 반환합니다.

사용법

강조 처리된 부분만 필수 사항입니다.

site_url(새그먼트 = '', 프로토콜 = NULL)

URL에는 새그먼트를 전달할 수도 있습니다.

새그먼트 빈 값

코드

echo site_url();

결과

http://example.com/index.php

새그먼트 문자열

코드

echo site_url('news/local/123');

결과

http://example.com/index.php/news/local/123

새그먼트 문자열 (index.php가 제거된 경우)

코드

echo site_url('news/local/123');

결과

http://example.com/news/local/123

새그먼트 배열

코드

$segments = array('news', 'global', '123');
echo site_url($segments);

결과

http://example.com/index.php/news/global/123

▶base_url 함수

설정 파일에서 설정된 사이트의 URL을 반환하는 함수입니다.

사용법

강조 처리된 부분만 필수 사항입니다.

base_url(새그먼트 = '', 프로토콜 = NULL)

URL에는 새그먼트를 전달할 수도 있습니다.

이렇게까지만 보면 site_url 함수와 동일해 보이지만,

base_url 함수는 index.page와 url_suffix를 제외하고 반환합니다.

그렇기 때문에 site_url 함수보다 이미지나 CSS 같은 파일에 경로를 받는데 사용할 수 있습니다.

(물론 site_url도 index.php를 제거하면, 하위 경로에 관해 비슷하게 동작하기 때문에 문제가 되지는 않습니다.)

새그먼트 빈 값

코드

echo base_url();

결과

http://example.com/

새그먼트 문자열

코드

echo base_url('news/local/123');

결과

http://example.com/news/local/123

새그먼트 배열

코드

$segments = array('news', 'global', '123');
echo base_url($segments);

결과

http://example.com/news/global/123

Asset 가져오기

코드

echo base_url('assets/images/profile.png');

결과

http://example/assets/images/profile.png

▶current_url 함수

현재 페이지의 전체 URL (새그먼트 포함)을 반환하는 함수입니다.

사용법

강조 처리된 부분만 필수 사항입니다.

current_url()

기본

코드

echo current_url();

결과

http://example.com/news/local/123

동일한 기능

코드

echo site_url(uri_string());

결과

http://example.com/news/local/123

▶uri_string 함수

현재 페이지의 URI 새그먼트를 반환하는 함수입니다.

사용법

강조 처리된 부분만 필수 사항입니다.

uri_string()

기본

URL

http://example.com/news/local/123

코드

echo uri_string();

결과

news/local/123

▶redirect 함수

페이지를 지정한 경로로 리디렉트 해주는 함수입니다.

사용법

강조 처리된 부분만 필수 사항입니다.

redirect(새그먼트 = '', 메서드= '', 코드 = NULL)

"header redirect"를 수행합니다.

첫 번째 파라미터는 코드이그나이터 내부의 새그먼트를 넣으면 됩니다. (외부 사이트에 경우 URL 전체를 넣어야 합니다.)
옵션인 두 번째 파라미터는 auto, location. refresh 메서드 중 하나를 선택할 수 있습니다. (Location은 더 빠르게 동작하지만 윈도우 서버에서 문제가 발생할 수 있습니다.)
옵션인 세 번째 파라미터는 location 리디렉트를 사용할 경우에만 가능합니다.
옵션인 세 번째 파라미터는 HTTP 응답 코드를 지정할 수 있습니다. (기본 응답코드는 302입니다.)

기본

코드

redirect('/article/13');

redirect - location

코드

redirect('/article/13', 'location');

redirect - refresh

코드

redirect('/article/13', 'refresh');

redirect - 응답코드 301

코드

redirect('/article/13', 'location', 301);

▶마치며

코드이그나이터에 URL 헬퍼를 알아봤습니다.

코드이그나이터에서 제공하는 다른 헬퍼에 대해서도 알고 싶으시다면, 매뉴얼을 참조해 주시기 바랍니다.

[CodeIgniter] URL 규칙과 URI 가져오기

떨어지는 용 — Tue, 22 Jan 2019 00:16:10 +0900

▶CodeIgniter URL 규칙과 URI 가져오기

▶설명

간단하게 코드이그나이터 URL 규칙과 URI 새그먼트를 가져오는 법을 알아보도록 하겠습니다.

자세한 내용은 아래의 링크를 참고하시기 바랍니다.

CI URL 규칙 : http://www.ciboard.co.kr/user_guide/kr/general/urls.html
URI Class : http://www.ciboard.co.kr/user_guide/kr/libraries/uri.html

코드이그나이터는 일반적인 쿼리스트링 방식의 URL이 아닌,

새그먼트 기반의 (Segment-based)의 URL을 사용합니다.

쿼리스트링 방식과 새그먼트 방식을 비교해보도록 하겠습니다.

쿼리스트링 방식 (Query string)

example.com?category=board&name=news&id=12

새그먼트 방식 (Segment)

example.com/board/news/12

어느 방식이 더 좋다고는 말할 수는 없지만,

새그먼트 방식이 좀 더 깔끔하게 보입니다.

▶URI 새그먼트 (URI Segment)

이제 URI 새그먼트에 대해 알아보도록 하겠습니다.

그 전에 한 가지 명심해야하는 점이 있습니다.

※ URI 새그먼트는 URL 코드이그나이터 index.php 바로 뒷부분부터 첫 번째 새그먼트로 구분합니다.

새그먼트 규칙

첫 번째 새그먼트는 호출될 컨트롤러 class 이름입니다.
두 번째 새그먼트는 컨트롤러 클래스 안에 호출될 function(또는 method) 이름입니다.
세 번째 이후에 새그먼트는 컨트롤러로 전달할 변수가 있으면 전달하는 역할을 합니다. (다수 사용 가능)

index.php가 있는 경우

example.com/index.php/class/function/data1/data2

index.php가 없는 경우

example.com/class/function/data1/data2

코드이그나이터가 하위 폴더에 위치하는 경우

example.com/ci/class/function/data1/data2

▶URI 새그먼트 가져오기

이제 URI 새그먼트 값을 가져와 사용하는 방법을 알아보도록 하겠습니다.

URI 새그먼트를 가져오기 위해서는 URI 클래스가 필요합니다.

그렇지만, 해당 클래스는 시스템에서 자동으로 로드하므로 직접 로드할 필요가 없습니다.

사용법

강조 처리된 부분만 필수 사항입니다.

$this->uri->segment(새그먼트 번호, 기본값 = FALSE )

첫 번째 파라미터는 가져올 새그먼트의 번호입니다.

두 번째 파라미터는 해당 새그먼트가 존재하지 않으면 반환하는 값입니다. 기본값은 FALSE 입니다.

예제

URL

localhost/ci/home/test/add/102

application/controllers/Home.php

<?php
defined('BASEPATH') OR exit('No direct script access allowed');

class Home extends CI_Controller {
	
	public function index()
	{
		echo "Home!";
	}
	
	public function test()
	{
		printf("URI Segment 1 : %s <br/>", $this->uri->segment(1));
		printf("URI Segment 2 : %s <br/>", $this->uri->segment(2));
		printf("URI Segment 3 : %s <br/>", $this->uri->segment(3));
		printf("URI Segment 4 : %s <br/>", $this->uri->segment(4));
		printf("URI Segment 5 : %s <br/>", $this->uri->segment(5, "End"));		
	}
	
}

실행 결과

URI Segment 1 : home 
URI Segment 2 : test 
URI Segment 3 : add 
URI Segment 4 : 102 
URI Segment 5 : End

URL에서 새그먼트를 순서대로 가져오고,

마지막에 새그먼트가 존재하지 않으므로 설정된 기본값으로 반환해주는 것을 알 수 있습니다.

▶URL에 접미어 추가

아래와 같이 설정을 변경하면, URL에 접미어를 추가할 수 있습니다.

접미어를 추가하면 해당 페이지가 일반적인 웹페이지처럼 보이게 할 수 있습니다.

application/config/config.php

// $config['url_suffix'] = '';
$config['url_suffix'] = '.html';

URL

localhost/ci/home/test/add/102.html

※ 접미어를 붙여도 마지막 새그먼트는 접미어를 제외하고 가져옵니다.

▶쿼리스트링 방식으로 사용하기

새그먼트 방식이 아닌 쿼리스트링 방식으로 사용하고 싶으시다면,

아래와 같이 설정하시면 됩니다.

application/config/config.php

// $config['enable_query_strings'] = FALSE;
$config['enable_query_strings'] = TRUE;
$config['controller_trigger'] = 'c';
$config['function_trigger'] = 'm';
$config['directory_trigger'] = 'd';

"enable_query_strings" 값을 TRUE로 변경합니다.

그리고, 컨트롤러와 함수 호출에 대한 이름은 취향에 맞게 변경하셔도 됩니다.

※ 쿼리스트링을 이용하면 URL 헬퍼를 사용할 수 없습니다.

URL

새그먼트 URL

localhost/ci/home/test

쿼리스트링 URL

localhost/ci/?c=home&m=test

▶마치며

코드이그나이터에 기본적인 URL 규칙과 URI 가져오는 방법을 알아봤습니다.

다음에는 URL 헬퍼에 대해 알아보도록 하겠습니다.

[CodeIgniter] 로그 파일 분리하기 (로그 확장)

떨어지는 용 — Sat, 19 Jan 2019 23:58:21 +0900

▶CodeIgniter 로그 파일 분리하기 (로그 확장)

▶설명

이전 글에서 코드이그나이터(CodeIgniter)에서 로그를 기록하는 법에 관해 작성했습니다.

이전 글 : CodeIgniter 로그(Log) 기록하기

이번에는 로그 파일을 확장하여 좀 더 편리하게 사용하는 방법을 알려드리도록 하겠습니다.

※ 설명하는 확장 방법은 코드이그나이터 3 기준입니다.

기본적인 뼈대는 아래의 출처입니다. (코드이그나이터 2 기준 설명)

출처 (로그파일 분리하기) : https://cikorea.net/bbs/view/lecture?idx=7113

코어 확장에 대해 자세히 알고 싶으시면 아래의 링크를 확인하시기 바랍니다.

코어 클래서 생성하기 : http://www.ciboard.co.kr/user_guide/kr/general/core_classes.html

▶목표

이 글에서 목표는 총 3가지입니다.

1. 로그 종류에 모니터링(Monitoring) 로그 추가

info 로그를 사용하면 클래스 초기화 같은 불필요한 로그가 많이 남기 때문에,

이를 대신해 원하는 정보만 기록하기 위한 로그로 모니터링(Monitoring) 로그를 추가하겠습니다.

2. 로그 종류에 따른 파일 분리

코드이그나이터에 로그 파일의 이름은 기본적으로 'log-년-월-일.php'로 기록됩니다.

그렇지만, 좀 더 알아보기 쉽게 로그 종류에 따라 로그 파일명이 다르도록 수정할 것입니다.

error : error-년-월-일.php
debug : debug-년-월-일.php
info : info-년-월-일.php
mon : mon-년-월-일.php

※ mon은 새로 추가하는 모니터링(Monitoring) 로그입니다.

3. 로그 헬퍼(Helper) 추가

조금 더 간단하게 로그를 기록할 수 있도록 헬퍼를 추가하도록 하겠습니다.

▶나만의 클래스 접두어 확인 (또는 설정)

로그 확장을 위해 일단 코드이그나이터에 설정된 나만의 클래스 접두어 설정을 확인합니다.

application/config/config.php

$config['subclass_prefix'] = 'MY_';

접두어가 'MY_' 이기 때문에 확장을 위해 생성하는 로그 파일 이름은 'MY_Log'입니다.

※ 다른 이름으로 사용하고 싶으시다면 접두어를 변경하시기 바랍니다.

※ 'CI_' 는 코드이그나이터 기본 접두어이므로 사용해서는 안됩니다!!!

▶로그 쓰레스홀드 (log Threshold) 수정

application/config/config.php

/*
|--------------------------------------------------------------------------
| Error Logging Threshold
|--------------------------------------------------------------------------
|
| You can enable error logging by setting a threshold over zero. The
| threshold determines what gets logged. Threshold options are:
|
|	0 = Disables logging, Error logging TURNED OFF
|	1 = Error Messages (including PHP errors)
|	2 = Debug Messages
|	3 = Informational Messages
|	4 = Monitoring Messages
|	5 = All Messages
|
| You can also pass an array with threshold levels to show individual error types
|
| 	array(2) = Debug Messages, without Error Messages
|
| For a live site you'll usually only enable Errors (1) to be logged otherwise
| your log files will fill up very fast.
|
*/
$config['log_threshold'] = array(1, 4);

error와 monitoring만을 출력할 것이기 때문에 로그 쓰레스홀드를 수정하도록 하겠습니다.

또한, monitoring 로그를 추가할 것이기 때문에 주석도 수정하도록 하겠습니다.

추가된 Monitoring은 4번으로 추가하도록 하겠습니다.

주석에서 기존에 4번이었던 ALL은 Monitoring이 추가되었기 때문에 5번으로 변경합니다.

※ ALL은 로그 레벨 가운데 가장 높은 숫자여야 합니다. (그래야만 ALL 값으로 설정했을 때, 전체 로그가 남습니다.)

▶로그 확장

로그 확장을 위해 core 폴더에 확장 로그 파일을 생성하겠습니다.

application/core/MY_Log.php

<?php  if ( ! defined('BASEPATH')) exit('No direct script access allowed');

class MY_Log extends CI_Log {
    
    protected $_enabled = TRUE;
    protected $_date_fmt    = 'Y-m-d H:i:s';
    protected $_levels = array(
        'ERROR' => 1,
        'DEBUG' => 2,
        'INFO'  => 3,
        'MON'   => 4,
        'ALL'   => 5,
    );
    
    public function __construct()
    {
        parent::__construct();
    }
    
    public function write_log($level, $msg)
    {
        if ($this->_enabled === FALSE)
        {
            return FALSE;
        }
        
        $level = strtoupper($level);
        
        if (( ! isset($this->_levels[$level]) OR ($this->_levels[$level] > $this->_threshold))
        && ! isset($this->_threshold_array[$this->_levels[$level]]))
        {
            return FALSE;
        }
        
        // $filepath = $this->_log_path.'log-'.date('Y-m-d').'.'.$this->_file_ext;
        $filepath = $this->_log_path.strtolower($level).'-'.date('Y-m-d').'.'.$this->_file_ext;
        $message = '';
        
        if ( ! file_exists($filepath))
        {
            $newfile = TRUE;
            // Only add protection to php files
            if ($this->_file_ext === 'php')
            {
                $message .= "<?php defined('BASEPATH') OR exit('No direct script access allowed'); ?>\n\n";
            }
        }
        
        if ( ! $fp = @fopen($filepath, 'ab'))
        {
            return FALSE;
        }
        
        flock($fp, LOCK_EX);
        
        // Instantiating DateTime with microseconds appended to initial date is needed for proper support of this format
        if (strpos($this->_date_fmt, 'u') !== FALSE)
        {
            $microtime_full = microtime(TRUE);
            $microtime_short = sprintf("%06d", ($microtime_full - floor($microtime_full)) * 1000000);
            $date = new DateTime(date('Y-m-d H:i:s.'.$microtime_short, $microtime_full));
            $date = $date->format($this->_date_fmt);
        }
        else
        {
            $date = date($this->_date_fmt);
        }
        
        // $message .= $this->_format_line($level, $date, $msg);
        $message .= $this->_format_line_simple($date, $msg);
        
        for ($written = 0, $length = self::strlen($message); $written < $length; $written += $result)
        {
            if (($result = fwrite($fp, self::substr($message, $written))) === FALSE)
            {
                break;
            }
        }
        
        flock($fp, LOCK_UN);
        fclose($fp);
        
        if (isset($newfile) && $newfile === TRUE)
        {
            chmod($filepath, $this->_file_permissions);
        }
        
        return is_int($result);
    }
    
    protected function _format_line_simple($date, $message)
    {
        return $date.' --> '.$message."\n";
    }
}
// END MY_Log Class

/* End of file MY_Log.php */
/* Location: ./application/core/MY_Log.php */

기존 로그를 기반으로 CI_Log를 상속 받는 MY_Log를 생성하였습니다.

기존에 system/core/Log.php에서 수정된 사항만 간단하게 정리하도록 하겠습니다.

모니터링(Monitoring) 로그 추가

protected $_levels = array(
    'ERROR' => 1,
    'DEBUG' => 2,
    'INFO'  => 3,
    'MON'   => 4,
    'ALL'   => 5,
);

위에서 설명했지만, Monitorng 로그를 4번으로 추가했습니다.

로그 종류에 따라 파일 분리

// $filepath = $this->_log_path.'log-'.date('Y-m-d').'.'.$this->_file_ext;
$filepath = $this->_log_path.strtolower($level).'-'.date('Y-m-d').'.'.$this->_file_ext;

로그 종류에 따라 파일명이 다르도록 변경했습니다.

또한

// $message .= $this->_format_line($level, $date, $msg);
$message .= $this->_format_line_simple($date, $msg);

protected function _format_line_simple($date, $message)
{
    return $date.' --> '.$message."\n";
}

이제 로그 종류가 파일명에 표시되기 때문에, 로그 종류를 로그 내용에서 제거했습니다.

▶로그 확장 테스트

로그 확장 테스트를 위한 컨트롤러를 생성하겠습니다.

전에 만들었던 로그 컨트롤러를 사용하겠습니다.

없으시다면 새로 만드시면 됩니다.

application/controllers/Log.php

<?php
defined('BASEPATH') OR exit('No direct script access allowed');
 
class Log extends CI_Controller {
 
    public function __construct()
    {
        parent::__construct();
    }
 
    public function index()
    {
        log_message("error", "Error Message");
        log_message("debug", "Debug Message");
        log_message("info", "Informational Message");
        log_message("mon", "Monitoring Message");
    }
}

물론 monitoring 로그에 대한 코드가 추가되었습니다.

index 실행 결과

application/logs 폴더에 아래와 같이 나오면 성공입니다.

(물론 파일의 날짜는 다를 수 있습니다.)

error-2019-01-19.php

<?php defined('BASEPATH') OR exit('No direct script access allowed'); ?>

2019-01-19 14:56:34 --> Error Message

mon-2019-01-19.php

<?php defined('BASEPATH') OR exit('No direct script access allowed'); ?>

2019-01-19 14:56:34 --> Monitoring Message

▶로그 헬퍼 추가

이제 로그를 좀 더 쉽게 남기기 위해 로그 헬퍼를 추가하도록 하겠습니다.

application/helpers/log_helper.php

<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');

if(!function_exists('log_error')) {

    function log_error($msg, $obj=null, $debug_backtrace=true)
    {
        if($obj != null)
        {
            $msg = $msg . ' : ' . print_r($obj, true);
        }

        if($debug_backtrace == true)
        {
            $d = debug_backtrace();
            if($d != null && is_array($d) && count($d) > 1)
            {
                $debug = $d[1];
                $msg = sprintf("[%s::%s] %s", $debug['class'], $debug['function'], $msg);
            }
        }

        log_message('error', $msg);
    }
}

if(!function_exists('log_mon')) {

    function log_mon($msg, $obj=null, $debug_backtrace=true)
    {
        if($obj != null)
        {
            $msg = $msg . ' : ' . print_r($obj, true);
        }

        if($debug_backtrace == true)
        {
            $d = debug_backtrace();
            if($d != null && is_array($d) && count($d) > 1)
            {
                $debug = $d[1];
                $msg = sprintf("[%s::%s] %s", $debug['class'], $debug['function'], $msg);
            }
        }
        
        log_message('mon', $msg);
    }
}

로그 헬퍼에는 단 두개의 함수만 추가했습니다.

log_error : 에러 로그 기록
log_mon : 모니터링 로그 기록

2개의 함수의 파라미터는 동일합니다.

메세지 : 로그에 기록할 메세지입니다.
데이터 : 로그에 기록할 변수 값입니다. (array, object)
역추적 여부 : 로그 기록을 호출한 클래스와 함수를 기록 여부입니다.

※ 역추적 여부는 debug_backtrace()가 속도 저하를 시킬 수 있기 때문에, 사용하지 않으시려면 기본값을 false로 처리하시거나, 제거하셔도 됩니다.

▶로그 헬퍼 자동 로드

이제 로그 헬퍼를 자동으로 로드하도록 autoload에 추가하도록 하겠습니다.

application/config/autoload.php

$autoload['helper'] = array('log');

이제 원하는 부분에서 로그 헬퍼에 있는 함수를 호출하면 됩니다.

▶로그 헬퍼 테스트

위에 만들어 놓은 컨트롤러에서 pretty라는 메소드를 하나 추가하도록 하겠습니다.

그리고 데이터를 어떻게 기록하는지 확인하기 위해 데이터도 전달하도록 하겠습니다.

이전 테스트로 생성된 로그 파일은 일단 삭제해주시기 바랍니다.

application/controllers/Log.php

<?php
defined('BASEPATH') OR exit('No direct script access allowed');
 
class Log extends CI_Controller {
 
    public function __construct()
    {
        parent::__construct();
    }
 
    public function index()
    {
        log_message("error", "Error Message");
        log_message("debug", "Debug Message");
        log_message("info", "Informational Message");
        log_message("mon", "Monitoring Message");
    }

    public function pretty()
    {
        $data = array(
            'name' => 'Edward',
            'age' => '17'
        );

        log_error("Error Message!!!", $data);
        log_mon("Monitoring Message!!!", $data);
    }
}

pretty 실행 결과

application/logs 폴더에 아래와 같이 나오면 성공입니다.

(물론 파일의 날짜는 다를 수 있습니다.)

error-2019-01-19.php

<?php defined('BASEPATH') OR exit('No direct script access allowed'); ?>

2019-01-19 15:12:09 --> [Log::pretty] Error Message!!! : Array
(
    [name] => Edward
    [age] => 17
)

mon-2019-01-19.php

<?php defined('BASEPATH') OR exit('No direct script access allowed'); ?>

2019-01-19 15:12:09 --> [Log::pretty] Monitoring Message!!! : Array
(
    [name] => Edward
    [age] => 17
)

로그를 기록한 클래스와 함수가 남는 것을 확인할 수 있습니다.

▶마치며

코드이그나이터에서 로그를 확장하여, 편리하게 사용하는 방법을 알아봤습니다.

위에 내용을 참고하여 자신의 입맛에 맞게 변경하여 사용하도록 합시다.

[MySQL] 범주 조회 (DISTINCT)

떨어지는 용 — Sat, 19 Jan 2019 19:54:27 +0900

▶MySQL 범주 조회 (DISTINCT)

▶설명

MySQL에서 범주를 확인할 때 SELECT DISTINCT를 사용하는 것입니다.

하나, 예를 들어보겠습니다.

테이블에 카테고리라는 컬럼이 존재할 때,

이 카테고리 값이 테이블에 몇 종류가 있는지 알고 싶습니다.

그러면 카테고리를 조회할 때 이 값이 중복되면 안되기 때문에 DISTINCT를 사용합니다.

그럼 이제 기본적인 사용법을 정리하도록 하겠습니다.

▶사용법

컬럼 범주 조회

SELECT DISTINCT 컬럼 FROM 테이블;

조건 처리 후에 컬럼 범주 조회

SELECT DISTINCT 컬럼 FROM 테이블 WHERE 조건식;

컬럼 범주 개수 조회

SELECT COUNT(DISTINCT 컬럼) FROM 테이블;

▶예제 쿼리 (Example Query)

예제 테이블 : hero_collection

idx	type	name
1	1	안중근
2	1	윤봉길
3	2	김유신
4	2	이순신
5	3	이성계
6	3	왕건
7	4	반갑수

type 범주 조회

쿼리

SELECT DISTINCT type FROM hero_collection;

결과

type

idx가 5 미만인 type 범주 조회

쿼리

SELECT DISTINCT type FROM hero_collection WHERE idx < 5;

결과

type

type 범주 개수 조회

쿼리

SELECT COUNT(DISTINCT type) as type_cnt FROM hero_collection;

결과

type_cnt

[CodeIgniter] 로그(Log) 기록하기

떨어지는 용 — Tue, 15 Jan 2019 13:39:05 +0900

▶CodeIgniter 로그(Log) 기록하기

▶설명

코드이그나이터(CodeIgniter)에서 에러나 정보에 대한 로그(Log)를 기록하는 함수를 제공하고 있습니다.

자세한 내용은 아래의 링크를 참고하여 주시기 바랍니다.

에러 핸들링 : http://www.ciboard.co.kr/user_guide/kr/general/errors.html

▶사용법

log_message 함수

강조 처리된 부분만 필수 사항입니다.

log_message(로그 레벨, 메세지, PHP 에러 = FALSE )

로그 레벨 : 문자열
메세지 : 문자열
PHP 에러 : Boolean

로그 레벨 (Log Level)

로그 레벨은 기본적으로 3가지가 있습니다.

error : Error 메세지 - PHP 에러 또는 사용자 에러에 대한 메세지
debug : Debug 메세지 - 디버그를 도와주는 메세지. 클래스 초기화 정보 등을 기록할 수 있습니다.
info : Informational 메세지 - 가장 하위 레벨의 메세지.

사용법만으로는 설명이 부족하기 때문에 예제에서 설명하도록 하겠습니다.

로그 쓰레스홀드(Log Threshold) 설정

application/config/config.php

/*
|--------------------------------------------------------------------------
| Error Logging Threshold
|--------------------------------------------------------------------------
|
| You can enable error logging by setting a threshold over zero. The
| threshold determines what gets logged. Threshold options are:
|
|	0 = Disables logging, Error logging TURNED OFF
|	1 = Error Messages (including PHP errors)
|	2 = Debug Messages
|	3 = Informational Messages
|	4 = All Messages
|
| You can also pass an array with threshold levels to show individual error types
|
| 	array(2) = Debug Messages, without Error Messages
|
| For a live site you'll usually only enable Errors (1) to be logged otherwise
| your log files will fill up very fast.
|
*/
$config['log_threshold'] = 4;

설명

주석에 설명이 모두 작성되어 있으므로 간단하게 설명하도록 하겠습니다.

0 : 로그 비활성화. 로그를 기록하지 않습니다.
1 : Error 메세지 기록
2 : Debug 메세지 기록 (Error 메세지 포함)
3 : Informational 메세지 기록 (Error, Debug 포함)
4 : 모든 메세지 기록.

저희는 테스트를 위해 일단은 4로 설정하도록 하겠습니다.

※ 주의 사항

application/log 폴더에 쓰기 권한이 있어야지만 로그가 기록됩니다!!!

▶예제

application/controllers/Log.php 를 추가하여 테스트하도록 하겠습니다.

코드

<?php
defined('BASEPATH') OR exit('No direct script access allowed');

class Log extends CI_Controller {

    public function __construct()
    {
        parent::__construct();
    }

    public function index()
    {
        log_message("error", "Error Message");
        log_message("debug", "Debug Message");
        log_message("info", "Informational Message");
    }
}

해당 코드를 실행하면 application/log 폴더에 "log-2019-01-15.php" 같이 현재 날짜로 된 로그 파일이 생성된 것을 확인할 수 있습니다.

이제 쓰레스홀드 값에 따른 차이를 알아보도록 하겠습니다.

application/config/config.php 파일에 $config['log_threshold'] 부분을 수정하며 확인해보도록 하겠습니다.

로그 쓰레스홀드 : 4

ERROR - 2019-01-15 03:33:42 --> Error Message
DEBUG - 2019-01-15 03:33:42 --> Debug Message
INFO - 2019-01-15 03:33:42 --> Informational Message

ERROR, DEBUG, INFO에 대한 로그가 모두 남은 것을 확인할 수 있습니다.

(그 외에 클래스 초기화, 페이지 실행 로그 등이 남을 수 있습니다.)

로그 쓰레스홀드 : 3

ERROR - 2019-01-15 03:35:41 --> Error Message
DEBUG - 2019-01-15 03:35:41 --> Debug Message
INFO - 2019-01-15 03:35:41 --> Informational Message

마찬가지로 ERROR, DEBUG, INFO에 대한 로그가 모두 남은 것을 확인할 수 있습니다.

로그 쓰레스홀드 : 2

ERROR - 2019-01-15 03:36:52 --> Error Message
DEBUG - 2019-01-15 03:36:52 --> Debug Message

이번에는 ERROR, DEBUG에 대한 로그만 남은 것을 확인할 수 있습니다.

로그 쓰레스홀드 : 1

ERROR - 2019-01-15 03:39:14 --> Error Message

이번에는 ERROR에 대한 로그만 남은 것을 확인할 수 있습니다.

로그 쓰레스홀드 : 배열

만약에 Error 메세지를 포함하지 않고, Debug 메세지만을 출력하고 싶으시다고요?

그러면 로그 쓰레스홀드를 아래와 같이 설정하시면 됩니다.

application/config/config.php

$config['log_threshold'] = array(2);

로그 파일

DEBUG - 2019-01-15 03:44:28 --> Debug Message

Error 메세지를 제외하고, Debug 메세지만 기록된 것을 확인할 수 있습니다.

만약 Debug와 Info 메세지만 기록하고 싶다면 코드를 아래와 같이 변경하면 됩니다.

$config['log_threshold'] = array(2, 3);

▶마치며

코드이그나이터에서 로그를 기록하는 방법에 대해 알아보았습니다.

이제 코드이그나이터를 사용하면서 로그를 통해 좀 더 쉽게 디버깅을 진행할 수 있을 것입니다.

[PHP] 문자열 큰 따옴표(")와 작은 따옴표(')의 차이

떨어지는 용 — Mon, 14 Jan 2019 22:58:24 +0900

▶PHP 문자열 큰따옴표(")와 작은따옴표(')의 차이

▶설명

PHP 문자열을 사용할 때 큰따옴표(")와 작은따옴표의(')의 차이에 대해 간단하게만 정리하도록 하겠습니다.

나중에 추가적으로 작성할 수도 있습니다.

일반적인 문자열을 사용할 때는 큰따옴표와 작은따옴표의 차이를 알 수가 없습니다.

그렇지만, 문자열 내부에 변수나 개행 문자가 존재하는 경우가 차이가 있는 것을 알 수 있습니다.

▶변수 치환

큰따옴표(")

코드

<?php

$num = 3;
echo "사과가 $num 개 있습니다.";

결과

사과가 3 개 있습니다.

큰따옴표는 문자열 내부에 변수를 치환해서 출력해주는 것을 알 수 있습니다.

작은따옴표(')

코드

<?php

$num = 3;
echo '사과가 $num 개 있습니다.';

결과

사과가 $num 개 있습니다.

작은따옴표는 문자열을 그대로 출력해주는 것을 알 수 있습니다.

▶개행 문자 (\n)

큰따옴표(")

코드

<?php

$num = 3;
echo "사과가 $num 개 있습니다.\n";

결과

사과가 3 개 있습니다.

큰따옴표는 문자열 내부에 \n을 개행 문자로 변환해줍니다.

작은따옴표(')

코드

<?php

$num = 3;
echo '사과가 $num 개 있습니다.\n';

결과

사과가 $num 개 있습니다.\n

작은따옴표는 문자열을 \n을 그대로 출력해주는 것을 알 수 있습니다.

▶마치며

PHP에서 큰따옴표보다 작은따옴표가 더 빠르다는 의견이 있지만, 그 차이가 미미합니다.

큰따옴표와 작은따옴표를 상황에 맞게 적절하게 사용하도록 합시다.

[PHP] 형식화한 문자열 출력 또는 반환 (printf / sprintf 함수)

떨어지는 용 — Mon, 14 Jan 2019 22:33:36 +0900

▶PHP 형식화한 문자열 출력 또는 반환 (printf / sprintf 함수)

▶설명

형식화한 문자열(formatted string)을 출력 또는 반환하는 방법을 알아보겠습니다.

printf : 형식화한 문자열을 출력합니다.
sprintf : 형식화한 문자열을 반환합니다.

두 함수의 사용법은 같습니다!!!

가장 기본적이고 단순한 사용법만 작성하도록 하겠습니다

자세한 내용은 아래의 링크를 참고하여 주시기 바랍니다.

sprintf : http://php.net/manual/kr/function.sprintf.php

▶사용법

강조 처리된 부분만 필수 입력 사항입니다.

printf(형식 문자열, [인수1, 인수2...])

sprintf(형식 문자열, [인수1, 인수2...])

사용법만으로는 설명이 부족하기 때문에 예제에서 설명하도록 하겠습니다.

▶예제

형 지정어 (문자열) : %s

코드

<?php

$total_pizza = 10;
$my_pizza = 3;

$format = '피자 조각 %s개 중 나의 피자 조각은 %s개입니다.';
printf($format, $total_pizza, $my_pizza);

결과

피자 조각 10개 중 나의 피자 조각은 3개입니다.

문자열 안에 문자열 형 지정어(%s)로 설정했습니다.

총 2개의 %s 값이 존재하기 때문에 2개의 인수를 넘겼습니다.

형 지정어가 전달한 인수로 변경되어 출력되는 것을 확인할 수 있습니다.

만약 형 지정어를 2개로 했는데, 인수의 개수가 부족하면 에러를 반환합니다.

그렇지만 이렇게 사용하면 문자열 안에 들어가는 문자열 형 지정어와 인수의 순서를 맞춰 줘야하는 문제가 있습니다.

아래의 예제를 통해 그 문제를 해결하는 방법을 알아보도록 하겠습니다.

형 지정어 : 인수 번호 지정

코드

<?php

$total_pizza = 10;
$my_pizza = 3;

$format = '피자 조각 %2$s개 중 나의 피자 조각은 %1$s개입니다. 나는 %1$s개를 가진다고!';
printf($format, $my_pizza, $total_pizza);

결과

피자 조각 10개 중 나의 피자 조각은 3개입니다. 나는 3개를 가진다고!

위와 같이 형 지정어를 작성하면 원하는 인수를 여러 번 사용할 수도 있고,

문자열 내에 형 지정어와 인수에 순서를 굳이 맞춰 줄 필요도 없습니다.

※ sprintf 함수는 printf 함수와 동일하게 사용하지만 문자열을 출력하는게 아닌 반환합니다.

▶마치며

오직 문자열에 대한 형 지정어만 언급했습니다.

정수와 이진수 등 다양한 형 지정어에 관해 알기 원하시면,

sprintf 문서를 확인하시기 바랍니다.

[CodeIgniter] 컨트롤러 확장 (Extending Controller)

떨어지는 용 — Tue, 18 Dec 2018 11:37:14 +0900

▶CodeIgniter 컨트롤러 확장 (Extending Controller)

▶설명

내장 코어 클래스에 몇몇 함수 추가 정도의 기능을 원하면 내장 클래스를 확장하는 방법이 좋습니다.

많은 컨트롤러에서 반복적으로 사용하는 동작이 있으면, 컨트롤러 확장을 통해 처리하면 편리합니다.

코어 확장에 대해 자세히 알고 싶으시면 아래의 링크를 확인하시기 바랍니다.

코어 클래서 생성하기 : http://www.ciboard.co.kr/user_guide/kr/general/core_classes.html

▶나만의 클래스 접두어 확인 (또는 설정)

컨트롤러 확장을 위해 일단 코드이그나이터에 설정된 나만의 클래스 접두어 설정을 확인합니다.

application/config/config.php

$config['subclass_prefix'] = 'MY_';

접두어가 'MY_' 이기 때문에 확장을 위해 생성하는 컨트롤러 파일 이름은 'MY_Controller'입니다.

※ 다른 이름으로 사용하고 싶으시다면 접두어를 변경하시기 바랍니다.

※ 'CI_' 는 코드이그나이터 기본 접두어이므로 사용해서는 안됩니다!!!

▶테스트 컨트롤러 생성

컨트롤러 확장 테스트를 위한 컨트롤러를 생성하겠습니다.

전에 만들었던 테스트 컨트롤러를 사용하겠습니다.

application/controllers/Json.php

<?php
defined('BASEPATH') OR exit('No direct script access allowed');

class Json extends CI_Controller {

    public function __construct()
    {
        parent::__construct();
    }

    public function _remap($method, $params=array())
    {
        if(method_exists($this, $method))
        {
            $result = call_user_func_array(array($this, $method), $params);
            $this->output->set_content_type('text/json');
            $this->output->set_output(json_encode($result));
        }
        else
        {
            return show_404();
        }
    }

    public function array_result()
    {
        $result = array(
            array(
                'name' => 'Edward',
                'age' => 30
            ),
            array(
                'name' => 'Alex',
                'age' => 25
            )
        );
        return $result;
    }

    public function array_result2()
    {
        $result = array(
            array(
                'name' => 'Jhon',
                'age' => 27
            ),
            array(
                'name' => 'Tom',
                'age' => 28
            )
        );
        return $result;
    }

    // ... other method
}

_remap에서 결과를 JSON으로 변환하여 출력하고 있습니다.

현재 컨트롤러말고도 다른 곳에서도 동일하게 동작할 수 있도록 작업하겠습니다.

▶컨트롤러 확장

컨트롤러 확장을 위해 core 폴더에 확장 컨트롤러를 생성하겠습니다.

application/core/MY_Contoller.php

<?php
defined('BASEPATH') OR exit('No direct script access allowed');

class MY_Controller extends CI_Controller {

    public function __construct()
    {
        parent::__construct();
    }

    public function _remap($method, $params=array())
    {
        if(method_exists($this, $method))
        {
            $result = call_user_func_array(array($this, $method), $params);
            $this->output->set_content_type('text/json');
            $this->output->set_output(json_encode($result));
        }
        else
        {
            return show_404();
        }
    }
}

확장 컨트롤러에 _remap 코드 추가하였습니다.

▶테스트 컨트롤러 변경

이제 확장된 컨트롤러를 사용해보도록 하겠습니다.

테스트로 생성한 컨트롤러에서 상속하는 클래스를 CI_Controller에서 MY_Controller로 변경합니다.

JSON으로 결과를 출력하는 _remap은 부분은 이미 확장 컨트롤러에 존재하기 때문에 제거합니다.

application/controllers/Json.php

코드

<?php
defined('BASEPATH') OR exit('No direct script access allowed');

class Json extends MY_Controller {

    public function __construct()
    {
        parent::__construct();
    }

    public function array_result()
    {
        $result = array(
            array(
                'name' => 'Edward',
                'age' => 30
            ),
            array(
                'name' => 'Alex',
                'age' => 25
            )
        );
        return $result;
    }

    public function array_result2()
    {
        $result = array(
            array(
                'name' => 'Jhon',
                'age' => 27
            ),
            array(
                'name' => 'Tom',
                'age' => 28
            )
        );
        return $result;
    }

    // ... other method
}

실행 결과 (Json/array_result)

[
    {"name": "Edward", "age": 30},
    {"name": "Alex", "age": 25}
]

정상적으로 동작되는 것을 확인했습니다.

이제 확장 컨트롤러를 사용하고자 하는 경우에는 CI_Controller가 아닌 MY_Controller를 사용하시면 됩니다.

※ 만약 생성자를 사용해야한다면 부코 클래스의 생성자를 호출해야합니다!

▶마치며

코드이그나이터에서는 확장할 수 있는 시스템 클래스 목록은 아래와 같습니다.

Benchmark
Config
Controller
Exceptions
Hooks
Input
Language
Loader
Log
Output
Router
보안(Security)
URI
Utf8

다른 클래스와 다르게 Contoller에서는 직접 확장받는 클래스의 이름으로 변경해줘야 합니다.

나중에 추가적으로 다른 클래스를 확장하는 방법을 작성할 수도 있습니다.