Question 1

O que é um React Server Component?

Accepted Answer

Server Components são componentes React que executam apenas no servidor e nunca são enviados ao cliente. Ao contrário dos componentes tradicionais, eles não precisam ser hidratados no lado do cliente, o que reduz significativamente o tamanho do bundle JavaScript. Eles permitem acesso direto a recursos do backend (bancos de dados, sistemas de arquivos) sem expor segredos ou chaves de API.

Question 2

Como declarar um Client Component no React?

Accepted Answer

A diretiva 'use client' colocada no topo de um arquivo indica que o componente e todos os seus filhos importados são Client Components. Esta diretiva marca a fronteira entre o código do servidor e do cliente. Sem esta diretiva, os componentes são Server Components por padrão em frameworks que suportam RSC como Next.js App Router.

Question 3

Qual é a principal diferença entre Server e Client Components?

Accepted Answer

Server Components executam no servidor e seu código nunca é enviado ao cliente, enquanto Client Components são enviados ao navegador e requerem JavaScript para interatividade. Esta distinção fundamental afeta o acesso a recursos, o tamanho do bundle e as capacidades de interatividade. Server Components não podem usar hooks React ou lidar com eventos de usuário.

React Server Components

O que é um React Server Component?

Resposta

Como declarar um Client Component no React?

Resposta

Qual é a principal diferença entre Server e Client Components?

Resposta

Qual hook React pode ser usado em um Server Component?

Como fazer data fetching em um Server Component?

Outros temas de entrevista React / Next.js

Fundamentos de JavaScript

Fundamentos do React

React Hooks

Ciclo de vida dos componentes

React Router

Gerenciamento de estado com Context

Formulários e Controlled Components

Busca de dados e API

React Query (TanStack Query)

Styling & CSS-in-JS

Fundamentos do Next.js

TypeScript com React

Data Fetching no Next.js

Server Actions do Next.js

Roteamento e Navegação no Next.js

API Routes do Next.js

Metadata & SEO no Next.js

Middleware e Auth no Next.js

Testes em React

Zustand State Management

Otimização de Performance React

Error Boundaries & Error Handling

Advanced React Patterns

Recursos avançados do Next.js

Deploy e Produção com Next.js

Architecture & Design Patterns

Internacionalização do Next.js

React Security & Boas Práticas

Domine React / Next.js para sua proxima entrevista