본문 바로가기

Develop/Tools

(3)
[Develop/Tools] Visual Studio Code(VSCode) Emmet 사용 (JSX Emmet 설정) Visual Studio Code(VSCode) Emmet 사용 근래 들어 React, Vue와 기본적인 HTML, CSS 등 프론트엔드 공부를 많이 진행하면서 여러 강좌를 보다 HTML에서 사용했던 Emmet을 VSCode에서 일반 사용과 React JSX에서도 사용하는 방법을 공유하고자 한다. Emmet 이란? 위키에서 HTML,XML,XSL문서 등을 편집할 때 빠른 코딩을 위해 사용하는플러그인이라고 설명되어있다. Emmet 사용 여러 Emmet 문법이 많이 있겠지만 기본적인 사용 몇 개만 설명하고자 한다. HTML 구조 생성 ! 느낌표를 치고 Tab 키를 누르면 아래와 같이 HTML 구조가 자동으로 생성된다. Element 생성 생성하고 싶은 Element를 문자열로 작성하고 Tab 키를 누르면 아..
[Develop/Tools] VSCODE vscode-author-generator Extension 사용 VSCODE vscode-author-generator 사용 여러 개발 회사에서는 각각의 코드 컨벤션을 가지고 있다. 코드의 간격을 탭으로 할지? 스페이스로 할지? 각 자바 클래스나 함수에 주석은 어떤 규약으로 달아 놔야 하는지, glt commit 메시지는 어떻게 하는가 등등 많이 있을 것이다. 회사랑은 별개지만 지인이나 친구들과 같이 스터디 등 토이 프로젝트를 진행하면서 누가 만들었고 무엇을 목적으로 생성한 소스코드인지를 볼 수 있도록 file-header Extension으로 사용하면서 추천하고자 블로그에 포스팅한다. vscode-author-generator 설치 vscode-author-generator는 각 VSCODE에서 좌측에 Extensions 탭을 이용해서 검색하여 설치해도 되고 Ctr..
[Develop/Tools] VSCode Rest Clinet Extension 사용 VSCODE Rest Clinet Extension 사용 Visual Studio Code로 개발을 진행하면서 편리한 Extension을 찾다가 Postman을 대체하여 API 테스트나 간단한 문서 정리에 참고하기 좋은 Extension을 발견하여 소개하는 글을 작성한다. Rest Client 설명 참고 아래는 Rest Client를 사용하면서 참고할 수 있는 Marketplace다. https://marketplace.visualstudio.com/items?itemName=humao.rest-client REST Client - Visual Studio Marketplace REST Client REST Client allows you to send HTTP request and view the re..