전체 글
HTTP-SERVER
개요 간단하게 http-server 만들 수 있다. 사용 이유 테스트 용 웹 페이지 만들 때 JavaScript에서 XMLHttpRequest 사용했는데 아래와 같은 에러 메세지 확인 Access to XMLHttpRequest at 'file:///C:/Users/content.html' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, isolated-app, chrome-extension, chrome, https, chrome-untrusted. 로컬에서 로컬 파일 리소스를 요청할 때는 origin(출처)이 null로 넘어..
JEST-REACT18-Vite
JEST 개요 Jest는 React 애플리케이션을 테스트하기 위해 일반적으로 사용되는 JavaScript 테스팅 프레임워크입니다. 개발자들은 쉽게 단위 테스트를 작성하고 실행할 수 있습니다. JEST 설정 1. 라이브러리 설치 🔽 npm install -D @babel/preset-env @babel/preset-react @babel/plugin-transform-runtime @testing-library/jest-dom @testing-library/react @testing-library/user-event identity-obj-proxy jest jest-environment-jsdom @babel/preset-env 대상 환경에 필요한 구문 변환(및 선택적으로 브라우저 폴리필)을 관리할 필요..
View Transitions API
View Transitions API 개요 View Transitions API는 안드로이드에서 사용되는 뷰 전환 애니메이션을 Web에서 쉽게 구현할 수 있도록 해주는 API입니다. 이 API는 개발자가 불필요한 코드를 작성하지 않고도 뷰 전환 효과를 쉽게 구현하며 다양한 효과를 적용할 수 있게 도와줍니다. Chrome 111(2023.03.27) ~ Latest 지원 View Transitions API 진행 현재 화면 캡쳐 후 새 화면으로 애니메이션 효과로 전환하며 이전 화면 제거 document.startViewTransition() API 호출 시 현재 페이지를 캡쳐합니다. startViewTransition()으로 전달된 callback 호출, 이 경우 displayNewImage가 실행되어 D..
JavaScript 변수 검증
x !== "" && x !== null && x !== undefined !!x JavaScript 이중 부정 연산자(데이터 검증) JavaScript에서 데이터 검증 시 아래와 같이 사용합니다. x !== "" && x !== null && x !== undefined 해당 코드를 쉽게 쓰기 위해 이중 부정 연산자에 대해 알아보겠습니다. JavaScript에서 이중 부정 연산자 "!!"는 값을 Boolean 변환에 사용됩니다. "!" 연산자는 Boolean 값을 부정하는 데 사용되므로 값의 부정형을 반환합니다. 이중 부정 연산자 "!!"는 부정을 부정하는 데 사용되므로 원래 값을 Boolean으로 반환합니다. ``` 자바스크립트 let x = 5; console.log(!!x); // true x =..
NPM ERR_INVALID_AUTH 오류 해결
-v 9.5.1 테스트 완료 8.19.3 이상의 버전은 .npmrc 인증 구성이 변경되었습니다. 1. 에러 코드 NPM ERR! Code ERR_INVALID_AUTH npm ERR! Invalid auth configuration found: `_auth` must be renamed to `//r2ware-rd.synology.me:8082/repository/npm_hosted/:_auth` in project config npm ERR! Please run `npm config fix` to repair your configuration.` 잘못된 인증 구성으로서 프로젝트의 npm 설정을 수정해야 한다. 2. 수정 방법 잘못된 이전 .npmrc 구성 보안성 증가된 이후 .npmrc 구성 _auth..
npm cache clean --force
진행 : npm install lib-name@latest 오류 : 이미 설치된 라이브러리의 최신 버전이 아닌 이전 버전을 업데이트 함. npm cache clean --force - 설명 npm cache clean 는 Node.js 패키지 관리자(npm)용 캐시 삭제 명령 유틸리티입니다. 캐시는 동일한 패키지의 향후 설치 속도를 높이기 위해 패키지를 압축된 형식으로 저장합니다. 시간이 지남에 따라 캐시가 커지고 디스크 공간을 많이 차지할 수 있으므로 캐시를 지우는 것이 유용한 경우가 많습니다. --force옵션은 npm이 캐시가 여전히 유효하다고 생각하는 경우에도 캐시 정리를 강제하는 데 사용됩니다. 명령 실행 시 전체 캐시를 지워 시스템의 디스크 공간을 확보합니다. 이렇게 하면 캐시에 저장된 모든 ..
SVN - Eclipse
1. SVN 설치 1.1 기존 사용 버전 해당 버전은 Kit, Connector 설치가 자동으로 진행되었으나 현재 진행되지 않음. 설정 > 팀 > svn > Connector > getConnector 해당 경로로 설치 진행했으나 오류. Kit, Connector 수동 설치 진행했으나 오류. 1.2 업데이트 버전[해당 플러그인 다운 받을 것] 기존과 UI 다르나 작동 2. 기능 기능 탭은 프로젝트 우클릭 > Team 내부에서 확인 2.1 UPDATE 커밋 전 해당 프로젝트의 마지막 버전으로 업데이트된다. 2.2 COMMIT 상단부 로그 기록 하단부 필요없는 파일 제외 후 Commit 하단부 파일 더블 클릭 시 전 버전과 비교
로그 쿼리 확인(log4j/logback)
1. Logback 현재 프로젝트 기준 logback.xml의 root의 level을 debug로 변경하면 로그 확인 가능 (...생략) ==> Preparing: select * , (select wname from scs_wlist where wid = A.wid) , (select task_name from scs_taskinfo where tid = A.tid) as task_name , (select server_name from scs_server where serverid = A.serverid_src) as server_name_src , (select server_name from scs_server where serverid = A.serverid_dst) as server_name_d..
[Intellij]React Prettier, ESlint(airbnb) 설정
1. Prettier 설치 npm install prettier yarn add prettier 2. Prettier 설정 파일 프로젝트 Root 위치에 .prettierrc 파일 생성 후 아래 코드 입력 { //줄 바꿈할 줄 길이 지정 "printWidth": 100, //들여쓰기 공백 수 "tabWidth": 2, //들여쓰기 탭 사용 / 공백 사용 "useTabs": false, //문장의 마지막 세미콜론 작성 여부 "semi": true, //인용 부호 사용 시 큰 / 작은 따옴표 사용 "singleQuote": true, //후행 쉼표 사용 여부 "trailingComma": "all", //대괄호 사이 공백 여부 "bracketSpacing": true, //화살표 함수 괄호 포함 여부 //a..
사설 NPM 업로드 및 다운로드
1. 라이브러리 화 1.1 라이브러리 파일 설정 1.1.1 사용할 함수 Export 및 대표 파일에서 Import 1.2 라이브러리 Build 설정 1.2.1 package.json 설정 1.2.2 vite.config.js build option 설정 1.3 Build Library 2. 업로드 2.1 설정 파일 생성 및 수정 2.1.1 package.json 설정 2.1.2 .npmrc 설정 2.2 업로드 명령어 2.3 업로드 시 오류 및 해결법 2.3.1 .ENEEDAUTH 오류 2.3.2 .E400(Not Allow Updating 오류) 3 다운로드 3.1 설정 파일 생성 3.1.1 .npmrc 파일 설정 3.2 다운로드 시 오류 및 해결법 3.2.1 라이브러리 사용이 되지 않음 기준 버전 Pa..