1. 한글 끝 글자 두 번 입력 문제VSCode를 사용하다가 어느 순간부터 [그림 1]과 같이 한글 끝 글자가 두 번 입력되는 문제가 발생했다. 이 문제는 VSCode의 문제가 아니라 윈도우의 문제였다. 2. 윈도우 설정 변경1) "win + i"를 눌러 설정 창을 띄운다.2) "시간 및 언어 > 언어 및 지역 > 옵션 > Microsoft 입력기"로 이동한다.3) [그림 2]와 같이 "이전 버전의 Microsoft IME"를 "켬"으로 토글 한다. 👍참고한 자료: https://velog.io/@nuyhes/문제해결-한글-입력-시-마지막-글자가-2번-생기는-오류

티스토리(tistory) 블로그에서도 다양한 코드 블록을 제공하지만 간혹 yaml과 같이 제공되지 않는 형식이 있어 답답하여 검색해 봤고 highlight.js를 알게 되었다. 추가 설치 등과 같은 번거로운 작업이 필요 없고 글 작성할 때 HTML 모드로 변경한 후 pre 태그를 조금 수정하면 된다. 아래 코드는 yaml 형식을 지정한 경우이다. data-ke-language 속성에 highlight.js를 입력하고 class 속성에 yaml을 입력하면 된다. highlight.js를 이용해 티스토리에서 제공하지 않는 다양한 포맷들을 적용할 수 있다. 😉 highlight.js 깃허브 참고 : https://github.com/highlightjs/highlight.js/blob/main/SUPPORTE..

일반적으로 회사 홈페이지의 경우 문의하기 폼을 제공한다. 이 기능을 구현하기 위해서는 별도의 백엔드 서버와 DB가 필요한데 구글 스프레드시트를 이용하면 간편하게 구현할 수 있었다. 원리는 간단하다. 작성된 정보를 받을 구글 스프레드시트를 준비하고 홈페이지 HTML 소스 form 태그의 class 속성에 "gform"을 추가하고 action 속성에 구글 스프레드시트에서 제공받은 URL을 추가하면된다. 이렇게 하면 form에서 사용자가 메시지를 작성 후 submit하게되면 구글 스프레드시트에서 사용자가 작성 내용을 확인할 수 있다. 참고 자료 https://velog.io/@qhflrnfl4324/Contact-Me-%EB%A9%94%EC%84%B8%EC%A7%80-%EB%B3%B4%EB%82%B4%EA%B..

인프런의 "아는 만큼 보이는 크롬 개발자 도구(제주코딩베이스캠프)" 강의 내용을 정리한 것이다. Ctrl + Shift + C : 요소 선택 활성/비활성 (개발자 도구 활성화 상태) Ctrl + Shift + d : 개발자 도구 창 분리/병합 (개발자 도구 활성화 상태) Ctrl + Shift + p : 실행 > (명령어 입력) 눈금자 요소 탭 (태그 선택) h : 요소 숨기기/보이기 (태그 선택) 마우스 우클릭 > HTML로 수정 > 코드 선택/복사 Ctrl + f : 문자열 검색 스타일 탭 우선 순위로 인해 활성되지 않은 스타일, 주석 처리된 스타일도 모두 볼 수 있다. element.style에 스타일을 작성하면 선택된 태그에 인라인 스타일을 지정할 수 있다. 색상 선택 도구 색상값 얻기 : 스타일..

1. 유데미 한글 자막이 제공되지 않는 경우 유데미에서 WEB AR 관련 코스를 학습 중인데 영문 자막이라 불편함이 있었다. 구글링의 통해-완벽한 번역은 아니지만-유용한 한글 자막 생성 팁을 얻게 되어 기록한다. 2. 유데미 한글 자막 생성 방법 대본 활성화 > 대본 마우스 우클릭 > 한국어로 번역 자막 > 자막 설정 > 동영상 아래 표시(토글 on) 크롬 개발자 도구 > 콘솔에 아래 코드 입력 if (typeof window.i === "undefined") { clearInterval(window.i); } else { let lastText = ""; function check() { let toEl = document.querySelector(".well--container--1cXrh span"..

크롬 브라우저 ctrl + shift + C : 페이지 안에서 element를 찾을 수 있는 단축키

회사마다 정책이 다를 수 있지만, 보통 오른쪽 끝자리는 작은 변화를 의미합니다. 1.0.1, 1.0.2와 같이 작은 변화가 있을 때마다 숫자 하나를 올려줍니다. 중간 숫자는 하위 버전과 호완이 가능하지만 큰 변화를 의미합니다. 그리고 왼쪽 끝자리는 하위 버전과 호환이 가능하지 않은 큰 변화를 의미합니다. 출처: 최원영. (2020). 비전공자를 위한 이해할 수 있는 IT 지식. 티더블유아이지

모 테크 블로그의 게시글을 보고 있는데 내가 누르지도 않은-하트 모양-공감 버튼이 빨간색으로 변해 있었다. 공감 버튼을 클릭해서 빨간색을 없애고 새로 고침 해봤다. 그 직후 스크롤을 내려 공감 버튼을 관찰하였다. 아니나 다를까 몇 초 후 공감 버튼의 색이-자동으로-빨갛게 변했다. 소스보기로 코드를 살펴보니 setTimeout을 이용해 3초 후에 자동으로 공감 버튼을 클릭하는 코드가 존재했다. 그런 게 가능하다고? 이 게시글에 해당 코드를 붙여 놓았다. 눈을 크게 뜨고 스크롤을 내려 공감 버튼을 지켜보시라! 이런 발칙한 코드는 게시글을 평가하는-소중한-나의 권리를 빼앗아 버렸다. 웃고 넘어갈 문제라 치부할 수도 있겠지만 진지하게 바라보아야 할 일이다!