그냥 블로그

Event 위임구글 메인 페이지에서 내가 등록해놓은 Icon을 클릭하는 이벤트가 발생한다고 가정할 때, EventHandler를 어떻게 붙여주고, 발생시켜야 할까?  내가 선택하고 싶은건 notion 이지만 실제로 html은 다음과 같이 생겼기 때문에, querySelector('.tiles').addEventListner 형식으로는 불가능 하다. ( 심지어 이런식으로 하면 맨 상단에 하나만 붙는다 ) 모든 tile 요소는 동일하게 클릭 이벤트 발생 시 링크로 보내져야 할텐데... (사실, 저거는 a 요소로 써서 eventHandler를 직접 붙여줄 필요는 없지만 가정이다!!!! ㅎ)  querySelectorAll를 써서 반복문으로 일일이 붙여주거나....const cardAll = document.q..

정리해보기 Semantic Tag포함된 콘텐츠의 특정 의미를 정의하고, 목적을 갖는 태그다. 기존 HTML 태그 기능과 마찬가지로 block element이면서 사이트 구조(레이아웃)를 설계하기 위해 존재한다.     태그에 의미를 부여해 구조를 파악하기 쉽게 함. 이전에는 구조 구분을 위해 태그에 id나 클래스 등으로 구조를 설계했으나, HTML5에서는 시맨틱 태그의 등장으로 좀 더 명시적이며 직관적인 구조 설계가 가능해졌다  메인 홈이랑 기사 페이지에 작성되어 있는 시맨틱 구성? 이 좀 다르다고 느꼈다. 메인 홈은 section으로 header, main, aside 전부 분리되어 있었는 반면에 기사 페이지에는 section은 없었고 그냥 div로 되어 있는 부분이 많았음. 상위 요소에서 뭔..

이 글은 단지 프로젝트를 하면서 봤던 내용과 생각을 정리한 글입니다 : ) 전문가는 아니기 때문에 오류가 있을 수 있고, 저 또한 확실하게 알고 있지 못한 상황이기도 합니다. 혹시, 더 알고 있는 내용이 있다면 코멘트 남겨주시면 감사하겠습니다 !!   이번 프로젝트는 기존에 안써봤던 다양한 기술 스택을 써보고 싶었다. 사실 이런 기준으로 선택하면 안될 것 같지만, 한번 써보자 싶었기에 공고에서 많이 보이는 유명한 기술 스택들을 써보고자 했다.  그렇게 선택한게 1) Next.js : CSR과 SSR을 제대로 경험해 보기2) Recoil, React Query : 기존 Redux의 Boiler plate 단점을 극복하기 위한 기술 스택으로 많이 언급되고 많은 곳에서 사용됨. 3) TypeScript : J..

React Query가 좋은 이유 중 하나가 cache 기능일 것이다 ㅎㅎ .이걸 이용해서 redux 같은 전역 상태 관리 라이브러리를 쓰지 않고 React-Query 만으로도 관리할 수 있기도 한 것이다!!  React-Qury는 이 캐싱 기능을 다루기 위해 stale, cahcetime, refresh 등의 option을 제공한다. stale 상태 "탁한", "신선하지 않은" 이란 뜻으로, 업데이트가 필요한 상태이다. react-query는 쿼리가 stale 할 때, 다음과 같은 상황에서 해당 쿼리를 fetch한다. 새로운 인스턴스가 마운트 될 때브라우저 화면이 다시 focus 될 때네트워크가 재연결됐을 때트결히 설정한 refeetch interval이 있을 때 staleTime 쿼리를 fetch한 ..

1. Back-End (JavaSpringBoot) table column 여기서 user_id, email, name, birth_date, phone_number, 대표 계좌를 보내는 API를 만들거다. Domain  이미 사용되고 있는 Entity 이기 때문에 기존에 작성되어 있던 UserDomain을 사용한다 '-^b Repository userId로 정보를 받아오는 findI()를 작성한다.  @Query(value = "select * from user where user_id = ?1", nativeQuery = true) User find(String userId);  Dto userDto 변경없이 사용 ~.~ Service 추가 uerId로 user정보를 찾기. findById..

https://www.acmicpc.net/problem/23326 본론부터 말하면 실패했다. ( 인터넷 참고 ) 분류 : 자료 구조, 이분 탐색, 트리를 사용한 집합과 맵  제한 : 1초, 1024MB  [생각했던거]솔직히, 문제를 보고 어떻게 풀어야할지 감이 잘 안왔다. 억지로 큐를 만들어서 Before, after 나눠두고 계속 옮기는 식으로 진행하려 했는데, 이렇게 되면, after 큐에서 before 큐로 옮긴 뒤에 한 바퀴 돌면 before에서 다시 해줘야 하는데 그거 옮기는 과정이 번거로워졌다. 그래서 풀지는 못하고 인터넷 서칭 했음.      [설명]우선, set을 사용해서 푸는 문제였다. 분류에 이분탐색이 나와있는데,  C++ 에서 set은BST 기반으로 중위 순회로 동작하여 정렬과 탐색..