s e o p p o r t . l o g

전체 글 93

2024.01.11 TIL

CSS 1. css할때마다 궁금했던 것이 있는데, 높이 값이 없는데 어떻게 높이를 차지하고 있는지였다. 그래서 팀원분께 여쭤보았다 -> css 높이 값을 주지 않아도 자식들이 자리를 차지 하고 있고, 그 값들의 패딩, 마진값에 따라서 높이가 자동으로 결정되기 때문에 높이값을 따로 주지않아도 높이가 설정되는 것이었다. 2. flex로 구성한 박스는 웹사이트 크기를 줄이면 자식 요소가 저절로 줄어든다. 그런데 내가 의도한 썸네일 div는 줄어들면 안되기 때문에 어떻게 해야하나 고민했다. 정답은 flex-shirink를 0으로 설정하는 것이었다. flex-shrink: 0;를 추가하면 해당 요소가 부모 컨테이너의 크기를 줄일 때 축소되지 않도록 강제한다. 이렇게 하면 thumb-box-in-list가 강제로 ..

Today I Learned 2024.01.11

2024.01.09 TIL

동적으로 만들어낸 요소 제어하기 브라우저 콘솔에서는 나오지만 vscode에서 입력하면 Cannot read properties of null 뜬다 -> 동적으로 추가한 요소이기 때문에 스크립트가 읽어들이지 못한다. 이벤트리스너로 클릭했을 때 어디서 이벤트가 발생했는지 알아와서 event.target으로 요소를 제어할 수 있다. document.addEventListener('click', function (e) { let ratingValue; target = e.target; if(target.id === "rating"){// 타겟의 아이디값이 rating인 경우 alert(ratingValue); //평점 alert .json() 함수 개인과제 해설 영상을 보고 데이터를 받아올때 아예 영화데이터들만..

Today I Learned 2024.01.09

개인프로젝트 [MovieFinder] 회고

Movie Finder seopport.github.io 오늘 2차 제출을 마지막으로 개인프로젝트 과제가 끝났다. 강의도 다 못 듣고 시작해서 마감기한까지 끝낼 수나 있을까 걱정했는데 다행히 필수요구사항을 모두 구현하였고 선택요구사항도 대부분 구현하였다. 개인프로젝트를 하면서 느낀건 아직 프로그래밍적인 사고가 부족한 것 같다고 느꼈다. 특히 API로 값을 받아온 데이터를 다루면서 console.log()만 거짓말 안하고 백 번 넘게 찍어본 것 같다. ㅋㅋ 메서드나 비동기 함수 등등 배워야할 것이 정말 많은 것 같다. 전에 구글링을 하다가 본 댓글인데, '최고의 주석은 변수과 함수명이다' 라는 말을 보고 감명 깊어서 이번 프로젝트하면서 변수명과 함수명을 잘 지으려고 노력했다. (오늘 배운 용어로 말하자면 ..

Projects 2024.01.09