'분류 전체보기' 카테고리의 글 목록 (12 Page) :: 놓치기 쉬운 정보 저장
728x90
SMALL

설치방법 : 비쥬얼 스튜디오에서 검색

Material theme 비쥬얼 스튜디오 배경색 변경
Material icon theme 아이콘 모양 세련, 생동감
Prettier 코드 포맷팅(셋팅창 > save 검색 > Format on save 체크 > Prettier 검색 > Prettier : Teb Wigth 2(스페이스 2칸)로 변경 > Prettier quote 검색 > javascript > preferences: Quote Style 에서 auto를 .singie로 변경 > Typescript > preferences: Quote Style 에서 auto를 .singie로 변경
Indent-rainbow 들여쓰기 되어 있는 부분을 하이라이트 표현됨
Auto rename tag 태그를 시작, 끝 한부분만 수정해도 동시에 수정되도록 함
CSS PEEK html에서 정의된 스타일 확인할려면 ctrl + 클릭하면 css로 이동해서 확인 가능
HTML CSS SUPPORT 단어가 자동으로 완성되도록 도움
LIVE SERVER 새로고침을 하지 않더라도 수정하고 저장만 하더라도 자동으로 서버에 동기화됨
HTML to CSS autocompletion css에서 한글자만 쓰더라도 스타일 등 정의된 단어가 자동으로 입력되는 기능
Eslint 실시간으로 오류를 잡아줌

 

728x90
LIST

'기타 > VS Code' 카테고리의 다른 글

[VS Code] (단축키) 유용한 단축키 정리  (0) 2022.06.28
728x90
SMALL

단축키는 Windows 기준으로 작성하였습니다.

하단에는 단축키 전체 모음(windows)을 다운 받을 수 있도록 하였습니다. 참고바랍니다.

command palette ctrl + shift + p, F1 마우스없이 키보드로 검색창 여는 기능
Quick open ctrl + p 해당하는 파일을 빠르게 검색하고 바로 실행되는 기능
User Settings ctrl + , 셋팅창 열기
Toggle Sidebar ctrl + b 좌측에 열려있는 익스플로러창 열고 닫기 기능
Toggle terminal ctrl + `  VS Code에 내장된 터미널 열기 기능
keyboard shortcuts ctrl + k +  s 키보드 단축키 모음창 열기 기능
beginning/end of file ctrl + home , ctrl + end, home, end 빠르게 내비게이션 하는 방법
select word ctrl + shift + 방향키 좌, 방향키 우 단어 단위로 선택
copy line ctrl + c(복사) 하고 ctrl + v(붙여넣기) 커서를 복사할 라인에 클릭 후 누르면 한줄 전체 복사 및 붙여넣기
cut line ctrl + x 커서를 잘라내기할 라인에 클릭 후 누르면 한줄 전체 잘라내기 및 붙여넣기
move line down/up alt + 방향키 위, 아래 해당 라인 전체가 위 아래로 옮겨짐(블록으로 지정해서도 가능)
insert line below ctrl + enter 코드 중간에 커서가 있는 상태에서 작업 완료시 아래칸으로 커서 이동할 때 사용
multi selection ctrl + d 동일한 단어를 수정 및 삭제 등 작업 필요시 여러번 누르면 전부 선택이 되고 그 상태에서 한꺼번에 수정 가능
undo last cursor ctrl + u 이전의 커서 위치로 이동
insert cursor alt + click 여러군데 한꺼번에 선택하는 기능
column (box) selection shift + alt + 마우스 드래그 여러군데 한꺼번에 선택하는 기능
current selection shift + alt + i 해당하는 부분 맨 끝부분이 선택되는 기능

비쥬얼스튜디오 단축키(윈도우용).pdf
0.14MB

 

728x90
LIST

'기타 > VS Code' 카테고리의 다른 글

[VS Code] (설치) 설치 및 유용한 익스텐션  (0) 2022.06.28
728x90
SMALL

 

Integer.valueOf or parseInt의 차이점

'Integer.parseInt'의 경우 우리가 잘 알고 있는 int 형으로 반환한다. 즉 계산 가능.

'integer.valueOf'의 경우 Integer라는 형으로 반환한다. 숫자도 들어있으나 산출 제한.

 

Integer ( Wrapper 클래스 )는 무엇인가?

- Integer wrapper Object로 뭔가가 둘러쌓은 Wrapper 래퍼 클래스이다.

- 직접적인 산술연산은 불가능합니다. (계산하려면 클래스. int Value(); 이런 식으로 언박싱을 하여야 함)

- null 값 처리가 쉽다고 한다.

- Integer Cache라는 곳에서 캐시에 이미 생성한 것이 있으면, 바로 반환하고 아니면 새로 생성한다.

가장 중요한 특징으로 직접적인 산술연산 불가에 초점을 맞추어서 사용하지 않으면 되겠다는 느낌이 들었다.

그럼 Integer는 언제 사용되는가? 자바매소드 인자로 int가 아닌 Object를 요구할 때, 래퍼 클래스로 감싸줍니다.

래퍼 클래스가 제공하는 상수를 사용하고자 할 때 MIN 또는 MAX 최댓값과 최솟값이 미리 정의되어 있습니다.  

무엇을 사용하는 것이 유리 한가에서 특정 형태들의 소수들 모음과 같은 custom wrapper 클래스를 만들거나 하지 않은 이상, ('Integer.parseInt')기본 형태로의 사용이 계산도 편리하고, 메모리 사용도 더 적고, 또한 익숙하니, 굳이 래퍼 클래스까지의 활용은 추천하지 않습니다.

래퍼는 직접 계산이 힘드니, 필요하지 않으면 사용을 자제하는 것이 좋습니다.

728x90
LIST
728x90
SMALL

이름을 불러오는 방식
클래스를 불러올 때는 클래스명 앞에 마침표(.)를 찍어준다. 

중복 사용 여부
클래스는 중복 사용이 가능하여, 동일한 클래스명을 페이지의 여러 곳에 사용해도 무방하다. 

한 요소가 갖는 클래스 & 아이디의 갯수 제한
클래스(class)의 경우에는 한 요소에 여러개의 클래스명이 적용될 수 있다. 

정리하자면, 여러가지 스타일링을 한꺼번에 적용해야 할 때는 클래스(class)를 사용

728x90
LIST
728x90
SMALL

 

CSS reset

CSS Reset은 브라우저에서 통일된 화면을 볼 수 있도록 기본값을 초기화하는 전략이다. 구글링 해보면 리셋 방법도 굉장히 다양하게 나와 있는 걸 알 수 있는데, 그 중 그나마 가장 유명한 건 Eric Meyer라는 개발자가 만들어놓은 CSS reset이다. 그런데 가장 최근 업데이트가 2011년에 있었던 만큼 오래된 자료이기도 하고, 유용한 스타일까지도 초기화해서 비효율을 초래할 수 있다는 비판이 있다.

그래서 최근에는 필요한 부분만 초기화를 하여 사용하기도 하거나 CSS Normalize라는 기법을 사용하는 전략이 생겨났다.

 

CSS Normalize

CSS Normalizes는 브라우저 간 유저 에이전트 스타일의 오차를 줄이고, 버그만 줄이는 방향으로 스타일을 재지정하는 거다. CSS Reset는 기본값을 다 싸그리 엎는 데 반해 CSS Normalize는 기본값들을 최대한 보존하고 수정을 최소화한다.

normalize.css 는 오픈 소스이기 때문에 이 코드를 파일로 저장해 HTML에 연결해 사용하면 된다.

https://necolas.github.io/normalize.css/

728x90
LIST

+ Recent posts