분류 전체보기 (367) 썸네일형 리스트형 [자료구조] 이중연결리스트 remove 함수(메서드) 만들기 들어가기 전 이제 이중연결리스트의 remove 함수 구현에 대한 부분까지 도전하는 시기가 되었다. 사람들은 연결리스트가 쉬운 자료구조라고 하는 것 같은데, 내가 보기에는 참조 관계를 이어주고 끊어주는 것 부터, 리스트의 특정 위치에 노드를 추가함으로써 생기는 여러 문제들을 해결하는게 그리 쉬운 것 같지는 않다. 계속 뜯어보고, 원리를 생각하며 공부해보니 조금씩 해당 자료구조의 필요성과 이점, 단점 등이 보이기 시작하고 있는데, 이것이 구현 능력으로 이어지기 위해서는 꾸준히 노력해야 함을 인지하고 들어가 본다. 이중 연결리스트에서 노드를 제거하려면? 이중 연결리스트에서 노드를 제거하는 방법은 첫 번째 노드를 제거하거나, 마지막 노드를 제거하거나, 아니면 중간에 있는 노드를 제거하는 등 응용에 따라서 다양하.. 바닐라 JS/HTML/CSS 로 재미있는 애니메이션 구현하기(0탄) 광원 마우스호버란?사실 그냥 마우스호버 애니메이션이라 하면 멋 없어보이니까 광원이라는 단어를 붙여서 만들어 보았습니다. hover 시 특정 애니메이션(빛의 퍼짐을 표현한 애니메이션)이 마우스 포인터를 따라서 움직이는 아주 간단한 애니메이션 입니다. 다만 해당 마우스 포인터가 활성화되는 지점이 카드 내부라는 점에서 일반적인 포인터를 이용한 애니메이션과 차이가 있습니다. 실제로 구현 해보시면, 요소의 중앙으로 갈수록 빛이 줄어들었다가 외곽으로 가면 커지는 것을 볼 수 있습니다. 해당 애니메이션의 원조?는 유튜브에 보면 재밌는 효과들을 구현하시는 외국 개발자분의 유튜브를 참고해서 만들어졌습니다. 흥미롭고, 고난이도의 효과들도 많으니 유튜브 많이 애용하시면 좋을 것 같아요. 그럼 시작하겠습니다. 필요한 준비물.. 배포 사이트 색인이 왜 1 개만 생길까요? 문제의 발단 제가 사이트를 배포할 때 NextJS 에서는 동적으로 사이트맵을 생성하는 기능을 지원해주기에 이를 이용해서 사이트맵도 색인 요청을 Google Search Console 을 사용해서 신청했었습니다. 그런데, 아무리 시간이 지나도 구글 검색에 나타나지 않아서 이게 무슨 일이지 싶어서 콘솔에 접속해서 확인해보니, 발견된 페이지는 1,878 개로 정상적으로 식별은 되었는데, 문제는 URL 이 인식은 되지만, 색인이 꼴랑 루트 페이지 하나만 색인이 생성되어 있는 겁니다. 도대체 이게 무슨 일인가 싶지만, 차근차근 해당 문제를 해결해보도록 하겠습니다. 참고로 직접 하나하나 해결하면서 작성하는 것이라 갑자기 글이 끊어질 수도 있습니다. 바로 해결이 되면 짧게, 아니면 길게 작성이 될 수 있어요. 무엇이.. [자료구조] 이중 연결 리스트, Add 함수 구현까지 이중연결리스트? 어감에서 알 수 있듯이 이중으로 참조 포인터가 연결되어 있는 노드를 가지는 리스트를 의미한다. 따라서 각 노드들은 값과 함께 이전 노드에 대한 참조와 다음 노드에 대한 참조를 가지며, 이러한 특징으로 인해 정방향과 역방향 모두에서 순회할 수 있다. 이런 점에서 보면 단일 연결리스트에 비해 참조 포인터를 하나 더 가짐으로써 메모리 공간을 더 사용한다는 단점이 있지만, 그것보다 이득이 더 커보이는 것 같다. 이중 연결리스트 이전에는.. 이중연결 리스트 이전에 단일 연결리스트가 있다. 단일 연결리스트를 구현해보면서 느꼈던 큰 단점은 횡단으로만 이동이 가능하여 검색이나 식제 등의 기능에 있어서 유연성이 많이 부족하다는 점이었다. 반면에, 이중 연결리스트의 경우에는 이전 노드에 대한 참조와 다음 .. [HTML] SVG 가 SVG 로 불리는 이유와 렌더링 순서(작성중인 문서) 보호되어 있는 글입니다. 사용자가 비속어를 사용한다면, 그것을 어떻게 필터링할까요?(with NodeJS & GPT) 오늘의 명언 비속어 필터링이 없는 사이트 제가 개인 프로젝트인 명언 웹 사이트를 만들고 배포까지 했지만, 그리고 트래픽도 없지만, 이 부분은 꼭 필요하다고 방금 떠오른 부분이 있습니다. 그건 바로 비속어 필터링인데요. 사실 사이트 배포 후 운영을 생각하기 전에는 이 사실을 깊이 있게 고려하지 않았을 것 같은데, 실제 배포하고 운영한다고 가정하니까 여러 문제들이 사이트 내에 잔재하고 있다는 사실을 깨달아가고 있습니다. 그래서 이 문제를 해결하기 위해 추가적인 기능이 필요한 상황이라 이 부분을 추가하는 시간을 가져볼까 합니다. 필터링 하는 방법은 뭐가 있을까요? 나름 생각해본 방법들에는 정규표현식을 이용한 방법, 일반적인 배열에 키워드를 담아서 일치하는 여부에 따라 처리하는 방법이 있었고, 좀 비용이 들더라.. 프리티어 인데 왜 cloudWatch 에서 비용이 크게 나왔냐 했더니 ;; 쓴 것도 없는 것 같은데..EC2 에 프로젝트를 배포한 뒤에 cloudWatch 에서 며칠 되지도 않았는데도 비용이 크게 나오는 일이 생겼습니다. 프리티어 한도 내에서 얼마나 많은 로그를 수집한다고 혹시 오류가 아닐까 생각을 했지만.. 그건 아니었고 무료로 사용 가능한 모니터 리소스 한도를 초과해서 생긴 비용 증가였습니다. 아래 보시면 112 개의 리소스에 대한 모니터가 이루어지고 있다고 나와있죠? 지금 이 4월 6일 인데 4월 1일 부터 약 5일 동안 발생한 비용입니다.. 이게 한 달이 되었다면, 그 비용은 생각보다 크게 다가왔겠지요. "프리티어로 무료로 제공해주는 건 맞는데, 초과분은 내야지 안 그래?"이 부분에 대해서 더 알기 위해 자세하게 찾아보니 인터넷 모니터의 경우에는 초기 100개 까지만 .. gsap flip 을 이용한 인터렉티브 카드 스위칭 GSAP 에는 뒤짚는 녀석이 있습니다. GSAP 를 공부하면서 아주 아주 흥미로운 친구를 발견했습니다. 바로 Flip 이라는 친구인데요. 이 친구가 왜 흥미롭냐면 이름 그대로 판을 뒤짚기 때문입니다. 해당 기능은 사용해보지 않으면 알수가 없기에 오늘은 해당 녀석을 가지고 재밌는 기능을 하나 구현해볼까 합니다. 아마 해당 기능은 GSAP 를 자주 사용하셨다면, 튜토리얼 영상에서 한 번 보셨을 수도 있습니다. 모르셨다면, 이번에 알고 가셔서 보다 재밌는 인터렉티브한 웹 사이트를 만드는데 활용해보시면 좋을 것 같습니다. 보면 알기에 굳이 어떤 기능이다 설명하지 않겠습니다. 직접 따라해보시면서 느껴보시길 바랍니다. 우선 준비물을 챙겨오세요. 이 친구는 당연히 GSAP 이라는 라이브러리의 가족이므로 이들을 대여해.. 이전 1 ··· 8 9 10 11 12 13 14 ··· 46 다음
