팀프로젝트

Scroll 이벤트 대신 Intersection Observer API 이용하자!

📅 본 글은 2022년 7월 23일 개인 github에 작성된 글입니다. 🚀 Scroll 이벤트 대신 Intersection Observer API 이용하자! 3차 프로젝트 리팩토링! 🖱 Scroll 이벤트를 활용한 무한 스크롤! 전체 일기 보여주는 페이지를 커서 기반 무한 스크롤로 구현하였는데, 이때 window 객체에 scroll 이벤트를 연결하여 특정 지점에 스크롤이 되었을 때, 서버에 다음 일기 리스트를 요청하고 이때 파라미터에 cursor 값을 보내는 형식으로 하였다! // handleScroll.js export const handleScroll = () => { const scrollHeight = document.documentElement.scrollHeight; const scrollT..

💡 axios await/async vs then

📅 본 글은 2022년 5월 13일 개인 github 에 작성된 글입니다. 🚀 axios await / async vs then 프로젝트 배포 당일 밤을 꼬박 새우고 아침에 급하게 기능을 추가해야하는 일이 생겼다. 프론트에서는 내가 맡아서 하게 되었는데, 간단한 기능이여서 빨리 끝낼 수 있다는 내 예상과 달리,백 연결에서 문제가 생겼다. axios 를 이용해서 get 요청을 했는데, data를 가져오지 못했다..😵‍💫 처음에는 axios 문제인지 모르고 다른 부분에 문제인건가 하는 생각이 들어 이리저리 고쳐보다, 왜 이럴까...한참 고민하다 그냥 then 을 이용하니 data 를 가져올 수 있었다...거의 1시간 동안의 삽질이였다... 문제의 코드..🥲 const [commentList, setComme..

💡 평소대로 e.target.value를 이용했는데, 요소값을 가져오지 못한다..? - 팀 프로젝트

📅 본 글은 2022년 5월 12일 개인github 에 작성된 글입니다. 🚀 currentTarget vs target 2차 팀프로젝트에서 발생한 문제점이다...!! 평소처럼 e.target.value 를 이용해서 클릭한 요소를 가져올려고 했으나, undefined 이 출력되었다. 다행히 구글링을 통해서 알아낸 e.currentTarget.value 를 사용하니 문제는 해결되었다. 그럼 event target 와 currentTarget 차이점은 무엇일까..? ✅ event.target vs event.currentTarget 블로그에 기재되었는 코드를 먼저 실행해보자. (출처 아래에 기재) 위의 코드를 실행하고, yellow을 클릭하였때 결과는 아래와 같이 나온다. green 이라는 className ..