01/04

TIL

Toy project

• select.selectedIndex
  

: select 태그의 현재 선택된 값의 인덱스를 가져올 수 있다.

select.selectedIndex = 3 이렇게 값을 줘서 원하는 아이템을 선택할 수도 있다.
=> 만약 인덱스에 아이템이 없을 경우, 아무것도 선택되지 않는다.

• select 태그 화살표 없애는 방법

/* 기본 화살표 감추기 */
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;

/* 폰트 상속 */
font-family: inherit;

/* 화살표 이미지 대체 */
background: url(이미지 경로) no-repeat 95% 50%; 

• ✨IE 10, 11의 네이티브 화살표 숨기기

select::-ms-expand { 
	display: none; 
}

• querySelector와 getElementById의 차이점
  : https://velog.io/@chloeee/getElementById-%EA%B7%B8%EB%A6%AC%EA%B3%A0-querySelector-%EC%B0%A8%EC%9D%B4%EC%A0%90

  조금더 구체적으로 선택자를 한정지을 수 있는 것이 querySelector

• 이벤트 위임
  : https://ko.javascript.info/event-delegation

• String을 쉽게 Number 타입으로 변경하는 방법

  1. parseInt
  2. 스트링 앞에 "+" 기호를 붙여준다.

const a = "123";
+a //123;

Vue 강의

• Vscode 환경 설정
  참고 : https://www.inflearn.com/course/Age-of-Vuejs/lecture/21397
  

• 설치 리스트
  - Vetur
  - Night Owl
  - Material Icon Theme
  - Live Server
  - ESLint
  - Prettier
  - Auto Close Tag
  - Atom Keymap
  - Vue VSCode Snippets
  - git clone

• Git clone

  : 현재 폴더를 기준으로 레파지토리의 자원을 그대로 가져온다.

• Node.js 버전 관리

  : 프로젝트 마다 노드의 버전을 변경할 필요가 있기 때문에 NVM을 통해서 노드의 버전을 유동적으로 관리.

• NVM(Node Version Manager)
  설치 링크 : https://github.com/nvm-sh/nvm#installing-and-updating
  설치 명령어: curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.37.2/install.sh | bash

  : terminal을 bash로 설정하고 이 명령어를 실행

• 실행 환경설정

export NVM_DIR="$([ -z "${XDG_CONFIG_HOME-}" ] && printf %s "${HOME}/.nvm" || printf %s "${XDG_CONFIG_HOME}/nvm")" [ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh" # This loads nvm

: 이 내용을 vi 편집기를 통해 ~/.bashrc에 적용. vi ~/.bashrc

• 👀 윈도우 Vscode 터미널 bash 사용하기
  : https://stackoverflow.com/questions/42606837/how-do-i-use-bash-on-windows-from-the-visual-studio-code-integrated-terminal
  
• Node.js 버전 변경 및 설치

1. 노드 현재 버전 확인 : node -v
2. NVM을 통한 설치 : nvm install 버전 이름
3. NVM 버전 확인 : nvm version
4. 노드 버전 전환 : nvm use 버전 이름

• npm install, npm i

  : 프로젝트의 package.json에 정의되어 있는 라이브러리들을 사용할 수 있도록 다운로드.