디자인시스템(3)
-
[Next.js] middleware가 쿠키를 못 읽는 이유? Secure와 HTTPS의 함정
#Next.js #pN룰 #디자인시스템 #Middleware #HTTPS #MUI #BDS #Playwright #CSRF ✅ BDS + MUI 마이그레이션 중 겪은 middleware 디버깅 & 코드리뷰 회고현재 프로젝트는 Buzzle Design System (BDS)과 MUI를 기반으로 한 디자인 시스템 마이그레이션이 최우선 과제로 진행 중이다.이와 함께 접근 제어를 위한 middleware 설정과 인증 구조 개선이 병렬로 진행되고 있다.이번 주에는 matcher 설정 누락, Secure 쿠키 인식 불가, 그리고 500 에러까지 겪으며 학습 포인트가 많았던 한 주였다.✅ 우선순위: 디자인 시스템 마이그레이션React 기반 UI 컴포넌트를 BDS + MUI 조합으로 정리 중컴포넌트 일관성 확보 및 ..
2025.06.02 -
[Next.js] Cursor+MCP 테스트 자동화 / 307 리디렉션? HttpOnly 쿠키 기반 로그인 구조에서 리다이렉션 이슈 해결하기 #CSRF #HttpOnly #테스트자동화 #고도화
#Next.js #JWT #HttpOnly #CSRF #Frontend보안 #테스트자동화 #테스트고도화 그래서 오늘의 TIL(Today I Learned) 학습 키워드✨ HttpOnly 쿠키✨ CSRF 토큰 인증 흐름✨ 307 Redirect 이슈 처리✨ 테스트 자동화의 구조 설계 중요성✨ MCP Rule 생성 및 테스트 고도화 ✅ 문제 상황✅ 원인 분석✅ 해결 방법✅ 최종 정리✅ 오늘 배운 것과 느낀점 ✅ 문제 상황Next.js에서 로그인 후 /mypage로 이동하면 /login으로 계속 리디렉션되는 문제가 발생했습니다.콘솔에는 307 Temporary Redirect 응답이 뜨며, 로그인 상태임에도 인증되지 않은 것으로 처리되었습니다. ✅ 원인 분석백엔드 코드를 확인해보니, Acces..
2025.05.27 -
디자인 시스템, 마이그레이션도 자동화할 수 있다고요? #Cursor #MCP #디자인시스템
#기술블로그 #디자인시스템 #MCP #CursorAI #Playwright #BDS 그래서 오늘의 TIL(Today I Learned) 학습 키워드✨ MCP 기반 마이그레이션 자동화✨ 크롬 자동완성 대응 스타일링✨ 사용자 경험 중심 테스트 룰 정립✅ 문제 설명✅ 해결 방법✅ 발생한 문제와 방안✅ 최종적인 해결 방법✅ 오늘 배운 것과 느낀점✅ 최적화 및 자동화✅ 문제 설명기존 레거시 페이지(findpassword)에 BDS 디자인 시스템 + MUI 를 적용하는 마이그레이션을 진행했습니다.단순 스타일 적용이 아닌, 재사용성과 접근성까지 고려한 리팩토링을 목표로 했습니다. ✅ 해결 방법Cursor AI + MCP(Memory-Conscious Prompt) 2종 연동Input, Text, Stack 등을..
2025.05.26