🥞 오늘 한 일

• JavaScript 팀 과제
  • 실제 상세 페이지 하트에 토글 및 색 변경 기능 구현
  • 다른 로컬에서 찜 기능 안되는 문제 해결 (localStorage 설정 문제)
  • 찜 목록 페이지 html, css 수정
  • 찜 목록 페이지 찜한 영화 없을 경우 및 있을 경우 js

🍽️ 문제 해결

영화 찜하기 기능

문제

내 로컬에서는 잘 되는데, 다른 팀원분들이 내 브랜치에서 똑같은 기능을 해보려고 하면 오류가 나는 문제가 있었다.

가설

혹시 내가 이미 로컬 스토리지에 key가 있기 때문인가? 라는 가설을 세우고, hearts key를 지웠더니 나도 다른 팀원분들과 똑같이 오류가 났다.
바로 여기서 문제가 일어났던 것이다.

해결

내가 간과했던 점은, 나는 이미 로컬 스토리지에 hearts라는 key가 있었다.

let hearts = JSON.parse(localStorage.getItem("hearts"));

그래서 코드에서 이렇게 해당 key를 불러올 때, 아무런 이상이 없이 그대로 가져올 수 있었다.
그러나 다른 팀원분들의 로컬 스토리지에는 hearts 키가 없었기에, 가져오는 것 자체가 되지 않아 오류가 난 것이었다...!
때문에, 조건문으로 해당 키가 없을 경우에는 hearts key를 만들어주는 코드를 추가적으로 작성했다.

if (localStorage.getItem("hearts") === null){
  localStorage.setItem("hearts","[]");
}

이 코드를 작성해주니 일단 내 로컬에서 해결되었고, 팀원분께 확인을 부탁드렸는데 팀원분 로컬에서도 잘 작동했다. (서로 기쁨의 텍스트 환호를 질렀다...)
어제 해결한 문제도 그렇고, 확실히 별 거 아닌 곳에서 오류가 나는 경우가 많은 것 같다. 겁 먹지 말고 차근차근 해보자.

간단한 문제들

• 팀원분이 깃 브랜치 이동하는 방법을 잘 모르셔서, git fetch origin 한 다음 git switch 브랜치이름 으로 이동하는 방법을 알려드렸다.

🍳 내일 할 일

• JavaScript 팀 과제
  • 찜 목록 페이지 헤더 수정
• 알고리즘 코드카타