전체 글30 Vue2 vs Nuxt2: element 변동시 Scroll 동작 비교 (feat. anchor) 이슈 및 원인컴포넌트 리스트가 있는 페이지에서 중간 요소를 삭제할 때, Vue2와 Nuxt2 프로젝트 간 스크롤 동작의 차이가 발생했다.Vue2에서는 삭제된 요소 아래의 컴포넌트가 위로 올라오며 시야가 바뀌는 현상이 발생Nuxt2에서는 현재 보고 있던 시야가 유지되고, 삭제된 위치에 위쪽 요소가 내려오거나 아래 요소가 자연스럽게 채워지는 형태로 동작해당 차이는 overflow-anchor의 작동 방식이 DOM 구조에 따라 다르게 체감되는 데에서 기인하는 것으로 판단한다.Vue2와 Nuxt2 모두 기본적으로 overflow-anchor: auto 상태이지만, 실제 스크롤 시 컴포넌트 삭제 등의 레이아웃 변화에 따라 체감되는 스크롤 보정 동작은 완전히 다르게 나타난다. 비교항목Vue2Nuxt2overflow.. 2025. 4. 11. 함수형 자바스크립트 기본기 본 문서는 유동균의 함수형 프로그래밍 강의를 수강하고 공부한 자료이다. 1. 평가 : 코드가 계산되어 값을 만드는 것 2. 일급- 값으로 다룰 수 있다.- 변수에 담을 수 있다.- 함수의 인자로 사용할 수 있다.- 함수의 결과로 사용될 수 있다. 3. 함수 역시 일급이다.- 함수를 값으로 다룰 수 있다. = 변수에 함수를 담을 수 있다.- 함수는 평가를 통해 값을 다른 함수에게 전달할 수 있다.- 함수의 결과값으로 함수를 가질 수 있다.- 함수형 프로그래밍에서 조합성과 추상화의 도구로 사용이 가능하다. 4. 고차함수 : 함수를 값으로 다루는 함수 1. 함수를 인자로 받아 실행하는 함수 - 함수를 인자로 받아서 내부에서 실행하여 특정인자 적용하는 프로그래밍 : applicative programmi.. 2025. 2. 14. [Vscode] html 파일의 script 실행하기 1. 브라우저에서 실행HTML 파일을 실행하는 가장 간단한 방법은 브라우저에서 여는 것이다.필자도 해당 방법을 사용중이다.방법:HTML 파일을 우클릭하고 **"Open with Live Server"**를 선택한다.Live Server는 VSCode 확장 프로그램으로, 실시간 미리보기를 제공한다.Live Server가 설치되지 않았다면, Extensions Marketplace에서 설치 가능하다.장점:빠르고 간단하며, 브라우저에서 실행되는 실제 결과를 확인할 수 있다.2. 내장된 Node.js를 사용VSCode에서 Node.js를 사용하여 JavaScript 코드를 실행할 수 있다.다만, Node.js는 브라우저 환경이 아니라서 DOM 관련 코드 (document, window 등)는 실행되지 않는다.방.. 2025. 2. 14. [UnJS] [unbuild] javascript 빌드를 위한 시스템 unbuild는 Vue와 Nuxt 생태계에서 자주 사용되는 빌드 도구로, CommonJS(CJS)와 ESM(ES Module) 형식 모두로 출력을 생성할 수 있는 강력하고 유연한 빌드 시스템이다.unbuild : https://github.com/unjs/unbuild GitHub - unjs/unbuild: 📦 A unified JavaScript build system📦 A unified JavaScript build system. Contribute to unjs/unbuild development by creating an account on GitHub.github.com 사용 상황 예시1. 라이브러리 개발: 모듈 개발시 여러 환경에서 동작하도록 배포하는 경우2. ESM/CJS 호환성: 모.. 2024. 11. 21. 이전 1 2 3 4 5 6 7 8 다음
