준영이의 성장일기(FrontEnd)

https://jerryjerryjerry.tistory.com/159 [JavaScript] 자바스크립트 map()과 flatMap()의 차이점자바스크립트에서 map()과 flatMap()은 주어진 배열의 요소를 사용해서 새로운 배열로 변환하는 작업을 수행하는 함수들이다. 둘 다 배열의 요소를 사용하고 새로운 배열로 바꿔준다는 공통점은 있jerryjerryjerry.tistory.com   저번 블로그의 내용은 다음과 같았다. https://no2jfamily.tistory.com/113 tanstack-query를 활용 한 캘린더 일정 데이터 조회이번 스터디 플래너 프로젝트에서는 tanstack-query 기반으로 개발을 진행 중이다. 현재 캘린더(달력) 페이지 API 연동 과정을 진행 중이며 어제(..

이번 스터디 플래너 프로젝트에서는 tanstack-query 기반으로 개발을 진행 중이다. 현재 캘린더(달력) 페이지 API 연동 과정을 진행 중이며 어제(12월 9일) 해당 달에 존재하는 일정들을 조회하는 API 연동을 진행하였다.  백엔드 팀원들이 작성해준 API 명세서에 따라 작성한 API 호출 로직은 다음과 같다. import axios from 'axios'const fetchCalendarEvent = async (year, month) => { try { const response = await axios.get(`/api/calendar/get_calendar`, { params: { year, month, }, }) return..

현재 진행하고 있는 스터디플래너 프로젝트에서 교재를 추가할 수 있는 LibraryAddModal.jsx가 존재한다. 해당 컴포넌트에서 교재의 이름을 입력할 때 중복이 되는지를 검사하는 API 연동을 통해 교재의 이름이 중복되는지 판단한다. 해당 기능을 구현하는 과정에서 useDeferredValue 훅을 사용하였다. 해당 성능 최적화 훅은 이전에 리액트 공식문서를 기반으로 정리한 적이 있다. https://no2jfamily.tistory.com/101 React 공식문서 도장깨기(9) - useDeferredValue9월 11일에 정리하는 공식문서 주제는 useDeferredValue이다. useTransition과 동일선상에 있는 개념이다. https://react-ko.dev/refe..

이번 블로그 주제는 자바스크립트의 이벤트 버블링/캡처링과 연결되는 이벤트 위임 개념이다.  버블링/캡처링 개념에 대해서는 저번에 작성한 블로그를 참고해주세요! https://no2jfamily.tistory.com/110 Javascript - 이벤트 버블링/캡처링첫 기업 과제테스트를 하면서 중요성을 느낀 바닐라 JS의 주요개념 이벤트 버블링/캡처링에 대해서 정리하고자 한다 ㅎㅎ 오랜만에 작성하는 블로그 인 만큼 재미있게 정리해보자. 물론 과제 테no2jfamily.tistory.com  https://ko.javascript.info/event-delegation 이벤트 위임 ko.javascript.info  개념: 이벤트 위임은 공통 부모가 있는 자식 요소가 있는 경우 이벤트 헨들러를 공통 부모요소..