Next.js App Router metadata 설정 기준: SEO 개념과 실무 적용
Next.js App Router metadata 전체 개념 이 문서는 React와 Next.js에서 메타데이터를 다루는 방식의 차이를 철학부터 실제 코드 구조까지 단계적으로 정리한 학습 문서입니다. …
더 읽기
hebi_admin
Next.js Metadata API 실무 예제: metadata 객체와 generateMetadata 코드
Metadata API 문법을 볼 때 먼저 확인할 포인트 이 문서는 Next.js App Router 환경에서 metadata API를 사용하는 올바른 방법을 단계별로 설명합니다. 먼저 기본적인 메타데이터 설정…
더 읽기![Next.js 동적 라우팅 사용법: [slug]로 상세 페이지 만들기 대표 이미지](https://blogflow.kr/wp-content/uploads/2026/05/nextjs-slug-usage-featured-362-max700-q75-300x200.webp "Next.js 동적 라우팅 사용법: [slug]로 상세 페이지 만들기 3")
Next.js 동적 라우팅 사용법: [slug]로 상세 페이지 만들기
이 글에서 정리하는 내용 Next.js 기준으로 동적 세그먼트가 왜 필요한지부터, params, useParams(), generateStaticParams()를 언제 쓰는지까지 흐름에 맞춰 정리했습니다. 문법만 외우기보다 주소와 파일 구조가 어떻게 연결되는지 자연스럽…
더 읽기
Next.js App Router 학습 순서: 라우팅, 렌더링, SEO, 배포까지
라우팅, metadata, redirects, 성능 글은 각각 있지만 전체 순서가 보이지 않으면 필요한 글을 찾기 어렵습니다. App Router는 폴더부터 외우면 오래 걸립니다 Next.js 를 처음 보면 app 폴더, layout, page, route han…
더 읽기
React Vue Svelte 비교: 2025 프론트엔드 프레임워크 선택 기준
React Vue Svelte 선택 비교 핵심 요약 이 글은 2025년에 React, Vue, Svelte 중 어떤 프론트엔드 기술을 고를지 비교하는 대표 글입니다. 생태계 규모, 채용 시장, 학습 난이도, 메타 프레임워크 흐름을 기준으로 “프로젝트의 큰 축”을 선택하…
더 읽기
React Compiler 기준: useMemo useCallback 언제 줄일까
이 글에서 정리하는 내용 React Compiler 1.0을 적용한 뒤 와 을 어디까지 줄일 수 있는지, 새 코드와 기존 코드에서 판단 기준이 어떻게 달라지는지 실무 흐름에 맞춰 정리합니다. React Compiler 1.0이 바꾸는 기준 useMemo는 어디까지…
더 읽기
React Tailwind 조건부 클래스 정리: className이 길어질 때 나누는 기준
이 글에서 정리하는 내용 React에서 Tailwind CSS를 사용할 때 조건부 이 길어지는 이유와 정리 기준을 다룹니다. 짧은 조건은 JSX 안에서 처리하고, 반복되는 조합은 객체로 분리하며, 버튼 컴포넌트가 커졌을 때는 props 구조, 유틸 함수, variant…
더 읽기
React Tailwind 동적 클래스 해결: 조건부 스타일이 적용되지 않는 이유
이 글에서 정리하는 내용 React에서 Tailwind CSS를 사용할 때 처럼 조립한 클래스명이 왜 적용되지 않는지 정리합니다. Tailwind CSS v4 기준으로 Tailwind는 JavaScript 실행 결과가 아니라 소스 파일 안의 완성된 클래스 문자열을 기준…
더 읽기
React Tailwind className 정리 기준: 클래스가 길어질 때 가독성 높이기
이 글에서 정리하는 내용 React에서 Tailwind CSS를 사용할 때 className이 길어지는 문제를 JSX 가독성 관점에서 정리합니다. 긴 클래스 자체를 없애는 것보다, 반복되는 조합을 어디까지 상수로 빼고 언제 컴포넌트로 분리할지 판단하는 기준에 초점을 맞…
더 읽기
React useEffect가 두 번 실행되는 이유: StrictMode 원리와 해결 방향
먼저 읽을 글 안내: StrictMode 원리 자체가 궁금하면 이 글을 먼저 보면 됩니다. API 요청이 실제로 두 번 나가는 문제를 빠르게 막고 싶다면 useEffect 중복 실행 실무 체크리스트를 이어서 확인하세요. 이 글의 검색 의도: React 18 개발 모…
더 읽기