Question 1

Jaka jest zalecana metoda definiowania metadata w Next.js App Router?

Accepted Answer

Next.js App Router wprowadza obiekt `metadata` eksportowany z layouts i pages, umożliwiając definiowanie metadata w sposób type-safe i zoptymalizowany. To podejście zastępuje komponenty `<Head>` z Next.js 12 i umożliwia renderowanie metadata po stronie serwera. Export `metadata` jest statyczny i analizowany w build time, co zapewnia lepszą wydajność SEO.

Question 2

Jak generować dynamiczne metadata na podstawie parametrów route w Next.js?

Accepted Answer

Funkcja `generateMetadata` jest asynchroniczna i otrzymuje `params` oraz `searchParams` jako argumenty, umożliwiając ładowanie danych do dynamicznego budowania metadata. Jest wykonywana po stronie serwera w czasie renderowania i może wykonywać wywołania API. Pozwala to na tworzenie unikalnych metadata dla każdej dynamicznej strony, co jest kluczowe dla SEO stron szczegółowych.

Question 3

Jak Next.js obsługuje łączenie metadata między zagnieżdżonymi layouts a pages?

Accepted Answer

Next.js automatycznie łączy metadata z nadrzędnych layouts do podrzędnych pages, z priorytetem dla wartości najbliższych page. Pola są nadpisywane (title, description) z wyjątkiem `openGraph.images` i `twitter.images`, które są łączone jako tablice. Ta kaskada pozwala definiować domyślne metadata na poziomie root i nadpisywać je na poziomie page.

Metadata & SEO w Next.js

Jaka jest zalecana metoda definiowania metadata w Next.js App Router?

Odpowiedź

Jak generować dynamiczne metadata na podstawie parametrów route w Next.js?

Odpowiedź

Jak Next.js obsługuje łączenie metadata między zagnieżdżonymi layouts a pages?

Odpowiedź

Jaka jest korzyść z używania `title.template` w metadata Next.js?

Jaka jest zalecana metoda definiowania favicon w Next.js App Router?

Inne tematy rekrutacyjne React / Next.js

Podstawy JavaScript

Podstawy React

React Hooks

Cykl życia komponentu

React Router

Zarządzanie stanem z Context

Formularze i Controlled Components

Pobieranie danych i API

React Query (TanStack Query)

Styling & CSS-in-JS

Podstawy Next.js

TypeScript z React

Pobieranie danych w Next.js

Server Actions w Next.js

Routing i Nawigacja w Next.js

API Routes w Next.js

Middleware i Auth w Next.js

Testowanie React

Zustand State Management

Optymalizacja wydajności React

Error Boundaries & Error Handling

Advanced React Patterns

Zaawansowane funkcje Next.js

Wdrożenie i Produkcja Next.js

Architecture & Design Patterns

React Server Components

Internacjonalizacja Next.js

React Bezpieczeństwo & Najlepsze Praktyki

Opanuj React / Next.js na następną rozmowę