자바스크립트로 셀렉트박스 만들기여러개 만들어 공통 소스 사용하고 클래스와 data 값으로 구분 ㅇㅇㅇ님 select1 select2 Default selectA selectB selectC let orderBrand = null;function initSelectLabel(){ const label = document.querySelectorAll('.label'); label.forEach(function(e){ lb.addEventListener('click', e => { let selectList = lb.nextElementSibling; let selectI..
회사에서 git을 사용하다가오래전 stash 해둔 내역을 git stash apply 했다가 깃이 충돌했다 아래와 같이 뜸committing is not possible because you have unmerged files 충돌 원인은 원격(remote)에는 이미 삭제하고 없는 파일이git stash로 불러와졌기 때문 파일 삭제도 안되고 커밋도 안되고 아무것도 안되는 상황이 되었다 먼저 git status 로 충돌 내역 확인 unmerged paths 이렇게 뜨면 깃이 충돌된 것,, 나의 경우 아래와 같이 떴다unmerged paths:use "git add/rm ..." as appropriate to mark resolutionuse "git restore --staged ..." to un..
.tab_cnt{display: none;}.tab_cnt.active{display: block;}const tabMenu = document.querySelectorAll('.tabs li'); const tabBtn = document.querySelectorAll('.tab_link') const tabCont = document.querySelectorAll('.tab_cnt'); tabBtn.forEach(function(e){ e.addEventListener('click', () => { const dataTab = e.dataset.tab; tabMenu.forEach(function(i){ ..
https://codepen.io/jimmybreeze/pen/VwXZReJ Swiper Grid...codepen.io slidesPerColumn, slidesPerGroup 활용해서 grid swiper 만들기 Slide 1 Slide 2 Slide 3 Slide 4 Slide 5 Slide 6 Slide 7 Slide 8 Slide 9 Slide 10 Slide 11 Slide 12 Slide 13 Slide 14 Slide 15 Slide 16 Slide 17 Slide 18 Slide 19 Slide 20 body { background: #eee; font-family..
setLottieAni(); function setLottieAni() { const lottieContainer = document.getElementById('lottie'); const lottieWrap = lottieContainer.closest('.lottie_wrap'); if (!lottieWrap) return; // data-type 속성값 읽기 const typeValue = lottieWrap.getAttribute('data-type'); if (!typeValue) { console.warn('data-type 속성이 지정되지 않았습니다.'); return; } const animationPath = `./lottie_${typeValue}.json`; ..
익스텐션 파일 경로%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 파일에 모든 내용을 작성하는 방식보다, 파일을 기능별로 나누면 각 컴포넌트 구조를 파악하기 쉬움. 신규 인원이 투입돼도 구조만 익히면 빠르..