본문 바로가기

분류 전체보기41

VS Code가 네트워크 드라이브(사내 파일서버 경로)에서 파일을 열지 못할 때 내 컴퓨터에 있는 HTML이 아닌,사내 파일서버 경로에 있는 HTML을 VS코드로 열려고 하면 매번 아래와 같은 에러창이 뜬다. GPT에게 방법을 물어보니 개발 시에 로컬로 복사 후 편집하라는데.. (그걸 누가 모르냐..)급하게 코드를 확인해야 할 때, 언제 로컬로 옮기고 있습니까?암튼. 다시 제안받은 방법은 통했다.VS코드 바로가기 아이콘을 우클릭↓속성↓대상 항목에 아래와 같이 추가↓"C:\Users\\AppData\Local\Programs\Microsoft VS Code\Code.exe" --no-sandbox --no-sandbox 앞에 공백은 필수! 경로 전체는 큰따옴표로 감싸기.경로에 옵션을 추가하고 사내 파일서버에 있는 HTML을 VS코드에서 열려고 다시 시도! 하니아래와 같은 알럿이 떴다... 2025. 10. 20.
chrome inspect 사용해서 핸드폰 화면 데스크탑에 띄우기(디버깅 목적) 나의 경우,PC에서 확인하는 모바일 화면과 핸드폰에서 확인하는 화면이 다를 때 디버깅을 하기 위해 사용하는 편이다. 1. 핸드폰 설정에서 개발자옵션 → USB 디버깅 활성화 2. PC 크롬에서 ' chrome://inspect/#devices ' 열기. 3. 휴대폰 크롬에서 디버깅할 페이지 접속. 4. PC 화면에서 Remote Target 영역에 휴대폰에서 열어 놓은 페이지 리스트 확인 5. inspect 버튼 클릭! 내가 핸드폰으로 보고 있는 크롬 화면을 데스크탑에서 확인 할 수 있음. 개발자 도구로 찍어서 코드 확인 가능! 2025. 9. 3.
회사에서 사용하는 class 네이밍 방식이 궁금하다. 다니는 회사에서 사용하는 클래스 네이밍 방식이 있는데_업계에서는 이런 방식을 뭐라고 하는지 궁금하여 찾아봤다. 보통 아래와 같이 마크업 하고 있다. (data 말고도 post, board, bullet 등등 사용) 타이틀영역   타이틀영역 .. 2025. 6. 20.
ir 기법을 위한 CSS 코드 일단 IR기법은 웹접근성을 위해 필요함다이어그램, 표, 그래프 등이 이미지로 되어있을 때 설명하기 위함임.대체 텍스트를 숨기는 것! (스크린리더로만 읽히도록, 화면에는 안 보임) display: block; position: absolute; overflow: hidden; visibility: hidden; margin: -1px; padding: 0; width: 1px; height: 1px; line-height: 1px; font-size: 1px; border: 0; clip: rect(0 0 0 0); clip: rect(0, 0, 0, 0); pointer-events: none; 보통 내가 작업하는 프로젝트에는 .. 2025. 6. 20.
scroll 이벤트 (jQuery 사용) 요소 일부가 보이면 토글클래스 [스크롤 이벤트 (jQuery코드임)] ● s-animation 클래스를 가진 요소가 뷰포트에 들어왔을 때 show 클래스를 토글 (요소가 스크롤로 화면 중간쯤에 들어오면 show 클래스 부여 / CSS 에서 show 클래스로 애니효과) ▷ 요소 선택 const $sAnimations = $('.s-animation'); ▷ 함수 작성function scrollAnimation() { const triggerPoint = (window.innerHeight) / 1; $sAnimations.each(function(index, section) { const sectionTop = section.getBoundingClientRect().top - $(section).height() / 2; .. 2025. 6. 20.
메일 코딩 table HTML 일부 안되는거 겁나 많은 메일 코딩. 일단 모든 내용들을 감싸는 body 코드 부터. body태그 바로 밑에서 시작하는 table 태그 메일 코딩은 아웃룩이 문제가 아니라 지메일이 문제다. 2025. 6. 20.
gulp 한 줄 한 줄 해석 1년 전에 자동화 툴로 사용했던 gulp 세팅값이다. 당시에 프로젝트가 끝나고 시간적 여유가 있어서, gulp 코드의 한 줄 한 줄에 대한 역할을 찾아서 정리해 놨었다. 지금 여기서 더 업그레이드되었을 수 있다. 최신 문법이 생겼을 수도 있고. 암튼 일단 잃어버릴까 봐 블로그에 기록!const gulp = require("gulp"); // gulp 기본 모듈. 파일을 읽고 변환.const scss = require("gulp-sass")(require("sass")); // gulp-sass는 gulp와 함께 사용 가능한 scss 컴파일러. require("sass")를 통해 Dart Sass 컴파일러 사용 (Dart Sass는 Sass의 최신 기능과 사양을 가장 먼저 지원. 오류 메시지 지원)cons.. 2025. 6. 20.
깃 명령어 자꾸 까먹기 때문에. [자꾸 까먹으니까 여기에 정리해 둠] ● 로컬 브랜치에 작업 후 main에 merge▷ git checkout main (main 브랜치로 이동) ▷ git pull origin main (최신화) ▷ git merge myBranch (머지) ▷ git push origin main (main를 원격 저장소에 푸시) ● main 브랜치 내용을 내 로컬 브랜치에 merge ▷ git checkout myBranch (# myBranch 브랜치로 이동) ▷ git pull origin myBranch (# 원격 브랜치 최신화) ▷ git merge main (# main 브랜치의 변경 사항을 병합) ▷ git push origin myBranch (푸시) ● 로컬 브랜치 이름 변경하기 ▷ 디폴트.. 2025. 6. 20.
이클립스 eclipse / 단축키 정리 계속 추가할 것!한 줄 복사ctrl + alt + ↑, ↓한 줄 삭제ctrl + D줄 이동 (특정 라인으로)ctrl + L실행취소 되돌리기 (헷갈림)ctrl + Y파일 찾기ctrl + shift + rstopctrl + F2startshift + F9renameshift + F6replace in filesctrl + shift + R 2025. 5. 26.

티스토리툴바