분류 전체보기 (262) 썸네일형 리스트형 [VSCode] Github Copilot 확장 이용하기 Github의 코드 AI인 Copilot은 코드를 작성하는 도중에 내가 해당 workspace에서 사용한 코드를 분석하여 제일 근접한 스타일을 추천해주는 유용한 도구이다.tab키를 누르면 추천해준 코드가 모두 반영된다. 만약에 여러줄 코드중에 적용하고자 하는 코드가 한줄이라면?VSCode의 Keyboard Shortcuts (json)에 추가하면된다. ctrl + shift + p 로 검색창을 활성화후에> Preferences: Open Keyboard Shortcuts(json) 파일을 열어 아래와 같이 단축키를 추가한다.{ "key": "shift+alt+right", "command": "editor.action.inlineSuggest.acceptNextLine", "when": .. [CSS] textarea resizer style custom textarea태그는 resize 기능을 가지고 있다. 이 기능 단추를 커스텀해야하는 상황이 생겨서 열심히 서치하고 시도해 본결과 성공했다. 기본 단추에 제공되는 아이콘 말고 디자인된 아이콘을 넣는게 필요해서 ::-webkit-resizer 를 사용하여 background-image에 해당 원하는이미지를 넣어 완성하였다. 이미지까지는 원활하게 넣었지만 특정 사이즈일때 아래와 같이 라운드한 오른쪽 하단이 비어보이는 현상이 생겼다. 한참을 해매면서 resizer 오른쪽 하단의 비는 현상을 없애기위해 border-radius를 ::-webkit-resizer에 열심히 줘도 삐져나와서 시도해 본 끝에 ::-webkit-scrollbar-corner에 줘야한다는걸 알았다! &::-webkit-scrollbar-c.. [React.js] 2개 이상의 모듈 클래스명 부르는 방법 컴포넌트 별 각 모듈 SCSS가 있는데, 그 두개이상의 SCSS를 className으로 부를때는 다음과 같이 부른다. 참고) 바인드 방법으로 클래스를 부르고 있다. import styles from '../../../../src/components/textarea/Textarea.module.scss';import stylesLabel from '../../../../src/components/label/Label.module.scss';import classBind from 'classnames/bind';const bindStyle = classBind.bind(styles);const bindStyleLabel = classBind.bind(stylesLabel);``` 만약 모듈 클래스로 연결하지.. [실무 경험] Vite + React 환경에 SCSS 전역 설정하기 (with Dart SASS 3.0) React 환경에서 실무 퍼블리싱을 하는걸 원했었는데 운이 좋게 현재 React환경에서 플젝을 진행중이다.Vue와 함께 개발된 툴인 Vite인데 React도 지원하는 빌드 도구를 사용하게 되어서 Vite + React 환경을 경험하게 되었다.이전에 디자인 시스템 가이드를 간단하게 소규모로 퍼블쪽은 혼자서 구축한 경험이 있으나, 대규모의 내부 디자인 시스템 컴포넌트는 이번이 처음이여서 잘하고 싶은 마음이 크다. 기존에는 html에 구조를 잡고 SCSS로 스타일을 잡았었는데, 현재 플젝에는 tsx에서 작업을 한다. React에서 Typescript를 사용한 확장자 tsx로 포폴을 만들어보아서 그런지 반갑기도 하다. 문제는 html이 아닌 tsx에 직접 퍼블을 하고 프론트앤드 개발자와 협업을 해야하는데, 함께.. [VSCode] Extension convertToAsciiArt 주석 꾸미기 convertToAsciiArt에 대해 더 자세히 알고 싶으면 다음 링크를 참고해주세요.https://jintrue.tistory.com/entry/VSCode-minimap%EC%97%90%EC%84%9C-%ED%98%84%EC%9E%AC-%EC%9C%84%EC%B9%98-%EC%95%8C%EB%A6%AC%EB%8A%94-%EC%A3%BC%EC%84%9D-%EB%A7%8C%EB%93%A4%EA%B8%B0 [VSCode] minimap에서 현재 위치 알리는 주석 만들기VSCode 플러그인 중 주석을 기깔나게 만들어주는 Convert To ASCII Art 를 소개한다. 예시로는 그럼 미니 맵에서 이렇게 보인다. https://marketplace.visualstudio.com/items?itemName=.. [Develop] 레파지토리 클론 및 특정 원격 브랜치 로컬로 가져오기. // 원격 저장소의 특정 브랜치 로컬로 가져오기.git checkout -t origin/branch-name// 현재 로컬 브랜치 조회git branch// 원격 브랜치 조회git branch -r// 모든 브랜치 조회git branch -a ➕ 로컬에서 생성과 동시에 그 브랜치로 전환하기git checkout -b branchName [VSCode] 한줄 선택 단축키 설정 vscode 단축키 APIhttps://demun.github.io/vscode-tutorial/shortcuts/→ settings > keyboards > expandLineSelection 검색후 설정 cmd + l 이 개인적으로 편하다. 만약 중복된 단축키가 있다면, 다른 단축키로 변경하자. [Mac] 맥 현재 어딘가에 열려있는 로컬 호스트 연결 해제 lsof -i :3333 COMMAND, PID, USER, FD, TYPE, DEVICE SIZE/OFF NODE NAME 등 테이블이 나오면 어딘가에 로컬 서버가 열려있는 것이다. 표시되는 PID의 번호를 죽이기.kill -9 PID 죽였는지 확인.lsof -i :3333 이전 1 2 3 4 ··· 33 다음
