💼 오늘 작업 내용

1. [세모체] 체크리스트 엔티티 분해 작업

세모체 Checklist table 분해

checklist → basic info / progress info / stats info로 분해

⇒ 잘못된 modifiedDate update를 막기 위함. #Record

⇒ basic info가 변경되었을 때 modifiedDate가 변경되어야 하는데 Spring의 @LastModifiedDate 라는 속성으로 인해 다른 종류의 info가 변경되었을때도 같이 변경됨.

2. [NearTue] Chrome Extension 개발 작업

youtube 상위 비디오를 수집하는 chrome extension 개발 및 테스트를 진행함.

html 코드에서 css Selector를 통해서 해당 video-id를 가져오는 작업을 함.

하지만 “m.youtube.com” & “youtube.com” 모바일과 데스크탑 버젼의 html 코드가 달라서 따로 만드는 작업을 하느라 시간이 꽤 걸림.

⚠️ 에러 핸들링

1. Html css selector

웹 상에서 개발자 도구에서 콘솔 창에서 진행하는 css selector가 제대로 동작하지 않는다는 문제점이 발생했다.

특정 원소의 자식을 css selector를 통해서 가져오려고 해도 null 값으로 나옴.

const video = document.querySelector("#contents ytd-rich-item-renderer")
result = video.querySelector("#video-title")

해당 코드의 result가 null로 나온다는 문제가 발생함.

따라서 해당 코드가 문법적으로 잘못된 줄 알고 여러 방법을 찾다가 결국 해당 문법이 옳고 개발자 도구 콘솔 창 자체의 문제점이라는 것을 확인함.

⇒ javascript에서 해당 코드를 입력하면 제대로 자식 원소가 리턴됨.

• 왜 콘솔 창에서 이렇게 하면 안 나오는지 파악은 안됨
• 또한 특정 원소 이전에 있는 모든 자식 원소를 get하려고 했는데, 해당 구조를 짜기가 생각보다 빡세다.

깨달은 점

1. css selector를 통해서 특정 원소를 가져오는 것이 생각보다 복잡하다.
2. @LastModifiedDate 를 통해서 date를 update할 때 변경되면 안될때 변경되지 않는지 확인이 필요함.

📝 투두리스트

• [세모체] entity 삭제 시 무결성 제약 조건 유지하도록 로직 작성
• 네이버 코테 준비
• Flutter 공부
• chrome extension 관련해서 내용 정리하기 #Record