익스텐션 파일 경로%USERPROFILE%\.vscode\extensions 복사한 폴더명과 폴더 구조.vscode/extensions/ritwickdey.liveserver-5.7.9/├── package.json├── extension.js├── out/└── ... 폴더 이름 확인, 폴더 안에 package.json 파일 있는지 확인하기 VS Code 완전히 재시작하기작업관리자 열어 Code.exe 남지 않도록 확인하기VDI 환경일 경우 세션 종료 후 재로그인 필요할 수 있음 *VS Code 완전 종료하는 방법1. Ctrl+Shift+ESC 눌러 작업관리자 실행=> [프로세스] 탭에서 Code.exe, Code.helper 찾아 우클릭=> 작업 끝내기(End Task) 2. 명령줄에서 종료ta..
현재 우리 회사에서는 react나 vue와 같은 프레임워크 없이도컴포넌트 기반으로 마크업을 작성하고 html과 css를 불러오는 구조로리뉴얼 프로젝트를 진행할 예정이다. 프레임워크 없이 컴포넌트 기반으로 리뉴얼 프로젝트를 진행할 때의 장단점과예상되는 문제점, 퍼블리싱 시 고려해야 할 포인트들을 정리해봤다. 장점1. 컴포넌트 단위의 재사용 버튼, 헤더, 푸터, 카드 등 공통 UI를 모듈화해서 관리하면 중복 작업이 줄어들고 개발 속도가 빨라짐. 반복되는 구조를 재사용 가능하니 HTML 마크업이 깔끔해지고, 생산성이 향상됨. 2. 코드 분리로 가독성 향상 하나의 html 파일에 모든 내용을 작성하는 방식보다, 파일을 기능별로 나누면 각 컴포넌트 구조를 파악하기 쉬움. 신규 인원이 투입돼도 구조만 익히면 빠르..
개발 작업을 진행하다가 자주 보는 에러 메시지 Web server failed to start. Port 3000 was already in use. 해당 포트가 이미 사용 중이라 서버를 띄우지 못하는 상황 이처럼 로컬 포트에서 작업하다가 해당 port를 kill 해야 하는 경우가 발생했다면해당 port의 정보를 조회해 pid 번호를 알아낸 뒤 kill 한다 1. MAC 특정 port의 정보를 찾으려면lsof -i:[포트번호]lsof -i:3000 해당 프로세스를 강제 종료하려면kill -9 [PID]kill -9 00000 (+) lsof란?List Open Files의 약자현재 시스템에서 열려 있는 파일들의 목록을 보여주는 유닉스 명령어파일을 열고 있는 프로세스의 PID(프로세스 식별 번호)..
[print] A4용지 프린트용 페이지 픽셀 변환 사이즈 / 윈도우 PPI
A4용지로 프린트되는 페이지를 html 마크업 작업 시 단순 A4용지 사이즈로 작업하면 시안과 프린트물에 차이가 생긴다. A4용지 사이즈를 단순히 픽셀로 변환하면 1240*1754이지만 윈도우의 해상도는 96PPI (PPI는 Pixels Per Inch의 줄임말로 해상도를 뜻함) 그래서 A4용지로 인쇄되는 페이지의 경우 px로 변환하면 794*1123 사이즈로 작업해야 한다 디자인 시안 사이즈도 너비 794px로 나와야 함 ! 794px에서 양옆 여백을 62px로 잡으면 컨텐츠 영역이 670px이 되는데 컨텐츠 영역이 670px일 때가 안정적이라고 함 (A4에 인쇄했다고 생각하면 대략 양옆 여백 16mm 정도) @page{size: A4; margin: 8mm 0;} 페이지 세팅에서 위아래 마진을 10m..
