개발기
1.[Next.js] 매장보고서 페이지 개발기: 같은 UI, 다른 렌더링 전략
현재 개발 중인 대안신용평가 사이트에서 매장보고서 페이지를 만들면서 겪었던 고민들과 해결 과정을 정리해본다. 겉보기엔 거의 같은 UI지만 속은 완전히 다른 두 페이지를 어떻게 구성했는지 기록해보자!매장보고서 페이지는 두 가지 형태로 존재한다:관리자 페이지 (/admin
2.[Next.js] API 초기 세팅하기 (serverAPI와 clientAPI분리)
React와 달리 Next.js App Router에서는 데이터를 가져오는 방법이 다양하다. 서버 전용 API 모듈과 클라이언트 전용 API 모듈을 분리하고, 프록시 Route Handler로 브라우저 요청에 안전하게 토큰 주입하는 구조를 만들어본 과정을 기록해본다!
3.[FE] 한글 입력 시 이벤트 중복 발생 (feat. keyup)
한글 입력시 api 호출이 두 번 되길래 엥 이거 왜이래! 하고 서치하다보니 죄다 keyup이었어서 keydown에 관해서도 정리하기로 결심. 가보자고~ 일단 문제
4.[React] React로 무한 스크롤을 구현해보자
강아지를 무한대로 즐길 수 있게 무한 스크롤을 구현해보자. 페이지네이션으로 2페이지, 3페이지 이렇게 넘어갈 수 있음에도 굳이 무한 스크롤을 쓰는 이유는 뭘까? 클릭 하나도 결국 수고로움이기에 그런 것들을 줄이기 위한 고민으로 나오지 않았을까 싶다. 물론 모든 웹사이
5.[React] 웹 서비스에서 버전 업데이트 알려주기
근 10일의 여정을 마무리하는 기념으로 신입의 삽질을 정리해보자!
6.Tailwind에서 동적 스타일코드 씹힘 현상 해결하기
Next.js 15 + Tailwind 4 환경에서 재사용 가능한 Gap 컴포넌트를 만들다가 예상치 못한 벽에 부딪혔다. "왜 이렇게 간단한 컴포넌트가 동작을 안 하지?"라는 의문에서 시작해, 해결 과정을 정리해본다.프로젝트에서 반복되는 flex 레이아웃 패턴을 정리하
7.[TIL] 로그인 실패 횟수 제한 처리: 상태코드를 활용한 UI 분기
GS 인증 관련 요구사항을 맞추는 과정에서 “로그인 실패를 특정 횟수 이상 반복하면 무차별 대입 공격을 방지해야 한다”는 조건이 생겼습니다.백엔드에서 로그인 시도 횟수와 제한(잠금/쿨다운)을 관리하고, 프론트에서는 상태에 따라 UI를 명확하게 분기해서 사용자에게 안내해