🌟드림코딩 엘리님의 youtube강의를 보고 공부한 내용을 정리한 포스팅입니다🌟 👉youtube강의 https://www.youtube.com/watch?v=tJieVCgGzhs 💡 HTML에서 자바스크립트를 포함할 때 어떻게 포함하는게 효율적인가 1. 🅰 브라우저가 한줄씩 HTML parsing 🅱 script태그가 나오면 HTML parsing 하는 것을 잠시 멈추고, 필요한 자바스크립트(app.js)를 다운받고 실행한다. 그 다음 다시 HTML parsing 단점 💩 만약 자바스크립트 파일용량이 크고, 인터넷도 느리면 웹사이트를 보기까지 많은 시간이 소요된다. 2. 안에 script 포함하는 방법 🅰 ⬇ ⬇ 🅱 ➡ ⬇ 페이지가 준비가 된 다음에 자바스크립트를 다운받고 실행한다. 장점 😀 사용자가 기..

💡 client X,Y 와 page X,Y 비교 client의 X,Y 좌표는 브라우저 창을 통해 "보이는" 페이지의 왼쪽 상단 모서리에 상대적 page의 X,Y 좌표는 전체 페이지의 왼쪽 상단 모서리에 상대적(스크롤링으로 숨겨진 부분 포함) 즉, page 좌표는 브라우저 창에 숨겨진 영역까지 포함해서 좌표가 측정되고, client 좌표는 브라우저 창을 기준으로 좌표가 측정되는 것 참고 https://stackoverflow.com/questions/6073505/what-is-the-difference-between-screenx-y-clientx-y-and-pagex-y

💡 Element.getBoundingClientRect() Element의 위치와 크기 등의 정보를 알고 싶을 때! MDN 요소의 크기와 뷰포트에 상대적인 위치에 대한 정보를 제공하는 DOMRect 개체를 반환. 주의 💦 CSS는 오른쪽 아래를 기준으로 bottom, right 이 측정되기 때문에 주의할 것! Syntax domRect = element.getBoundingClientRect(); 참고 https://developer.mozilla.org/en-US/docs/Web/API/Element/getBoundingClientRect

💡 Window Interface Window 인터페이스에서 자주 사용하는 화면사이즈 정리 window.screen; // 브라우저를 포함한 모니터 사이즈 window.outerHeight; // 브라우저 창 외곽 높이 window.outerWidth; // 브라우저 창 외곽 너비 window.innerHeight; // 페이지가 표기되는 부분의 높이 (수직 스크롤 포함한 영역) window.innerWidth; // 페이지가 표기되는 부분의 너비 (수평 스크롤 포함한 영역) document.documentElement.clientWidth; // 스크롤바 제외한 영역의 높이 document.documentElement.clientHeight; // 스크롤바 제외한 영역의 너비 참고 https://dev..

현 직장은 전통적인 폭포수 모델 방식으로 개발하는데 산출물 중심으로 개발하고 최종 릴리즈 후 새로운 요구사항을 추가하는 것이 쉽지 않다. 특히 개발 중간에 산출물도 변경되는 경우가 많다(┬┬﹏┬┬) 많은 기업들이 애자일 방식으로 일을 하는 것 같다. 다음 직장을 위해 애자일 방법론을 알아둬야 할 것 같아 애자일 프로세스 모델이 무엇인지에 대해 정리해봤다. ⚡ 애자일 프로세스 모델 고객의 요구에 민첩하게 대응하고 그때그때 주어지는 문제를 풀어나가는 방법론 📝 애자일의 기본 가치 ‣ 프로세스와 도구 중심이 아닌, 개개인의 상호 소통 중시 ‣ 문서 중심 X, 실행 가능한 소프트웨어 중시 ‣ 계약과 협상 중심이 아닌, 고객과의 협력을 중시 ‣ 계획 중심이 아닌, 변화에 대한 민첩한 대응을 중시 정리해보자면, 고..

📚 DFS (Depth-First Search) '깊이 우선 탐색'이라고도 부르며, 그래프에서 깊은 부분을 우선적으로 탐색하는 알고리즘. 특정한 경로를 탐색하다가 특정한 상황에서 최대한 깊숙이 들어가서 노드를 방문한 후, 다시 돌아가 다른 경로로 탐색하는 알고리즘이다. ✅ 동작 과정 ( Stack 이용 ) 1️⃣ 탐색 시작 노드를 스택에 삽입하고 방문 처리를 한다. 2️⃣ Stack 의 최상단 노드에 방문하지 않은 인접 노드가 있다면 그 인접 노드를 Stack 에 넣고 방문 처리를 한다. 방문하지 않은 인접 노드가 없으면 Stack 에서 최상단 노드를 꺼낸다. 3️⃣ 2️⃣번 과정을 더 이상 수행할 수 없을 때까지 반복한다. * '방문처리' 는 스택에 한 번 삽입되어 처리된 노드가 다시 삽입되지 않게 체..