본문 바로가기

반응형

분류 전체보기

(399)
자바스크립트에서 사용되는 주요 배열 메서드의 시간복잡도에 대해서 알아보자? [배경] 자료구조에 대해 공부하다보니 자료구조에 대해 공부하다보니 갑자기 궁금해진 것이 하나 있다. 이 때 까지 당연하게 사용하던 배열 메서드들의 시간복잡도는 어떻게 될까? 내부적인 구현은 숨겨져 있으니 일일이 계산할 수는 없더라도 눈에 보이는 동작만 봤을 때 해당 메서드들이 어떤 시간복잡도를 가지는지 알아보면 재밌을 것 같아서 해당 포스트를 작성해본다. [기초 개념] 시간복잡도에 대한 개념 시간복잡도는 알고리즘이 문제를 푸는데 걸리는 시간을 의미한다. 여기서 시간이란 실제 시간을 의미하기 보다는 연산의 크기를 측정한 값이라고 이해하면 된다. 예를 들어 아주 전통적인 for 문을 사용하여 배열을 순회한다고 가정할 때, 이 때 배열의 길이인 n 이 증가할 때 마다 순회 하는데 필요한 연산의 횟수도 증가하게..
프로젝트 sitemap.xml 을 찾을 수 없다는 문제를 해결하고.. 이전 포스트 배포 사이트 색인이 왜 1 개만 생길까요? 문제의 발단 제가 사이트를 배포할 때 NextJS 에서는 동적으로 사이트맵을 생성하는 기능을 지원해주기에 이를 이용해서 사이트맵도 색인 요청을 Google Search Console 을 사용해서 신청했었습니다. duklook.tistory.com 조금 만 더 기다려 봐야 겠습니다. 며칠 동안 sitemap.xml 을 사이트를 통해 조회를 하면 찾을 수 없다는 문제가 계속 발생하였습니다. 원인은 제가 사이트를 재배포할 때 sitemap.xml 을 생성하는 과정에서 실제 사이트가 닫혀 있는 상태라서 문제가 발생하였기에, 잠시 sitemap-temp.xml 이라는 이름으로 변경해둔 것이 화근이었습니다. 해당 문제는 바로 수정할 수 있는 사항이므로 이를 수..
git 명령어를 모아두는 아카이브 이 포스트는.. 해당 포스트는 자주 사용되는 git 명령어와 그 예시를 저장해두는 용도로 활용하는 포스트 입니다. 기타 문서에 정리해둔 내용을 옮기거나, 새롭게 알게된 지식을 쌓아가며 추후 활용하기 쉽도록 목록화시키기 위한 목적으로 사용됩니다. 매번 새로운 내용으로 갱신될 때 마다 그 날짜를 기준으로 포스트가 갱신됩니다. 최근 커밋 취소 git reset --soft HEAD~1 최신 커밋을 취소하고 변경 사항을 스테이징 영역에 유지합니다. 변경 사항은 커밋되지 않은 채로 남아 있습니다. git reset --soft HEAD~1 git reset --mixed HEAD~1 (기본 옵션) 최신 커밋을 취소하고 변경 사항을 스테이징 영역에 제거합니다. 변경 사항은 작업 디렉토리에 유지됩니다. git res..
[NextJS] 서버 컴포넌트에서는 어떻게 쿼리 파라미터를 읽을 수 있을까요? 포스트를 작성하게 된 배경 이번에 진행중인 개인 프로젝트인 명언 웹 사이트에서 사용자가 등록된 명언 카드와 관리자가 등록한 명언 카드 간에 쿼리 파라미터를 사용해서 구분 후 서로 다른 로직을 처리해야 하는 일이 생겼습니다. 그런데, 클라이언트 컴포넌트에서는 useSearchParams 라는 리액트 훅을 사용하여 쿼리파라미터를 읽어오거나, window의 location 객체의 searchparams 를 사용하면 간단하게 처리할 수 있는데, 서버 컴포넌트에서는 이 훅들의 사용이 불가능 합니다. 따라서 이번 기회에 서버 컴포넌트에서 쿼리 파라미터를 읽는 방법을 정리하면서, 프로젝트에 적용해볼까 합니다. 바로 본론으로, 공식문서에 답이 있습니다(단, NextJS 13.0 이상에서만 가능). 블로그 글 보다는 공..
[자료구조] 이중연결리스트 remove 함수(메서드) 만들기 들어가기 전 이제 이중연결리스트의 remove 함수 구현에 대한 부분까지 도전하는 시기가 되었다. 사람들은 연결리스트가 쉬운 자료구조라고 하는 것 같은데, 내가 보기에는 참조 관계를 이어주고 끊어주는 것 부터, 리스트의 특정 위치에 노드를 추가함으로써 생기는 여러 문제들을 해결하는게 그리 쉬운 것 같지는 않다. 계속 뜯어보고, 원리를 생각하며 공부해보니 조금씩 해당 자료구조의 필요성과 이점, 단점 등이 보이기 시작하고 있는데, 이것이 구현 능력으로 이어지기 위해서는 꾸준히 노력해야 함을 인지하고 들어가 본다. 이중 연결리스트에서 노드를 제거하려면? 이중 연결리스트에서 노드를 제거하는 방법은 첫 번째 노드를 제거하거나, 마지막 노드를 제거하거나, 아니면 중간에 있는 노드를 제거하는 등 응용에 따라서 다양하..
바닐라 JS/HTML/CSS 로 재미있는 애니메이션 구현하기(0탄) 광원 마우스호버란?사실 그냥 마우스호버 애니메이션이라 하면 멋 없어보이니까 광원이라는 단어를 붙여서 만들어 보았습니다. hover 시 특정 애니메이션(빛의 퍼짐을 표현한 애니메이션)이 마우스 포인터를 따라서 움직이는 아주 간단한 애니메이션 입니다. 다만 해당 마우스 포인터가 활성화되는 지점이 카드 내부라는 점에서 일반적인 포인터를 이용한 애니메이션과 차이가 있습니다. 실제로 구현 해보시면, 요소의 중앙으로 갈수록 빛이 줄어들었다가 외곽으로 가면 커지는 것을 볼 수 있습니다.  해당 애니메이션의 원조?는 유튜브에 보면 재밌는 효과들을 구현하시는 외국 개발자분의 유튜브를 참고해서 만들어졌습니다. 흥미롭고, 고난이도의 효과들도 많으니 유튜브 많이 애용하시면 좋을 것 같아요. 그럼 시작하겠습니다. 필요한 준비물..
배포 사이트 색인이 왜 1 개만 생길까요? 문제의 발단 제가 사이트를 배포할 때 NextJS 에서는 동적으로 사이트맵을 생성하는 기능을 지원해주기에 이를 이용해서 사이트맵도 색인 요청을 Google Search Console 을 사용해서 신청했었습니다. 그런데, 아무리 시간이 지나도 구글 검색에 나타나지 않아서 이게 무슨 일이지 싶어서 콘솔에 접속해서 확인해보니, 발견된 페이지는 1,878 개로 정상적으로 식별은 되었는데, 문제는 URL 이 인식은 되지만, 색인이 꼴랑 루트 페이지 하나만 색인이 생성되어 있는 겁니다. 도대체 이게 무슨 일인가 싶지만, 차근차근 해당 문제를 해결해보도록 하겠습니다. 참고로 직접 하나하나 해결하면서 작성하는 것이라 갑자기 글이 끊어질 수도 있습니다. 바로 해결이 되면 짧게, 아니면 길게 작성이 될 수 있어요. 무엇이..
[자료구조] 이중 연결 리스트, Add 함수 구현까지 이중연결리스트? 어감에서 알 수 있듯이 이중으로 참조 포인터가 연결되어 있는 노드를 가지는 리스트를 의미한다. 따라서 각 노드들은 값과 함께 이전 노드에 대한 참조와 다음 노드에 대한 참조를 가지며, 이러한 특징으로 인해 정방향과 역방향 모두에서 순회할 수 있다. 이런 점에서 보면 단일 연결리스트에 비해 참조 포인터를 하나 더 가짐으로써 메모리 공간을 더 사용한다는 단점이 있지만, 그것보다 이득이 더 커보이는 것 같다. 이중 연결리스트 이전에는.. 이중연결 리스트 이전에 단일 연결리스트가 있다. 단일 연결리스트를 구현해보면서 느꼈던 큰 단점은 횡단으로만 이동이 가능하여 검색이나 식제 등의 기능에 있어서 유연성이 많이 부족하다는 점이었다. 반면에, 이중 연결리스트의 경우에는 이전 노드에 대한 참조와 다음 ..

반응형