코드의 바다에서 항해하기

  • 홈
  • 태그
  • 방명록

invalidateQueries 1

TanStack Query로 좋아요 상태 동기화하기: Query Key 설계부터 에러 처리까지

들어가며이번에 진행하고 있는 개인 프로젝트인 전시 공연을 한눈에 볼 수 있는 플랫폼에서 '좋아요 기능'을 구현하면서 마주한 문제들과 해결 과정을 공유합니다. 단순해 보이는 좋아요 기능이지만, 실제로는 상태 동기화, 에러 처리, 캐시 관리 등 고려할 것이 많았습니다.1. 요구사항 정리구현해야 할 기능: 좋아요 추가/취소 실시간 좋아요 상태 확인 (하트 버튼) 비로그인 사용자 처리 중복 추가 방지 여러 페이지에서 상태 동기화 (상세 페이지 ↔ 좋아요 목록)기술 스택: Next.js 16 (App Router), TanStack Query, TypeScript2. 왜 TanStack Query를 선택했는가?고민했던 방법들1) useState + useEffect 조합?useEffect(() => {fetch(..

Study/Next.js 2025.12.30
이전
1
다음
더보기
프로필사진

코드의 바다에서 항해하기

개발을 통해 새로운 세계를 탐험합니다

  • 분류 전체보기 (15)
    • Study (12)
      • HTML (3)
      • CSS (2)
      • JavaScript (2)
      • React (0)
      • Next.js (3)
      • Django (0)
      • Python (0)
      • 코딩테스트 (0)
      • 프로젝트 회고 (2)
    • Extracurricular activity (0)
      • 코딩교육봉사 (0)
      • 멋쟁이사자처럼 (0)
      • 멋쟁이사자처럼 플러스 (0)
    • 컨퍼런스 (1)

Tag

멋쟁이사자처럼, 그리디 문제, 멋쟁이사자처럼프론트엔드스쿨2기, node.js, invalidateQueries, 인프콘2024, 개발컨퍼런스, 체육복 문제, NextJS #React #Suspense #Toast #Troubleshooting, javascript, 프로그래머스_체육복, TanStackQuery, 인프콘, 프론트엔드개발공부, 프로그래머스 그리디, Next.js #Suspense, bfcache #javascript #뒤로돌아오기, 멋쟁이사자처럼FE, 멋쟁이사자처럼 FE 2기, HTML,

최근글과 인기글

  • 최근글
  • 인기글

최근댓글

공지사항

페이스북 트위터 플러그인

  • Facebook
  • Twitter

Archives

Calendar

«   2026/02   »
일 월 화 수 목 금 토
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28

방문자수Total

  • Today :
  • Yesterday :

Copyright © AXZ Corp. All rights reserved.

티스토리툴바