본문 바로가기

전체 글25

[WARN] caniuse-lite is outdated [WARN] caniuse-lite is outdated 프로젝트에 새 기능을 추가하기 위해 로컬에서 개발 중이었는데 언젠가부터 개발자 서버를 실행시키면 다음 메세지가 출력되었다. caniuse-list가 구식이니 다음을 실행하여 업데이트 하라 뭐 이런 내용이다. 친절히 메세지에 나온 명령어를 실행하였다. npx browserslist@latest --update-db 위 명령어를 실행하니 다음과 같이 에러 메세지가 출력되었다. 그러고보니 난 browserslist 패키지를 설치한 기억이 없는데..? 브라우저 호환때문에 이런 저런 패키지를 설치한게 있으니 그 중 하나의 의존성 패키지로 있는게 아닐까라는 생각이 났다. yarn.lock 파일을 열고 browserslist를 검색하였더니 역시나 존재하였다. .. 2022. 11. 23.
표준 입출력 서식(Format) 문자 표준 입출력에서의 서식 문자 GO에서 표준 입출력 기능은 기본 패키지인 fmt 패키지에서 제공하고 있다. 그 중 서식 문자열을 사용하는 함수들(Printf(), Scanf() 등)이 있는데 이 함수들을 사용할 때 작성하는 format을 정리해보았다. 타입별 포맷 General 구분 설명 %v 데이터 타입에 맞춰서 기본 형태로 출력 %#v 값의 구문 표현을 출력 예)[]int{1, 2, 3}은 []int{1, 2, 3} 그대로 출력 %T 데이터 타입을 출력 %% 아무 값도 출력하지 않는다. % 문자를 그대로 출력 Boolean 구분 설명 %t boolean을 true/false로 출력 Integer 구분 설명 %b 2진수로 출력 %c 유니코드 문자를 출력 %d 10진수로 출력 %o 8진수로 출력 %O 접두.. 2022. 10. 24.
문자열을 정수형으로 변환 시 parseInt()와 Number 차이점 문자열을 정수형으로 변환 시 parseInt()와 Number 차이점 자바스크립트에서 문자열로 된 수를 정수로 변환 할 때 parseInt()를 사용하다가 Number()도 사용하게 되면서 문득 궁금한게 생겼다. 특정 진수(2, 8, 16진수)가 아닌 10진수 변경은 그냥 Number()만 쓰면 되지 않을까? 혹시 리턴되는 값에 차이가 있나? 라는 궁금증이 생겨서 찾아보았다. 우선 두 가지를 간단히 요약해보자면 다음과 같다. parseInt() 함수는 문자열 인자를 파싱하여 특정 진수의 정수를 반환한다. Number()는 자바스크립트의 원시 값(primitive)인 number를 위한 래퍼 객체(wrapper object)이다. Number 생성자는 숫자를 다루기 위한 상수와 메소드를 가지고 있다. 그럼.. 2022. 3. 18.
자주 쓰는 Git 명령어 자주쓰는 Git 명령어 평소 자주 쓰는 Git 명령어 및 옵션 정리 (Last updated 2022-03-05) 파일 추가와 파일 삭제, 커밋 작업 디렉토리(working directory)의 내용이 변경되면 변경된 파일을 스테이징 영역(staging area)에 추가하고, 스테이징 영역의 파일을 repository로 확정한다. 파일 추가 작업 디렉토리의 내용이 변경되면 아래 명령어를 통해 변경된 파일을 스테이징 영역에 추가한다. 특정 파일 추가 $ git add 작업 디렉토리의 변경사항 모두 추가 $ git add .스테이징 영역에 추가된 파일 삭제 $ git rm --cached 커밋 커밋 메세지 작성하여 커밋 $ git commit -m "First commit"보통 커밋 메세지는 첫 줄에 핵심을.. 2022. 3. 5.
Date format 변경 (yyyy-mm-dd hh:mm:ss) Date format 변경 (yyyy-mm-dd hh:mm:ss) 기존에 흔히 알려진 방법은 new Date()로 새로운 Date 객체를 받고 메서드를 이용하여 연도, 월, 일, 시, 분, 초를 반환받아 이를 문자열로 연결하여 사용하는 방법인데, 이보다 깔끔하고 괜찮은 방법을 발견했다. const date = new Date().toISOString().replace('T', ' ').substring(0, 19); Date 객체를 toISOString() 메서드를 이용하여 ISO 8601 확장 형식에 맞춰진 문자열로 반환받는다. 그러면 '2021-09-11T14:57:58.761Z' 형식으로 문자열을 리턴받음. 1에서 반환 받은 문자열에 T를 공백으로 치환한다.. 2021. 9. 12.
VSCode 마크다운 세팅 VSCODE 마크다운 세팅 이 블로그의 초기 글 몇 개를 제외하고는 전부 마크다운 언어로 작성했다. 마크다운을 작성할 때 주로 사용한 에디터는 vscode인데 마크다운에서 줄바꿈을 할 때 라인 끝에 스페이스 공백을 3번 입력해주게 되는데 vscode에서 저장을 할 때 라인 끝 공백을 제거하는 옵션이 작동하면서 세팅을 추가하게 되었다. vscode의 settings.json을 열고 아래 코드를 추가하였다. "[markdown]": { "files.trimTrailingWhitespace": false } 2021. 9. 5.
포워드 프록시 (Forward Proxy)와 리버스 프록시 (Reverse Proxy) 프록시 서버 (Proxy Server) Proxy의 명사적 의미는 대리, 대리권이다. 일반적인 웹서버와 클라이언트의 통신은 클라이언트가 요청하고 서버가 응답해주는 방식인데, 프록시 서버가 웹서버와 클라이언트 사이에 들어가서 중계기로서의 역할을 해주는 것이다. 프록시 서버는 일반적으로 아래 두 가지의 종류가 있다. 포워드 프록시 (Forward Proxy) 내가 example.com이라는 도메인으로 웹서비스를 한다고 가정해보자. 프록시가 없다면 클라이언트는 인터넷을 통하여 나의 웹서버에 연결하게 된다. 하지만 포워드 프록시를 사용하게 되면 클라이언트는 포워드 프록시 서버로 요청을 하게 되고, 프록시 서버가 example.com에 연결하여 결과 값을 클라이언트로 응답하게 된다. 포워드 프록시는 자주 사용되는.. 2021. 3. 7.
Input type="number" 박스의 화살표 숨기기 Input box 화살표 숨기기 Input 요소를 사용할 때 타입을 지정할 수 있는데, 숫자만 입력하고 싶은 경우 아래와 같이 타입 속성의 값을 number로 작성하게 된다. 이렇게 작성된 코드는 다음과 같이 보이는데 숫자 타입이라서 Input 박스 끝에 값을 증가, 감소 시킬 수 있는 화살표가 나타나게 된다. 아래 스타일을 적용하게 되면 화살표가 안보이게 된다. /* Chrome, Safari, Edge, Opera */ input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } /* Firefox */ input[type=number] { -moz-appearance:.. 2021. 3. 5.
Visual Studio Code SFTP 사용하기 Visual Studio Code에서 SFTP 사용하기 Visual Studio Code에서 Extensions 탭을 연다. sftp를 검색하여 아래 extension을 설치한다. 원격 서버와 동기화 할 디렉토리를 연다. (원격 서버의 소스를 다운 받을 곳) 윈도우 : Ctrl+Shift+P, 맥OS : Cmd+Shift+P로 커맨드 팔레트를 열고 SFTP: config를 실행한다. 여기까지 진행하면 .vscode 디렉토리 아래 sftp.json 파일이 생성되고 기본 세팅이 되어있다. host, username, remotePath를 수정하고 name은 본인이 식별할 수 있는 이름으로 정하면 된다. 공식 Github 저장소에 가면 설정에 대한 자세한 설명이 나와있다. 링크는 아래 참조 Link: 공식 G.. 2020. 4. 21.
개발자 추천 블로그 NAVER D2 카카오 기술 블로그 우아한형제들 기술 블로그 쿠팡 기술블로그 티몬의 개발이야기 Spoqa 기술 블로그 레진 기술 블로그 피플펀드 기술 블로그 라인 엔지니어링 블로그 BSIDESOFT co. Airbnb Engineering & Data Science 데일리호텔 Google Developers Blog News - Facebook for Developers Netflix TechBlog Kloud Blog Grab Tech 2020. 3. 31.
웹브라우저가 어떤 브라우저인지 확인하기 (navigator, userAgent) 웹브라우저 확인하기 평소에는 크롬이나 파이어폭스만 사용하다보니 인터넷 익스플로러(이하 IE)에 대해 신경쓰지 않았다. 현재 회사에서 퇴사자가 거의 시작만 해놓고 퇴사해놓은걸 떠맡아 개발중인데 원래 업무때문에 시간이 너무 없어 매일 조금씩 개발을 하다가 테스트를 진행하는데 갑자기 아차 했다.. 병원 인트라넷 페이지를 만들었는데 생각해보니 병원같은데는 IE를 쓸 것 같은 불안함이 엄습했다. 급하게 IE로 테스트를 해보니 역시나 일부 Javascript API를 제대로 지원못해서 기능이 제대로 동작하지 않았다. 그래서 IE의 경우 다른 방법으로 동작하게끔 처리했고, IE인 경우를 조건문으로 처리하기 위해 아래와 같이 처리하였다. // userAgent 값에 브라우저를 구분하는 고유의 값들이 있다. var ag.. 2020. 3. 19.
iTerm2 실행속도가 느려졌다면? iTerm2를 사용하다보면 실행하였을 때 프롬프트가 뜨는데까지 속도가 느려졌을 때가 있다. 이 때 터미널에서 아래와 같이 시스템 로그들을 삭제해주면 다시 속도를 빠르게 할 수 있다. sudo rm /private/var/log/asl/*.asl 2019. 12. 3.