본문 바로가기

분류 전체보기161

[CSS] hover 시 이미지 커지게 하기 www.w3schools.com/howto/howto_css_zoom_hover.asp How To Zoom on Hover with CSS How TO - Zoom on Hover Learn how to zoom/scale an element on hover with CSS. Zoom on Hover Hover over the green box: How To Zoom on Hover Example 2021. 4. 9.
[React] Intersection Observer API 사용한 Infinite Scroll 만들기(without React Hook) 한번에 데이터를 모두 불러오는 것이 아닌, 화면을 스크롤할 때마다 데이터를 추가로 불러오는 Intinite Scroll을 구현해 보았다. Infinite Scroll 구현 방법 scroll event: 스크롤이 끝까지 내려가는 경우 데이터 추가로 불러오도록 구현하는 방법 throttle 등을 추가로 구현해 최적화 할 필요가 있음 Intersection Observer API 사용 찾아보니 Intersection Observer API를 활용한 예제가 많고 편리한 듯 하여 Intersection Observer를 사용하기로 했다. 일부 브라우저에서는 Intersection Observer 지원이 안 된다고 하지만, Explorer 외에는 거의 지원이 되는 것 같다. Explorer는 MS에서도 지원을 종료.. 2021. 4. 8.
[JavaScript] splice()와 slice() splice() 배열의 기존 요소를 삭제 또는 교체, 새 요소를 추가해 기존 배열의 내용을 변경한다. developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/splice Array.prototype.splice() - JavaScript | MDN Array.prototype.splice() splice() 메서드는 배열의 기존 요소를 삭제 또는 교체하거나 새 요소를 추가하여 배열의 내용을 변경합니다. The source for this interactive example is stored in a GitHub repository. If you'd like developer.mozilla.org slice() 배열을 복사해 .. 2021. 3. 23.
[자료구조] 트리(Tree) 노드(Node)와 브랜치(Branch)를 이용해 사이클을 이루지 않도록 구성한 자료구조 선형 구조(순차적 구성)인 큐, 스택 등과 달리 트리는 비선형 구조이다.(계층적으로 구성) 주로 이진 트리(Binary Tree) 형태로 탐색(검색) 알고리즘 구현에 많이 사용된다. 이진 트리: 노드의 최대 브랜치가 2인 트리. 즉, 자식 노드가 최대 2개인 트리 노드(Node): 트리에서 데이터를 저장하는 기본 요소(데이터 + 연결된 노드에 대한 브랜치 정보) 루트 노드(Root Node): 트리에서 가장 위에 있는 노드 레벨(Level): 루트 노드를 기준으로, 하위에 연결된 노드의 깊이 부모 노드(Parent Node): 어떤 노드의 상위 레벨에 연결된 노드 자식 노드(Child Node): 어떤 노드의 다음 레.. 2021. 3. 5.
[자료구조] 해시 테이블(Hash Table) 키(Key)에 데이터(Value)를 저장해, 키 값으로 데이터에 직접 접근이 가능한 자료구조 보통 해시 테이블 크기만큼 배열을 생성해 사용한다. Python의 Dictionary가 해시 테이블에 해당한다. 해시(Hash): 임의의 값을 고정 길이로 변환하는 것 해싱 함수(Hashing Function): 산술 연산으로 키를 연산해 데이터의 위치를 찾을 수 있는 함수 해시 값(Hash Value) / 해시 주소(Hash Address): 데이터가 저장된 위치(주소) 슬롯(Slot): 한 개의 데이터를 저장할 수 있는 공간 해시 테이블의 장단점과 주요 용도 장점: 키를 이용해 데이터를 바로 꺼낼 수 있기 때문에 데이터 저장/읽기 속도가 빠르다. 키에 대응하는 데이터가 저장돼 있는지 바로 확인할 수 있기 때문.. 2021. 3. 4.