블로그를 리뉴얼하면서 스터디 상세 페이지의 Markdown 본문과 목차(TOC)를 다시 짰습니다. StudyMarkdown.tsx와 StudyToc.tsx 안에 흩어져 있던 heading id 규칙과 스크롤 기반 활성 표시(is_active)를 에이전트와 함께 정리했습니다

현재 진행 중인 포트폴리오 사이트의 마우스 이펙트를 구현하는 과정에서 NextJS의 오류를 해결한 방법을 기록하려고 합니다. 이전에는 useState를 사용하여 마우스 움직임을 감지하고 상태를 업데이트했는데 예상치 못한 오류가 발생했습니다. 허헣.. Maximum update depth exceeded 오류가 발생하면서 무한 루프에 빠지는 문제를 해결해야 했습니다!

NextJS에서 JSON을 기반으로 동적 라우팅이 설정되어 있는데요. 이번에 자동으로 동적 sitemap.xml을 생성했습니다. 기존의 정적인 sitemap을 동적으로 변환하는 과정과 JSON 데이터를 기반으로 sitemap을 자동으로 업데이트하는지 알아보았습니다. 기존 Sitemap vs 변경된 Sitemap 우선 기존의 sitemap.xml과 우리가 새롭게 변경할 sitemap.xml의 차이점을 먼저 살펴보겠습니다.

오늘은 NextJS 15로 프로젝트를 마이그레이션하면서 겪은 params 오류와 해결 과정을 정리하려고 합니다. NextJS 15 params 오류 발생 React 파일들을 NextJS에 맞게 변경하는데 터미널에서 다음과 같은 오류가 발생했습니다. 오류 메시지 등장! Error: Route "/fs/[title]" used `params.title`. `params` should be awaited before using its properties. 뭐지? params를 `await`로 감싸야 한다? 이전 React에서는 잘되던 코드인데 왜 이런 오류가 발생..?

React 프로젝트를 NextJS로 마이그레이션하면서 마주쳤던 sessionStorage 관련 오류를 공유하려고 합니다. 사실 저는 React 코드 그대로 NextJS에서 쓰면 되지 않을까? 하는 가벼운 생각을 했는데요. 마이그레이션을 진행하다보니 작은 오류부터 큼지막한 오류까지 다양했습니다. 작은 오류: img 태그를 Image 컴포넌트로 변경하라는 오류, useLocation이 아니라 usePathname을 사용해야 하는 오류 등

안녕하세요! 오늘은 React 프로젝트에서 세션 스토리지를 이용해 지저분했던 스토리지를 조금이나마 개선한 과정을 소개하려고 합니다. 프로젝트의 주요 기능인 명언 표시(Saying), 카드 페이징(CardPagination), 해시태그(Hashs)에서 데이터를 저장하고 읽어오는 방식을 업그레이드했습니다.

제가 진행했던 React 프로젝트의 코드를 살짝 손보고 새로운 기능을 추가했는데요. 개선하는 과정에서 (정말 개선이 잘 되었다고는 생각하지는 않지만) URL 경로 이상 문제도 다뤄보도록 하겠습니다. 헬멧과 슬라이드 배너만 돌아가는 아무것도 없는 Home 탭이었습니다. 여기에 공부했던 블로그 글을 전부 화면에 표시해주면 좋을 것 같다는 생각을 했습니다.

안녕하세요! 여러분, 이번에는 Markdown 에디터 2탄을 가지고 돌아왔습니다! 지난번에는 글을 작성하고 Supabase 테이블에 데이터 저장까지 성공했었는데요. 이제 파일로도 저장하면 더 깔끔하고 관리하기 좋지 않을까라는 생각이 들어 곧바로 실행에 옮겼습니다!