
Francisco Rhaiel
AI Growth Engineer
Programación y Desarrollo Web
React en entrevistas laborales: qué proyectos demostrar y qué conceptos suelen preguntar
Publicado el
Resumen ejecutivo
En entrevistas React (junior/semisenior LATAM) pesan hooks, estado, fetch de datos y routing — más que memorizar APIs obscuras.
Tres proyectos de portfolio alineados a lo que piden: CRUD con auth liviana, data fetching con estados de UI, y una feature con routing + estado global acotado.
La docs oficial de React sobre state y useState es tu piso; bancos de preguntas de ex-interviewers ayudan a priorizar temas.
Demostrá trade-offs: cuándo Context alcanza, cuándo no; cómo evitás waterfalls y race conditions básicas en fetch.
Si estás buscando trabajo con React en LATAM, el portfolio y la entrevista hablan el mismo idioma: ¿podés construir UI con estado predecible, pedir datos sin romper la UX y navegar una SPA con rutas claras? El ángulo de este artículo es una lista de conceptos que más aparecen y tres proyectos alineados a junior/semisenior. ¿Por qué ahora? Porque React sigue siendo el stack frontend más pedido en búsquedas formativas y laborales de la región, y recursos de prep como el listado de 100+ React interview questions de GreatFrontEnd confirman el peso de hooks, router y estado. La fuente de verdad sigue siendo react.dev.
Conceptos que suelen preguntar (y cómo estudiarlos)
Hooks y reglas
useState: memoria del componente; por qué una variable let no alcanza (la docs de state lo explica con claridad).useEffect: sincronizar con el exterior; dependency array; cleanup (subscriptions, abort de fetch).Reglas de hooks: solo top-level; mismo orden en cada render.
useRef,useMemo/useCallback: cuándo sí y cuándo es premature optimization.useReducer: estado complejo con transiciones claras (forms, wizards, listas con acciones).
Estado y props
Estado local vs levantarlo al padre (lifting state).
Controlled inputs.
Derived state: no dupliques lo que podés calcular.
Context para temas/auth/locale — no como “Redux casero” para todo.
Fetch de datos
Estados de UI: loading / success / empty / error.
Race conditions: el response viejo que pisa al nuevo (abort controller o ignore flag).
Dónde fetchear: efecto en el contenedor vs librerías (React Query / SWR) si el JD las menciona.
Routing
SPA vs MPA: por qué React Router escucha el History API.
Rutas anidadas, params (
useParams), navegación programática (useNavigate).Rutas protegidas (auth gate) a nivel conceptual.
Para el momento de la conversación con la empresa, cruzá esto con tips para la entrevista laboral.
Tres proyectos de portfolio que alinean con lo que piden
1. App CRUD con autenticación liviana
Qué demuestra: formularios controlled, estado de listas, optimistic UI básica o al menos feedback claro, rutas login/lista/detalle. Stack sugerido: React + React Router + API mock (JSON Server) o Firebase/Supabase. README: decisiones de modelo de datos, manejo de errores, qué harías con paginación.
2. Data dashboard o “explorer” con fetching real
Qué demuestra: loading/error/empty, filtros, debounce en búsqueda, cancelación de requests. Ideal si mostrás una API pública o un backend propio mínimo. Plus semisenior: cache liviana o React Query, y explicación de trade-offs.
3. Feature “producto” con routing + estado compartido acotado
Ejemplos: carrito, kanban simple, wizard multi-step, board de tareas con drag básico. Qué demuestra: composición de componentes, dónde vive el estado, Context vs props drilling, rutas anidadas. Evitá clonar un tutorial pixel-perfect sin narrativa: contá el problema de UX que resolviste.
En los tres proyectos: deploy (Vercel/Netlify), repo limpio, y un video de 60–90 segundos. Eso pesa más que diez repos abandonados. Si estás en etapa de búsqueda, también ayudan los tips para conseguir empleo.
Cómo responder en la entrevista (plantillas cortas)
“¿Qué es el estado en React?” → Memoria del componente entre renders; se declara con useState; actualizarla dispara re-render. Las variables locales no persisten ni notifican a React.
“¿Cuándo usás useEffect?” → Para sincronizar con sistemas externos (red, DOM, timers), no para calcular derived data.
“¿Context o Redux?” → Context para estado de baja frecuencia y alcance amplio (tema, usuario). Stores cuando hay updates frecuentes y lógica compleja; justificar con el tamaño del equipo/app.
“¿Cómo evitás un infinite loop en useEffect?” → Dependencias correctas; no setear estado que vuelve a disparar el efecto sin condición; entender el array vacío vs completo.
Checklist de la semana previa
Repasá state, effects y listas (keys) con un ejercicio de 30 minutos.
Hacé live coding: todo app, search con debounce, o fetch + render.
Walkthrough de tus 3 proyectos en voz alta (decisiones y trade-offs).
Leé el JD: ¿TypeScript? ¿Next.js? ¿Testing? Priorizá gaps reales, no inventes stack.
Live coding: qué esperan y cómo practicar
En muchos procesos LATAM el live coding de React dura 45–60 minutos. Patrones frecuentes:
Lista con alta, edición y borrado (estado de array + keys).
Input de búsqueda con filtro; a veces debounce.
Fetch a una API y render condicional.
Pequeño refactor: extraer componentes o custom hook.
Entrená en voz alta: explicá la forma del estado antes de codear. Si te trabás, pedí 2 minutos para diseñar. Preferí una solución correcta y legible a una “clever” a medias. Si hay TypeScript en el JD, practicá tipar props y el response del fetch sin obsesionarte con generics avanzados.
Qué miran en tu GitHub (además del código)
Commits con mensajes claros (no un solo “final final”).
Issues/PRs si colaboraste; si no, un buen historial personal alcanza.
Accesibilidad básica: labels en forms, contraste, foco.
Performance sensata: no bloquear el render con trabajo pesado en el cuerpo del componente.
Un repo con README en español claro, script de start y captura o link deploy suele superar a un monorepo vacío de carpetas.
Señales de que tu respuesta técnica está “senior enough”
No hace falta ser staff engineer. Sí ayuda mostrar que pensás en edge cases (lista vacía, error de red, doble click), que nombrás componentes con intención y que podés explicar por qué no metiste una librería más. Esa calma suele diferenciarte en entrevistas de junior saturadas de tutoriales idénticos.
Cursos recomendados de Coderhouse
Si querés un recorrido con React y salida a interviews, la Carrera de Desarrollo Frontend React te ordena fundamentos y proyectos. Si tu meta es perfil más completo (API + UI), mirá la Carrera de Desarrollo Full Stack.
CTA: esta semana cerrá el Proyecto 2 (fetching con estados de UI) y practicá un live coding de 45 minutos. Si necesitás estructura y feedback, mirá Frontend React o Full Stack en Coderhouse y convertí cada entrega en pieza de portfolio para entrevistas.
Preguntas frecuentes
¿Junior necesita Redux sí o sí? No. Muchos equipos junior/mids usan Context + estado local, o Zustand/Query. Aprendé el concepto de store; no memorices boilerplate viejo si el JD no lo pide.
¿Class components todavía preguntan? Cada vez menos. Entendé la diferencia histórica, pero priorizá function components + hooks.
¿Next.js es obligatorio? Depende del mercado local y del JD. React sólido transfiere; si el aviso menciona Next, sumá routing/data fetching de ese framework en un proyecto.
¿Cuántos proyectos muestro? Tres pulidos con deploy y README > diez incompletos. Calidad y narrativa ganan.

Sobre el autor
Soy Francisco Rhaiel, AI Growth Engineer en Coderhouse. Mi día a día consiste en automatizar y optimizar procesos aplicando lo último en inteligencia artificial, incluyendo Agentic AI y Gen AI. Soy graduado de la Universidad Torcuato Di Tella (UTDT) en Tecnología Digital, y mi recorrido me llevó a especializarme en la intersección entre tecnología, datos y negocio. Me mueve aprender, construir y aplicar tecnologías innovadoras para resolver problemas reales. Para profundizar en mi trayectoria, te espero en mi perfil de LinkedIn.
Artículos destacados
Ver todos los artículos
Guía de Rol
Business Intelligence como carrera: qué hace un BI Analyst, cuánto gana y cómo entrar al sector
Publicado el
Tutorial: Guía Paso a Paso
APIs de IA para principiantes: cómo conectar GPT, Claude y Gemini a tus proyectos
Publicado el
Comparativa de Herramientas
Business Intelligence vs Data Analytics: diferencias clave, herramientas y qué aprender primero en Argentina
Publicado el
Uso de IA
Agentes de IA: qué son, para qué sirven y cómo empezar a usarlos en tu trabajo
Publicado el
Tutorial: Guía Paso a Paso
Claude Cowork vs. ChatGPT: ¿Cuál es la mejor herramienta?
Publicado el
Ruta de Aprendizaje
¿Cómo aprender inteligencia artificial desde cero? Guía Completa
Publicado el
