#MicroFrontend #SolidJS #NextJS #React #iframe통합 #디자인시스템✅ 목차 1. 오늘의 TIL 키워드 2. 문제 설명 3. 해결 방법 4. 발생한 문제와 방안 5. 최종적인 해결 방법 6. 최적화 방안💡 그래서 오늘의 TIL(Today I Learned) 학습 키워드✨ iframe도 Micro FE의 한 방법이다✨ 기술스택이 달라도 아키텍처로 연결할 수 있다✨ TanStack Router의 Outlet은 iframe과 궁합이 좋다✅ 문제 설명Solid.js+Emotion로 만든 포트폴리오, Next.js 기반 DB/관리자 페이지, React+Shadcn기반 LCAP 디자인시스템 라이브러리까지...모두 따로 돌아가는데, 이걸 어떻게 하나의 시스템으로 묶지? 라..

#React #Next.js #시맨틱태그 #Fragment #TypeScript ---📌 목차들어가며React.FC / NextPage를 쓰지 않는 이유Fragment를 쓸 때 주의할 점상위 Layout의 역할시맨틱 태그란?오늘의 TIL✅ 들어가며오늘은 React와 Next.js를 쓰면서 평소 고민하던 것들에 대해 정리해보았다.Fragment는 언제 써야 하고, React.FC 타입은 왜 점점 안 쓰는 분위기일까?프로젝트에 적용하며 마주한 구조적 이슈와 고민들을 공유해본다.✅ 1. React.FC / NextPage를 쓰지 않는 이유React.FC나 NextPage를 쓰면 children이 자동 포함되고, defaultProps나 propTypes가 암묵적으로 설정된다.이는 타입 명시성이 떨어지고, 제..

#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 조합으로 정리 중컴포넌트 일관성 확보 및 ..

#Next.js #JWT #HttpOnly #CSRF #Frontend보안 #테스트자동화 #테스트고도화 그래서 오늘의 TIL(Today I Learned) 학습 키워드✨ HttpOnly 쿠키✨ CSRF 토큰 인증 흐름✨ 307 Redirect 이슈 처리✨ 테스트 자동화의 구조 설계 중요성✨ MCP Rule 생성 및 테스트 고도화 ✅ 문제 상황✅ 원인 분석✅ 해결 방법✅ 최종 정리✅ 오늘 배운 것과 느낀점 ✅ 문제 상황Next.js에서 로그인 후 /mypage로 이동하면 /login으로 계속 리디렉션되는 문제가 발생했습니다.콘솔에는 307 Temporary Redirect 응답이 뜨며, 로그인 상태임에도 인증되지 않은 것으로 처리되었습니다. ✅ 원인 분석백엔드 코드를 확인해보니, Acces..

#기술블로그 #디자인시스템 #MCP #CursorAI #Playwright #BDS 그래서 오늘의 TIL(Today I Learned) 학습 키워드✨ MCP 기반 마이그레이션 자동화✨ 크롬 자동완성 대응 스타일링✨ 사용자 경험 중심 테스트 룰 정립✅ 문제 설명✅ 해결 방법✅ 발생한 문제와 방안✅ 최종적인 해결 방법✅ 오늘 배운 것과 느낀점✅ 최적화 및 자동화✅ 문제 설명기존 레거시 페이지(findpassword)에 BDS 디자인 시스템 + MUI 를 적용하는 마이그레이션을 진행했습니다.단순 스타일 적용이 아닌, 재사용성과 접근성까지 고려한 리팩토링을 목표로 했습니다. ✅ 해결 방법Cursor AI + MCP(Memory-Conscious Prompt) 2종 연동Input, Text, Stack 등을..

#MLOps #모두연구소 #AI모델배포 #모델서빙 #운영자동화 ✅ 오늘의 TIL(Today I Learned)✨ MLOps 실무 아키텍처✨ Airflow & Triton 기반 배포 파이프라인✅ 교육 개요이번 외부교육에서는 MLOps의 전체 아키텍처 설계부터 실제 운영 환경에서의 자동화, 모니터링까지 전반적인 실무 지식을 다뤘습니다. 단순한 툴 사용법이 아닌, 실제 현업 MLOps 팀장님의 실전 사례와 함께 학습하며 "왜 이 아키텍처가 필요한가", "이 흐름이 어떤 문제를 해결하는가"에 대한 인사이트를 얻을 수 있었습니다.✅ 핵심 개념 요약MLOps = DevOps + 머신러닝 라이프사이클 전체를 아우르는 운영 체계데이터 수집 → 전처리 → 학습 → 배포 → 모니터링 → 재학습의 반복 구조각 단계에서 자동..