2024. 4. 30 개인과제 그로스

 

 

완성한 코드를 제출하고, 피드백을 받아 살짝 수정하였다.

 

- 검색 기능에서 item class 를 이용하여 요소를 가져온 이후 요소를 순회하면서 filter를 하고있을때, id 를 갖고 document.getElementById(id) 하고게신데, 이미 순회하고 있는 familyTitle자체가 document.getElementById(id)로 가져온 결과와 같은 요소이기때문에 document.getElementById(id)를 하는건 불필요한 행위입니다. familyTitle[i].style.display = 'block'; 이렇게만하셔도 됩니다.

 

수정전

if (rows.includes(filterValue)) {          document.getElementById(id).style.display = 'block';                 } else {         document.getElementById(id).style.display = 'none';       }     }

 

수정후

if (rows.includes(filterValue)) {         familyTitle[i].style.display = 'block';                 } else {         familyTitle[i].style.display = 'none';       }     }

 

전체적으로도 많이 부족하긴 하지만  아직 이런 디테일?? 함이 많이 부족한 것 같다.

 

아마 반드시 필요한 것과 불필요한 것들이 구분이 안 가서 그런 것 같다.

 

 

 

API 데이터에 변수를 지정했을 때, 데이터의 띄어쓰기 전까지를 ID 로 지정하는 성질 때문에

 

만약 띄어쓰기 전까지의 텍스트가 겹친다면 ( ex) The owl, The Chosen ) The 라는 ID 가 2개가 생성이 되어버려 

 

중복된 값 중 하위 ID 는 filterValue 에 포함되지 않아 검색 기능을 실행했을 시 display none 이 적용되지 않았었다

 

 

그래서 데이터를 불러올 때 문자열의 공백 부분을 하이픈 으로 바꿔주는 replace 를 사용하여 데이터를 가져왔는데

 

문제는 저렇게 화면 표기에도 하이픈이 보인다는 것이였다. 내가 의도한 결과가 아니기 때문에 해결을 하려고 했는데 결국 실패했었다.

 

- " "을 "-" 으로 변경할때 replace를 쓸경우 제일 첫번째의 " "만 변경됩니다. name의 모든 공백을 "-"으로 변경하려면 replaceAll을 사용하시면됩니다.

 

 

피드백을 받고 수정한 코드

 temp_html += `

   

     

        <li class="item" id=${movietitle} movie-id="${card_id}">

          <img src=${image} class="card-image">

          <div class="cont">

            <strong class="card-title">${doc['name']}</strong>

             // <strong class="card-title">${movietitle}</strong> 기존코드 //

            <p >${overview}</p>

            <p style="color: chartreuse;">grade : ${vote_average}</p>

          </div>

        </li>

        `;

 

id의 띄어쓰기 이후 부분이 적용이안돼서 " "를 "-" 로 변환해서 넣으신 아이디어는 매우 좋았습니다. 다만 id에만 "-"로 변경된 값을 넣고 실제 제목이 나오는 부분은 doc['name']을 사용하시면 좋을것 같습니다.

 

아주 간단하게 해결할 수 있는 문제였다. 너무 복잡하게 생각하려다 보니 직관적으로는 생각하기가 어려운?? 느낌도 있는 것 같아서 앞으로 문제를 직면했을 때는 다양한 시선으로 바라봐야 겠다는 생각이 들었다.

 

문법을 시작하기 전까지는 성장 속도가 체감이 되서 자신감이 넘쳤었는데, 문법 주차가 시작되고 나서는 조금 자신감이 떨어졌다.

그래서인지 이것, 저것 건드려보며 완성해 나가는 스타일인 내가 괜히 다 망쳐버릴까봐 망설이는 모습도 보였다.

사실 지금도 자신은 없지만, 피드백과 함께 튜터님이 달아주신 말씀에 힘을 많이 받았다.

 

물 한 모금 안 마시며 쫒기듯이 달리다가 내리막을 만난 느낌?

 

더뎌도 열심히만 하자.