https://ko.vitejs.dev/ Vite Vite, 차세대 프런트엔드 개발 툴 ko.vitejs.dev https://webpack.kr/ webpack 웹팩은 모듈 번들러입니다. 주요 목적은 브라우저에서 사용할 수 있도록 JavaScript 파일을 번들로 묶는 것이지만, 리소스나 애셋을 변환하고 번들링 또는 패키징할 수도 있습니다. webpack.kr Vite vs Webpack vite는 번들링을 생략해서 개발 서버의 시작속도를 높이고, HMR을 위해 네이티브 ES 모듈을 사용해서 코드의 변경사항을 빠르게 반영함 최소한의 설정으로도 개발을 진행할 수 있다는 것이 큰 장점 webpack은 프로젝트가 복잡하고 다양한 설정을 요구하는 경우에 사용하는 것이 적합 요즘 webpack에서 vite로 옮..
CORS란? Cross-Origin Resource Sharing(CORS)는 웹에서 발생하는 보안 정책 다른 도메인(Origin)간의 자원 공유를 제어하는 것 보안 상의 이유로 다른 도메인으로의 HTTP요청을 제한함 원인? 브라우저에서 다른 도메인에 있는 리소스에 접근하려고 할때 발생함 ex) A에서 실행중인 코드가 B에있는 api에서 http 요청을 보내려고 할때 통신을 차단하면서 CORS가 발생함 해결 방법 1. 서버에서 헤더 설정하기 Access-Control-Allow-Origin 헤더를 설정해서 허용할 도메인 명시 2. 크롬 확장 프로그램 사용하기 https://chrome.google.com/webstore/detail/allow-cors-access-control/lhobafahddgcel..
https://developer.mozilla.org/en-US/docs/Web/Performance/Lazy_loading Lazy loading - Web performance | MDN Lazy loading is a strategy to identify resources as non-blocking (non-critical) and load these only when needed. It's a way to shorten the length of the critical rendering path, which translates into reduced page load times. developer.mozilla.org https://imagekit.io/blog/lazy-loading-images..
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Proxy Proxy - JavaScript | MDN Proxy 객체를 사용하면 한 객체에 대한 기본 작업을 가로채고 재정의하는 프록시를 만들 수 있습니다. developer.mozilla.org https://ko.javascript.info/proxy Proxy와 Reflect ko.javascript.info Proxy란? 특정 객체에 대한 가로채기 동작을 제공하는 내장 객체 객체의 동작을 수정하거나 전달함 프록시 생성 const proxy = new Proxy(target, handler) Proxy get & set 예제 let target = { gree..
캐러셀 구현하기 display = 'block', display = 'none'으로 조절 3초에 한번씩 전환 버튼으로도 넘기기 가능 See the Pen carousel by 이아름 (@aahreum) on CodePen.
참고 https://developer.mozilla.org/en-US/docs/Web/API/HTML_Drag_and_Drop_API HTML Drag and Drop API - Web APIs | MDN HTML Drag and Drop interfaces enable applications to use drag-and-drop features in browsers. developer.mozilla.org https://developer.mozilla.org/en-US/docs/Web/API/HTML_Drag_and_Drop_API/File_drag_and_drop File drag and drop - Web APIs | MDN HTML Drag and Drop interfaces enable web ..
