Qué preguntan en una entrevista de frontend, cómo responder sobre React, CSS y rendimiento y cómo ensayar la conversación con un entrenador de IA.
La entrevista frontend se diferencia de otras entrevistas técnicas: aquí no solo se evalúa el conocimiento de las API, sino también cómo piensas en el usuario. Un mismo componente se puede escribir de tres maneras, y la pregunta «por qué precisamente así» pesa más que la propia implementación.
Normalmente hay cuatro etapas, y cada una requiere su propia preparación:
| Etapa | Qué se evalúa | Cómo prepararse |
|---|---|---|
| Screening con el reclutador | experiencia, motivación, expectativas salariales | tres frases sobre ti + rango salarial |
| Entrevista técnica | JavaScript, CSS, navegador, framework | análisis de las preguntas a continuación |
| Live coding | cómo escribe código y razona | explicar en voz alta el proceso de resolución |
| Diseño de sistemas / arquitectura | cómo diseña la interfaz y el estado | estructurar la respuesta: contexto → opciones → elección |
Aquí no se evalúa la escala, sino su papel. Mal: «reescribimos el frontend en React». Bien: «yo me encargué de la transición a la nueva API — hubo que mantener la compatibilidad, así fue como lo hice y esto es lo que aportó en las métricas».
Conjunto típico: event loop, promesas frente a async/await, burbujeo de eventos, delegación, `this`, closures, diferencias entre `var`/`let`/`const`, diferencia entre copia por referencia y por valor. No esperan definiciones, sino un ejemplo de uso.
Flexbox frente a Grid, especificidad de selectores, cómo funciona `position: sticky`, qué es margin collapse, cómo se hizo el diseño adaptable sin media queries. Evalúan la capacidad de explicar, no de memorizar la sintaxis.
Diferencia entre estado y props, para qué sirven las keys en las listas, qué es un rerender y cómo evitarlo, `useEffect` y sus dependencias, memoización, contexto frente a gestor de estado. A menudo piden encontrar un error en un fragmento de código.
Qué son Core Web Vitals, cómo medir LCP y CLS, qué hacer con el JS sobrante en el bundle, para qué sirven code splitting y lazy loading, cómo funciona el caché. Aquí es importante nombrar herramientas concretas: Lighthouse, Performance API, Chrome DevTools.
Etiquetas semánticas, ARIA, foco y navegación por teclado, contraste. Una pregunta eliminatoria para muchos candidatos.
Comprueban si sabes ver los estados (por ejemplo, hover, disabled, ausencia de datos), y no solo la maqueta ideal.
En las preguntas técnicas funciona la misma estructura que en las conductuales: tesis → justificación → ejemplo → limitación. El último paso suele olvidarse, y es precisamente el que distingue a un senior de un middle.
«Para este caso usaría la virtualización de listas. La razón: el DOM no aguanta diez mil nodos; al hacer scroll empiezan las caídas de rendimiento. En un proyecto anterior así redujimos el tiempo hasta la interactividad aproximadamente a un tercio. Limitación: la virtualización funciona mal con altura variable de filas; en ese caso hay que medir».
Fíjese: hay una solución, una razón, un resultado concreto y un límite honesto de aplicabilidad. Una respuesta así no se puede «memorizar», pero sí se puede ensayar.
| Día | Qué hacer | Tiempo |
|---|---|---|
| 1 | Escribir tus 5 proyectos: rol, tarea, resultado en cifras | 40 min |
| 2 | Repasar los 7 temas anteriores y marcar dónde la respuesta no cuadra | 40 min |
| 3 | Responder en voz alta a 10 preguntas y grabarte en el dictáfono | 30 min |
| 4 | Analizar la grabación: dónde están las pausas, dónde se pierde la estructura | 20 min |
| 5 | Realizar un diálogo completo con el entrenador de IA para tu vacante | 30 min |
| 6–7 | Repetir las respuestas problemáticas, repetir el ensayo | 20 min |
Qué cambia: la velocidad para armar la respuesta, la capacidad de no perder la estructura ante una pregunta inesperada, la habilidad de señalar la limitación de tu solución. Esto se nota ya después de tres o cuatro ensayos.
Qué no habrá: la preparación no sustituye el conocimiento de la tecnología. Si no entiendes el event loop, una estructura bonita de la respuesta no ayudará. Primero, el conocimiento; después, la habilidad de presentarlo.
Si ya tienes una base técnica — una semana de 30–40 minutos al día: estructura de las respuestas, decirlas en voz alta, una simulación completa del diálogo. Si la base falla en un tema concreto (por ejemplo, el event loop o la cascada de CSS), primero refuérzalo; de lo contrario, la estructura de la respuesta no ayudará.
Depende de la empresa: en los equipos de producto suelen dar tareas prácticas (escribir un componente, analizar un bug), en las grandes empresas tecnológicas — algoritmos clásicos. Aclara el formato con el reclutador de antemano — es una pregunta normal.
Dilo directamente y muestra cómo lo buscarías: «No he trabajado directamente con esto, pero la lógica se parece a X — lo comprobaría en la documentación y en un prototipo». Esto se valora más que una respuesta inventada: el entrevistador casi siempre se da cuenta cuando el candidato se pierde.
Sí, es una habilidad aparte. Practica decir la solución en voz alta, escribir código en el editor sin autocompletado y empezar con preguntas aclaratorias. Incluso un desarrollador seguro de sí mismo sin esta práctica se pierde en la primera sesión.
Indica un rango, no un solo número, y basa tu respuesta en el mercado. Cómo hacerlo sin incomodidad — se explica en el artículo negociación salarial.
Describe la situación en una frase — «entrevista para desarrollador frontend, React, tres años de experiencia» — y realiza el diálogo en el simulador. El entrenador hará preguntas sobre tu rol y analizará las respuestas después de la conversación.
Empieza con cinco proyectos: rol, tarea, resultado en cifras. Luego recorre el diálogo completo — , abre HintMeTalk AI, modo «Entrenador», describe la situación. Después del análisis se verá qué respuestas flaquean: normalmente son dos o tres de cada diez, y son precisamente las que deciden el resultado.
Los principios generales para preparar cualquier entrevista — en el artículo preparación para la entrevista. Y si se avecina una conversación sobre dinero — negociaciones salariales.
Practica esta habilidad en HintMeTalk AI
Abrir la app
HintMeTalk