분류 전체보기

1K 1천 1.1천 같이 숫자를 포맷하기

1천, 1만, 1.1만 숫자 표기가 길어질 때가 있다. 짧게 단위를 붙여서 표기해보자 const compactNumberFormatter = new Intl.NumberFormat('ko', { notation: 'compact', }); function compactNumber(number: number): string { return compactNumberFormatter.format(number); }

Angular 생명주기(Lifecycle)와 훅(Hook) 메소드

1. 생명주기 Angular의 컴포넌트와 디렉티브는 생명주기(Lifecycle)를 갖는데, 생명주기는 Angular가 컴포넌트와 디렉티브를 생성하여 소멸하기까지의 과정을 관리하는 것을 의미합니다. 이와 관련하여 생명주기 이름 앞에 ng가 붙은 훅(Hook) 메소드를 제공하는데 이를 구현하여 생명주기의 각 단계에서 처리해야하는 내용을 정의할 수 있습니다. Angular는 다음의 순서대로 생명주기를 관리합니다. ※ 디렉티브 생명주기 훅 메소드 디렉티브도 컴포넌트와 동일한 생명주기 훅 메소드를 사용합니다. 하지만 디렉티브에는 뷰가 없기 때문에 뷰와 관련된 생명주기인 ngAfterViewInit, ngAfterViewChecked, ngAfterContentInit, ngAfterContentChecked 메소..

JavaScript 접속기기 모바일/웹 여부 확인

const isMobile = () => { return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent); }; 모바일일 경우 true, 아닐 경우 false

글 작성 경과 시간 표시 / elapsedTime (방금 전, 몇 분 전 작성) / Javascript

코드 function elapsedTime(date) { const start = new Date(date); const end = new Date(); const diff = (end - start) / 1000; const times = [ { name: '년', milliSeconds: 60 * 60 * 24 * 365 }, { name: '개월', milliSeconds: 60 * 60 * 24 * 30 }, { name: '일', milliSeconds: 60 * 60 * 24 }, { name: '시간', milliSeconds: 60 * 60 }, { name: '분', milliSeconds: 60 }, ]; for (const value of times) { const betweenTim..

Angular 보조 라우터 / router-outlet

Angular 보조 라우터 앵귤러의 라우터는 몇가지 특징이 있다. 컴포넌트기반 라우팅설정 직관적인 라우팅 설계 가드(Guard) 로 조정 하위 라우팅 기존에 알고있는 하위 라우팅 말고도 보조라우터라는것이 있어 알아보자 Angular 라우터 Angular 의 라우터는 path에 대해 컴포넌트를 정의하고 컴포넌트가 로드될 위치를 RouterOutlet 디렉티브로 정의한다. 보조 라우터 path 를 정의할 때 outlet 이라는 속성에 이름을 부여할 수 있다. @NgModule({ imports: [ RouterModule.forRoot([ { path: 'foo', component: FooComponent }, { outlet: 'outlet1', path: 'bar', component: BarCompo..

git config setting / store credential

git config란, git에 대한 설정 정보이다. git 전체 config 리스트 보기 git config --global --list git config 설정하기 (이름, 이메일) git config --global user.name "이름" git config --global user.email "이메일" -> global : 전역적인 설정 git config 삭제하기 git config --unset --global user.name git config --unset --global user.email Credential.helper - Cache id, password를 짧은 시간동안 반복적으로 입력하는 일을 피할 때 사용 git config --global credential.helper c..

How to Run Multi-Container Applications with Docker Compose (Docker Compose Install)

Installation Docker Compose relies on Docker Engine. So before installing it make sure you have Docker Engine installed on your system. On desktop systems like Docker Desktop for Mac and Windows, Docker Compose is included as part of those desktop installs. You don’t need to install it manually. On Linux systems, you’ll need to Install Docker Engine Run the following command to download the curr..

[node.js] JavaScript heap out of memory

build 하던 중 에러 발생 $ yarn run build yarn run build yarn run v1.22.19 $ tsc ll[7385:0x55e7520] 16439 ms: Mark-sweep (reduce) 486.9 (495.9) -> 485.7 (496.1) MB, 394.6 / 0.0 ms (+ 63.3 ms in 15 steps since start of marking, biggest step 18.9 ms, walltime since start of marking 493 ms) (average mu = 0.237, current mu = 0.247) allo[7385:0x55e7520] 17047 ms: Mark-sweep (reduce) 486.7 (496.1) -> 486.1 (4..

[Linux] 비밀번호 없이 SSH 원격 접속하기 (PEM Key 생성)

Linux 상에서 원격서버(마찬가지로 Linux)에 SSH 접속을 할 때 계정과 비밀번호를 요구한다. 하지만 자동화를 하는 과정에서는 계정과 비밀번호를 입력할 수 없으니 (또는 계정과 비밀번호를 하드코딩하는 것은 보안상에 문제가 됨.) OpenSSH와 사용되는 Pem Key를 이용해서 접근하는 것이 좋다. 이번에는 해당 부분을 확인한다. # [클라이언트]에서 2048 비트의 RSA키 생성 # ssh-keygen -t rsa -b 2048 -f [파일이름] $ ssh-keygen -t rsa -b 2048 -f druid # [원격 서버]에서 authorized_keys 파일 생성 (없는 경우) $ mkdir ~/.ssh/ $ chmod 700 ~/.ssh/ $ touch ~/.ssh/authorized_..

Linux - df, du 명령어 정리 (파일, 디스크 용량 확인)

리눅스 터미널에서 디스크의 용량을 확인하거나 파일의 용량을 확인할 때 df, du 명령어를 사용합니다. 자주 사용하는 df와 du 명령어에 대해서 정리하였습니다. df 명령어 df 명령어를 입력하면 파일시스템에 대한 전체 용량과 사용가능한 용량을 보여줍니다. $ df Filesystem 1K-blocks Used Available Use% Mounted on udev 12264724 0 12264724 0% /dev tmpfs 2460004 1952 2458052 1% /run /dev/sda2 271547844 231888176 25980832 90% / tmpfs 12300020 91200 12208820 1% /dev/shm tmpfs 5120 4 5116 1% /run/lock df -h -h 옵..