1. Korean Language Pack for Visual Studio Code

한국어팩

 

2. Auto Rename Tag

이름 그대로임. 오픈 태그를 수정하면 닫는 태그도 자동으로 수정해준다.

 

3. Bracket Pair Colorizer 2

괄호 색깔이 짝 맞춰 컬러플하다

 

4. indent-rainbow

같은 indent인 것들끼리 색으로 쉽게 확인 가능하고 들여쓰기가 잘 된 경우 빨간색으로 표시된다.

 

5. Prettier - Code formatter

프로젝트의 소스 포맷을 통일하기 좋다

 

6. ESLint

코드 리뷰해준다.

 

7. CSS Peek

css 셀렉터 찾기 좋다.

 

8. Debugger for Chrome

크롬으로 개발한다면 필요함

 

9. vscode-icons

확장자별로 아이콘 표시가 명확하다.

 

// 숫자 배열

const arr = [5, 2, 6, 11, 8, 20];

// 오름차순
arr.sort(function(a, b) {
    return a - b;
});

// 내림차순
arr.sort(function(a, b) {
    return b - a;
});

 

// 문자 배열

const arr = ['cherry', 'peach', 'strawberry', 'apple'];

// 오름차순
arr.sort();

// 내림차순
arr.sort(function(a, b) {
	return (a > b)? -1 : ((a < b)? 1 : 0);
});

 

// 객체 배열

const arr = [
  { key: 10, value: '휴대폰' },
  { key: 5, value: '이어폰' },
  { key: 21, value: '가방' },
  { key: 8, value: '보조배터리' },
  { key: 16, value: '전화기' },
];

// 객체 내 숫자 기준
arr.sort(function(a, b) {
    return a.key - b.key;
});

// 객체 내 문자열 기준
arr.sort(function(a, b) {
	return (a.value > b.value)? -1 : ((a.value < b.value)? 1 : 0);
});

 

마우스 우클릭

터치패드 손가락 2개

1. homebrew 설치 - 3.0.0부터 실리콘 맥 지원

/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

 

2. jdk 설치

// 최신버전
brew install --cask adaptopenjdk

// 특정버전 - 버전정보는 여기서 확인 https://github.com/AdoptOpenJDK/homebrew-openjdk
brew tap AdoptOpenJDK/openjdk
brew install --cask <version>

 

3. nvm 설치

// C++ 컴파일러와 개발 라이브러리 사전 설치
sudo apt install build-essential libssl-dev
sudo yum install gcc gcc-c++ openssl-devel

// curl
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.35.1/install.sh | bash
// wget
wget -qO- https://raw.githubusercontent.com/nvm-sh/nvm/v0.35.1/install.sh | bash

// node.js 특정버전 설치 - 15부터 실리콘 맥을 지원한다
nvm install <version>

// C++ 부터 안되서 그냥 깔았다
brew install node

 

4. Visual Stuio Code

brew install --cask visual-studio-code

 

5. Jetbrain Toolbok - IntelliJ, Webstorm, Android Studio etc....

// toolbox
brew install --cask jetbrains-toolbox

// intellij
brew install --cask intellij-idea

// webstorm
brew install --cask webstorm

// intellij community
brew install --cask intellij-idea-ce

// android stuidio
brew install --cask android-studio

 

a {
  position: relative;
  color: #000;
  text-decoration: none;
}

a:hover {
  color: #000;
}

a::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 2px;
  bottom: 0;
  left: 0;
  background-color: #000;
  visibility: hidden;
  transform: scaleX(0);
  transition: all 0.3s ease-in-out 0s;
}

a:hover::before {
  visibility: visible;
  transform: scaleX(1);
}

 

출처: tobiasahlin.com/blog/css-trick-animating-link-underlines/

+ Recent posts