Volver a guías

GUÍA / Frontend

Qué debe saber un Frontend Junior para trabajar en un equipo

Conoce las habilidades técnicas y de trabajo que debería dominar un Frontend Junior: JavaScript, React, Git, APIs, debugging, Pull Requests y Code Review.

frontend12 min

Introducción: habilidades que puedes demostrar

Una lista de tecnologías no demuestra que puedas resolver una tarea. Esta guía te ayuda a evaluar tu capacidad para construir, comprobar y explicar una interfaz dentro de un equipo. Las expectativas varían entre proyectos y empresas; estas prácticas no prometen empleo ni sustituyen los requisitos de una vacante.

Qué aprender y cómo prepararte

Necesitas un proyecto pequeño que puedas ejecutar y modificar. Úsalo para detectar lo que haces con autonomía y lo que todavía requiere ayuda. El objetivo no es memorizar respuestas: es mostrar evidencia mediante código, pruebas y decisiones documentadas.

HTML semántico, CSS y responsive

Elige botones para acciones, enlaces para navegación y labels asociados a campos. Comprueba navegación con teclado, foco visible y mensajes entendibles. Construye layouts con Flexbox o Grid y prueba anchos pequeños, texto largo y zoom. Una pantalla que solo funciona con tus datos ideales todavía necesita trabajo.

JavaScript moderno, React y TypeScript

Debes poder transformar arrays, leer objetos, usar funciones y módulos y razonar sobre asincronía. En React, divide responsabilidades, pasa props y conserva en estado solo lo necesario. Usa TypeScript para describir props y respuestas; un tipo no valida automáticamente el JSON recibido en ejecución. Explica por qué un estado vive en un componente concreto.

APIs y debugging

Una petición necesita estados de carga, error, vacío y éxito. Inspecciona URL, método, status y respuesta en Network antes de culpar al componente. Reproduce el fallo con pasos precisos, formula una hipótesis y usa breakpoints o registros acotados para comprobarla. Evita cambiar varias cosas a la vez porque dificulta saber qué corrigió el problema.

Git, Pull Requests y Code Review

Crea ramas por tarea, commits legibles y PR con contexto. Revisa el diff antes de pedir revisión. Ante un comentario, explica tu criterio o incorpora una mejora; no lo trates como una evaluación personal. Comunica pronto los bloqueos incluyendo qué intentaste y qué evidencia encontraste.

Testing básico y ejemplo práctico

Para una lista de productos, comprueba carga, resultado vacío, error del servidor y filtrado. Un test útil describe comportamiento observable: al escribir una búsqueda sin coincidencias aparece el estado vacío. Evita tests que solo repitan detalles internos; complementa con una prueba manual de teclado y pantalla estrecha.

Criterio técnico y uso responsable de IA

Puedes usar IA para proponer hipótesis, ejemplos o casos de prueba. Lee cada cambio, contrástalo con documentación y ejecútalo. No compartas credenciales ni código privado sin autorización. Si no puedes explicar una solución, pide una explicación y simplifícala antes de entregarla. Documenta el coste de tus decisiones, no solo sus ventajas.

Qué practicar después

Entrega una pequeña mejora de punta a punta: ticket, interfaz responsive, consumo de API, estados alternativos, test y PR. En el README explica una decisión y una limitación. Pide a otra persona que ejecute el proyecto con tus instrucciones y registra qué información faltó.

Guías relacionadas

¿Quieres aprender esto dentro de un flujo profesional?

Conoce Frontend Developer con React