Home

2020
etcetc

Mac Catalina zsh에서 nvm not found 해결방법 (bash로 사용하기)

개요macOS Catalina 버전부터 터미널의 기본 셸이 zsh로 바뀌었습니다. zsh(Z 셸)는 macOS Catalina 베타부터 새로 생성되는 모든 사용자 계정의 기본 셸입니다. bash는 macOS Mojave 및 이전 버전의 기본 셸입니다. nvm 설치 포스트방법대로 설치를 하고 source ~/.bash_profile로 서버를 재시작해주면

frontendDevEnv

Webpack4 그리고 babel7으로 React 개발환경 구축하기

시작하기Create-react-app을 이용해서 작업을 해오면서 eject를 하지 않는 이상 webpack과 babel의 설정을 해볼 기회는 많이 없습니다.하지만 webpack과 babel을 알고 개발환경을 구축하면서 이해를 돕도록 하겠습니다. 설치하기프로젝트 폴더를 만들어 주도록 합니다. 123mkdir ft-webpackcd ft-webpacknpm i

style

styled-components lint 적용하기

시작하기styled-components를 사용시에 작성오류를 찾거나 교정을 해줄수 있도록 lint를 추가해보도록 하겠습니다. 설치하기 styledlint (duh) stylelint-processor-styled-components ( 스타일 추출 ) stylelint-config-styled-components ( 구성 요소와 충돌하는 stylelint

style

CSS will-change 속성

시작하기웹킷 계열 브라우저에서 CSS transform이나 animation 같은 프로퍼티를 사용할 때 발생하는 깜빡이는 현상에 관해 알고 있는 사람은 “하드웨어 가속”이라는 용어를 한번쯤 들어본 적이 있을 것 입니다. 하드웨어 가속하드웨어 가속을 활성화하는 방법으로 브라우저를 속여 강제로 animation이나 transform의 시키는 방법을 이용했습니

style

styled-components 반응형 및 스타일 리셋 설정하기

시작하기저번 포스트에서 styled-components 간단한 사용방법을 알아보았습니다.이번 포스트에서는 브라우저 스타일을 리셋하는 방법과 함께 반응형 설정하는 방법을 알아 보겠습니다. npm install styled-components @types/styled-components패키지를 설치해줍니다. 초기 설정브라우저 스타일 리셋을 하도록 하겠습니다.먼

Clone

React와 SVG로 Circular 타이머 구현하기

시작하기svg와 react, moment를 이용해서 다음 이미지와 같지는 않더라고 흡사한 타이머를 구현해 보도록 하겠습니다. 설치하기123create-react-app timer --typescriptcd timernpm i moment @types/moment styled-components @types/styled-components @fortawes

backendnode

Node 와 Window 의 setInterval 비교

시작하기타입스크립트로 React 프로젝트를 진행하면서 setInterval 타입을 정의 할때 어떤타입으로 정의 해야하나 고민을 했습니다.window 의 interval과 node의 interval의 타임은 다릅니다. window 브라우저의 interval 타입 Window setInterval1function setInterval(handler: (...a

DevTILAlgorithm

Algorithm 삽입(insertion) 정렬

시작하기처음에는 왼쪽 끝의 숫자를 정렬이 끝났다고 간주합니다.계속해서 아직 작업하지 않은 숫자 중에서 왼쪽끝에 있는 숫자를 꺼내서 왼쪽의 작업이 끝난 숫자와 비교합니다.왼쪽의 숫자가 더 크면 숫자를 바꿉니다.이 작업을 자신보다 작은 숫자가 나타나거나 왼쪽 끝에 도착할 때까지 반복합니다. [ 4, 2, 6, 8, 3, 1, 5, 7] 왼쪽의 4를 정렬이 끝났

DevTILAlgorithm

알고리즘 시간복잡도와 Big-O

시작하기어떤 알고리즘의 시간 복잡도(Time Complexity) / Big-O 를 논할 때아래 그래프 정도만 숙지하고 있어도, 본인이 만든 코드의 시간 복잡도를 기반으로대략적으로 계산 노드가 기하급수적으로 증가할 때 어떤 일이 벌어질 지 예측 가능합니다. Big-O 표기법의 특징상수항 무시 : 빅오 표기법은 데이터 입력값(n)이 충분히 크다고 가정하고

DevTILAlgorithm

Algorithm 선택(selection) 정렬

시작하기선택 정렬은 첫 번째 자료를 두 번째 자료부터 마지막까지의 자료를 차례대로 비교하여 가장 작은 값을 찾아 첫 번째에 놓고,두 번째 자료를 세 번째 자료부터 마지막자료까지 차례대로 비교하여 그 중에 가장 작은 값을 찾아 두번째에 놓는 과정을 반복하여 정렬을 수행합니다. 배열 [2, 5, 1, 7, 3, 9, 6]가 있으면 가장 작은수인 1을 첫번째 2