👩💻 개발 도구 및 환경
-
[VScode] Open a folder or workspace... (File -> Open Folder)👩💻 개발 도구 및 환경 2023. 2. 7. 16:26
간단하게 테스트 하고 싶은게 있어서 VScode 새 창을 만들어서 작업된 내용을 띄워 보려고 했다. 사용된 확장프로그램은 'Live Server' 이다. 마켓플레이스에서 Live Server를 찾아 검색 후 설치해준다. 문제 단축키가 생각이 나지 않아서 실행시키고자하는 코드에서 우측 클릭 후 아래와 같이 Open with Live Server 를 클릭 해준다. 단축키는 Atl + L 을 누르고, Alt + O 를 누르면 된다고 되어 있다. 그런데 아무리 해도 서버가 실행이 안된다 ㅠㅠ 해결 이유가 뭔지몰라서 잠깐 헤매다가 오른쪽 아래에 뜬 오류메시지를 나중에 봤다. (급하게 테스트 한다고 대충 작업 창켜고해서 세로 화면의 길이가 너무 길어 안보였다.) Open a folder or workspace.....
-
string에 있는 특수문자 변환하는 법(Entity code)👩💻 개발 도구 및 환경 2022. 10. 20. 20:39
개발을 할 때 string에 특수문자가 있을 경우 원하는 값으로 출력이 되지 않을 때가 있다. 이럴 경우 특수문자를 Entity code로 치환해주어야 한다. 사용법 ctrl + f 를 눌러 아래 표(특수문자 코드표)에서 원하는 표현문자를 찾아서 해당 숫자표현을 복사 후 작업하던 내용에 붙여넣기 해서 사용해주면 된다. 특수문자 코드표 (Entity code) 표현문자 숫자표현 문자표현 설명 - �- - 사용하지 않음 space - 수평탭 space - 줄 삽입 - - - 사용하지 않음 space - 여백 ! ! - 느낌표 " " " 따옴표 # # - 숫자기호 $ $ - 달러 % % - 백분율 기호 & & & Ampersand ' ' - 작은 따옴표 ( ( - 왼쪽..
-
[GitHub] README.md에 이미지를 추가하는 방법👩💻 개발 도구 및 환경 2022. 10. 13. 06:04
repository에 관한 설명을 위해 이미지를 등록할 때가 있다. README.md 파일에 이미지를 등록할 때마다 잘 생각 안나서 정리했다. 방법 1.  위의 내용처럼  를 작성후 이미지 URL을 적는다. 방법 2. repository에 저장되어 있는 경우 이미지의 직접 연결할 수 있다.  위의 내용처럼 username, reponame, branch, img.jpg 를 수정하여 이미지를 불러와준다. 그 외에도 여러 방법이 있는것 같다. https://stackove..
-
[vscode] 주석 색상 변경👩💻 개발 도구 및 환경 2022. 9. 24. 11:59
vscode의 주석이 잘 안보여서 색상을 변경할 것이다. Ctrl + , 를 눌러 '설정'을 열어주거나, 왼쪽 하단에 톱니바퀴 버튼을 눌러 '설정'을 찾아 열어준다. 설정창에서 json 검색. settings.json에서 편집 클릭. 그러면 문서가 열린다. 아래 코드를 입력해준다. "editor.tokenColorCustomizations": { "comments": "#5f84b4" //원하는 색상 색상값은 원하는 걸로 바꿔서 사용하면된다.
-
웹표준, 웹접근성 검사하기👩💻 개발 도구 및 환경 2022. 7. 17. 17:07
퍼블리셔 공부를 하게되면 자연스럽게 배우게 되는게 웹표준과 웹접근성인 같아요. 웹 표준 ? (웹 표준화 단체인 W3C가 권고한 표준안에 따라) 사용자가 어떤 브라우저나 기기를 사용하더라도 내용을 동일하게 볼 수 있도록 하는 것. 웹 접근성 ? 모든 사용자가 신체적, 환경적 조건에 관계없이 웹에 접근하여 이용할 수 있도록 보장하는 것. 내가 작성한 마크업이 웹표준, 웹접근성에 맞추어 잘 작성했는지 확인해보려면? HTML 웹표준 검사 HTML은 W3C Validator HTML 마크업 검증 사이트를 이용하면 됩니다. http://validator.kldp.org/ The W3C Markup Validation Service 파일 업로드로 유효성 검사 주의: Windows XP SP2 의 몇몇 IE 에서는 업..
-
[VScode] Reactjs Code Snippets 의 단축키👩💻 개발 도구 및 환경 2022. 2. 15. 15:45
React code snippets 'React code snippets' 는 리액트로 작업하면서 필요하게된 익스텐션인데요. (기억력이 좋지 않은 저와 다른 분들을 위해 사용법을 간략하게 기록하기로 했습니다.) 설치 VScode 에서 확장 플러그인 'React code snippets'를 검색하여 설치합니다. 자주 쓰는 단축키 Trigger Content rcc 클래스 컴포넌트 생성 rrc 클래스 컴포넌트와 react-redux 리덕스를 연결해서 생성 rccp 클래스 컴포넌트와 prop type들을 클래스 뒤에 생성 rcjc import와 export 없이 클래스컴포넌트 생성 rcfc 클래스 컴포넌트와 모든 라이프사이클 메서드를 포함해서 생성 rwwd import 없이 클래스 컴포넌트 생성 rsc 화살표..