오늘 공부 계획 및 공부한 내용📝
- 팀프로젝트 마무리, 리팩토링 ㅇ
문제🧐 / 해결과정⚒️
- git 오류
완성된 팀플 Master 브랜치를 pull 해오기 직전! 내 로컬에서 commit을 했더니
git pull origin master을 입력했을 때 아래와 같은 오류가 발생했다..
📌 작업하던 브랜치에서 그냥 커밋만 하고 바로 Master 브랜치를 pull을 했더니 충돌이 일어난 것..!
git reset --soft HEAD^ 명령어로
이전에 했던 commit과 add를 다 삭제해주고
git pull origin master를 해줬더니 정상적으로 pull을 받아올 수 있었다;)
결론: git은 무서우니까 귀찮고 귀찮아도... 정상적인 루틴을 밟기로^^
2) 리팩토링 하면서 파일 분리하고window.location.href 경로를 다시 설정했는데
intro화면에서 메인페이지로 이동이 안됨.
그냥 index.html도 써보고 /Home/index.html도 써보고
../Home/index.html도 써봤지만 이동이 안됨....
📌 알고보니 애드이벤트를 실행해줄 위치를 quarySelector로 지정해줬는데
해당 클래스 이름을 리팩토링하면서 바꿔줬는데 여기 script태그에서는 바꿔주지 않았다는 것..🫠
이걸로 조원들과 이리저리 몇 번을 시도하고 고민했건만... 이유를 알고 모두가 탄식의 한숨을.. ㅇㅏㅏㅎ
2-1) 또 페이지 로드가 안됨 ---> 단순히 파일 경로 설정에 미스가 있었음
처음 경로 : index.html
수정 경로 : Home/index.html
현재 파일인 intro.html과 이동할 경로인 index.html파일은 다른 파일에 있기 때문에
거점 폴더인 Home을 앞에 써줘야 한다!
결론: 쉽고 간단할수록 더 가까운 곳에서 놓칠 수 있다 ^^ 보고 또 보자
3) 영화마다 다른 댓글 리스트를 붙여줘야 하는데 페이지마다 동일한 댓글 리스트가 떴다 ㅎ
URLSearchParams 객체 사용해서 원하는 정보 가져오기
📌 특정 영화에 대한 댓글 리스트라고 지정해주지 않아 로컬스토리지에 저장된 모든 데이터가 불려왔던 것 같다.
URLSearchParams 객체의 get메소드를 사용해 id key값에 대한 value값을 id라는 변수에 담고, 그 변수 id와 comment.id가 동일한 것끼리 map함수로 댓글 리스트를 정렬하게 해줬다.
🤔 Query String에 담긴 정보를 파싱할 수 있도록 URLSearchParams 객체를 사용한다는 건 알겠는데 Query String의 특정 키(Key)값의 이름을 어떻게 알지??? (get메소드 안에 들어가는 저거!가 뭔지 어떻게 아는가)
map함수란?
: 배열 내 요소 각각에 대하여 주어진 함수를 호출한 결과를 모아 새로운 배열을 반환하는 함수
(=배열을 새로운 배열로 만들어줌)
Array.prototype.map()
느낀점✨
- 리팩토링을 하면서 불필요한 코드나 콘솔 코드, 주석 코드를 지우니 코드가 훨씬 정돈되고 깔끔했다!!! 혼자 할 때는 리팩토링의 필요성을 크게 못 느꼈는데.. 5명이 붙어서 코드를 짜니 파일도 많아지고 코드도 엄청 길어졌다. 파일을 다 나눴음에도 이 파일, 저 파일 들쑤시고 다니고 ㅎㅎ 파일 안에서도 해당 코드를 찾느라 눈이 빠질 것 같았다 🥹 검색 기능이 있어도 어쩐지 그냥 곧 찾을 수 있을 것 같다는 생각에(나만 그래?ㅎ) 검색이 아닌 아이 스캐닝을 계속 쓰고 있던 우리들 ,,,ㅋㅋㅋ 그리고 최종 점검은 검색으로 후딱 끝내버렸다.
필요 없는 코드들도 지우고 애매하고 모호한 태그들 이름까지 수정해주니 확실히 가시적이고 읽기 쉬워졌다. 물론 중간중간 css를 넘나들며 클래스 이름도 수정해주고 경로 설정도 다시 해주면서 기능이 안 먹혀 심장이 덜컹도 했지만ㅎ 그 모든 과정을 끝내고 나니 너어무 뿌듯했다ㅎㅎㅎ 이래서 리팩토링을 하는군...!!👏🏻 리팩토링을 먼저 하자고 제안해준 팀원에게 👏🏻 앞으로 또 다른 팀플이나 개인 과제를 할 때도 리팩토링을 꼭 챙기자..!
