Desarrollador Frontend Junior 2026
Las ofertas de frontend junior en Turquía no paran de apilar Docker, CI/CD, GraphQL y Cloud encima de React. Esta hoja de ruta ordena esa lista: la base que realmente necesitas para que te contraten, lo que aparece mucho en las ofertas pero no es obligatorio, y lo que aprenderás una vez estés trabajando.
Conocer 20 tecnologías de forma superficial no vale más que no conocer ninguna bien. Sigue el orden, haz clic en cada tema para ver qué necesitas saber y marca lo que ya hayas aprendido.
- EsencialDomínalo bien antes de postularte
- RecomendableAparece mucho en ofertas de empleo y te da ventaja
- Más adelanteCuando ya estés trabajando y lo necesites
Haz clic en un tema para ver qué necesitas saber y dónde aprenderlo.
- 01
Fundamentos
Aquello sobre lo que se construye todo lo demás. Si te lo saltas, tendrás que volver a ello en cada etapa posterior.
- 02
Herramientas
Las herramientas del día a día que necesitas para trabajar en equipo.
- 03
Framework
Lo que de verdad piden las ofertas. Si tu base es sólida, esto va más rápido de lo que imaginas.
- 04
Listo para trabajar
Cosas que aparecen mucho en las ofertas y te distinguen de otros candidatos.
- 05
Cosas que puedes aprender después
Cosas que ves en las ofertas pero que no necesitas para que te contraten. Las aprenderás en producción, cuando surja la necesidad, junto con tu equipo.
Tema por tema
Todos los temas del mapa con su descripción, qué saber y recursos, en una sola lista.
01Fundamentos
¿Cómo funciona la web?· Esencial
Saber qué pasa cuando escribes una dirección en el navegador te ayuda a entender la mitad de los errores con los que te toparás. Aquí no hace falta profundizar: basta con tener la visión general.
Lo que deberías saber
- El modelo cliente-servidor: sale una solicitud, vuelve una respuesta
- A grandes rasgos, qué son un nombre de dominio, el DNS y el hosting
- Cómo el navegador toma HTML, CSS y JavaScript y los dibuja en pantalla
Recursos
HTTP y HTTPS· Esencial
El idioma que habla el frontend. Si sabes leer métodos y códigos de estado, podrás depurar por tu cuenta los errores de las APIs.
Lo que deberías saber
- Cuándo usar GET, POST, PUT, PATCH y DELETE
- Códigos de estado: 200, 201, 301, 400, 401, 403, 404, 500
- Cabeceras de solicitud y de respuesta
- Por qué HTTPS es imprescindible
Recursos
DNS y nombres de dominio· Esencial
Cómo un nombre de dominio se resuelve hacia un servidor. Lo primero con lo que te encontrarás al poner tu proyecto en línea.
Recursos
El navegador y el renderizado· Esencial
El camino del HTML al DOM y del CSS a los píxeles en pantalla. Cuando se habla de rendimiento, todo el mundo acaba volviendo aquí.
Lo que deberías saber
- El DOM y el CSSOM
- Layout, paint, composite
- Recursos que bloquean el renderizado
Recursos
HTML· Esencial
El esqueleto de la página. Mucha gente lo salta porque «HTML es fácil», pero es el tema que más lagunas deja al descubierto en las entrevistas: elegir la etiqueta correcta determina tanto la accesibilidad como el SEO.
Lo que deberías saber
- Estructura del documento: head, body, etiquetas meta
- Elegir la etiqueta correcta: div no es la respuesta a todo
Recursos
HTML semántico· Esencial
header, nav, main, article, section, button: cada una significa algo. Tanto los lectores de pantalla como los buscadores leen ese significado.
Lo que deberías saber
- Si haces clic en ello, es un button; si te lleva a algún sitio, es un a
- Orden de los encabezados: h1 → h2 → h3
- Elementos landmark
Recursos
Formularios· Esencial
Los escribirás en casi cualquier trabajo. label, los tipos de input y la validación integrada del navegador te ahorran escribir mucho JavaScript.
Lo que deberías saber
- Asociar un label con su input
- Tipos de input: email, number, date…
- required, pattern, min/max
Recursos
Accesibilidad· Esencial
Una página por la que se puede navegar con el teclado y que se puede leer con un lector de pantalla. Nadie espera que un junior sea experto, pero sí que conozca lo básico.
Lo que deberías saber
- Texto alternativo
- Orden del foco con el teclado
- Contraste de color
- Usar aria solo cuando de verdad lo necesites
Recursos
Fundamentos de SEO· Recomendable
title, description, estructura de encabezados y URLs con sentido. Si escribes bien el HTML semántico, ya tienes la mitad hecha.
Recursos
CSS· Esencial
Convertir un diseño en código. Aunque uses Tailwind, por debajo hay CSS: si no entiendes el modelo de caja y el layout, también te atascarás con Tailwind.
Lo que deberías saber
- Selectores y especificidad
- Unidades: px, rem, %, vw
- Herencia y cascada
Recursos
Modelo de caja· Esencial
Cada elemento es una caja: contenido, padding, borde y margen. La mayoría de los errores de layout vienen de aquí.
Lo que deberías saber
- box-sizing: border-box
- Colapso de márgenes
- display: block, inline, inline-block
Recursos
Flexbox· Esencial
Alineación a lo largo de un eje. La mayoría de los layouts que escribirás hoy son flexbox.
Recursos
Grid· Esencial
Layout en dos ejes. Para cuadrículas de tarjetas y esqueletos de página es mucho más sencillo que flexbox.
Recursos
Diseño responsive· Esencial
La misma página, desde un móvil hasta una pantalla ancha. Escribir con enfoque mobile-first ya no es una preferencia: es lo habitual.
Lo que deberías saber
- Media queries
- El enfoque mobile-first
- Unidades flexibles y clamp()
Recursos
Tailwind CSS· Recomendable
Está en la mayoría de las ofertas y, si sabes CSS, lo aprenderás en una semana. El orden importa: primero CSS, después Tailwind.
Recursos
JavaScript· Esencial
La parada más importante del mapa. La mayoría de quienes se atascan en React en realidad están atascados en JavaScript. No te apresures con este.
Lo que deberías saber
- Variables, tipos, funciones
- Condicionales y bucles
- Objetos y arrays
Recursos
Sintaxis moderna· Esencial
Cosas que verás en cada línea de código de React. Si no puedes leerlas con soltura, React se te hará difícil.
Lo que deberías saber
- let / const, arrow functions
- Desestructuración y spread
- Template literals
- Optional chaining (?.) y ??
Recursos
Métodos de arrays· Esencial
map, filter, reduce, find. Así se renderizan listas y se transforman datos en React.
Recursos
El DOM y los eventos· Esencial
React hace esto por ti, pero deberías hacerlo a mano primero para entender qué problema resuelve realmente React.
Lo que deberías saber
- Seleccionar y modificar elementos
- addEventListener
- Propagación de eventos (bubbling) y delegación
Recursos
JavaScript asíncrono· Esencial
Obtener datos, esperarlos y capturar errores. El tema favorito de quienes entrevistan.
Lo que deberías saber
- Callback → Promise → async/await
- Obtener datos con fetch
- Gestionar errores con try/catch
- A grandes rasgos, qué es el event loop
Recursos
Scope y closures· Esencial
Módulos· Esencial
import / export. Así se conectan entre sí los archivos de cualquier proyecto moderno.
Recursos
02Herramientas
Git y GitHub· Esencial
Lo usarás desde el primer día. Guardar tu código, crear branches, hacer merge y compartir con tu equipo. Tu portafolio también vive aquí.
Recursos
Commits e historial· Esencial
add, commit, status, log, diff. Hacer commits pequeños que signifiquen algo cada uno.
Recursos
Branches y merge· Esencial
Crear branches, fusionarlas y resolver conflictos. No tenerles miedo a los conflictos es una habilidad en sí misma.
Recursos
Pull requests· Esencial
Así se integra el código en un equipo. Abrir un PR, escribir una descripción y responder a los comentarios de la revisión.
Recursos
Entorno de desarrollo· Esencial
Las herramientas con las que configuras un proyecto, lo ejecutas y localizas errores.
npm / pnpm· Esencial
Instalar paquetes, leer package.json y ejecutar scripts.
Lo que deberías saber
- La diferencia entre dependencies y devDependencies
- npm run dev / build
- Por qué existe el lock file
Recursos
Vite· Esencial
La forma habitual hoy de empezar un proyecto de React. Basta con saber a grandes rasgos qué hace una herramienta de build.
Recursos
DevTools del navegador· Esencial
ESLint y Prettier· Recomendable
Dejar que una herramienta zanje las discusiones sobre estilo de código. La mayoría de los proyectos ya los traen configurados: basta con saber para qué sirven.
Recursos
03Framework
React· Esencial
Está en casi todas las ofertas de frontend junior en Turquía. Vale la pena leer la documentación oficial de react.dev de principio a fin.
Recursos
Componentes y JSX· Esencial
Dividir la interfaz en piezas pequeñas y reutilizables.
Lo que deberías saber
- Las reglas de JSX
- Pasar datos con props
- Renderizado condicional y listas (key)
Recursos
Estado y eventos· Esencial
Interactividad con useState. La verdadera habilidad es decidir dónde debe vivir cada pieza de estado.
Lo que deberías saber
- useState
- Elevar el estado (lifting state up)
- Inputs de formulario controlados
Recursos
Efectos· Esencial
Otros hooks· Esencial
useRef, useMemo, useContext y cómo escribir tus propios hooks.
Recursos
Routing· Esencial
Apps con más de una página. React Router o el routing propio de tu framework.
Recursos
Estado global· Recomendable
Con Context basta la mayoría de las veces. Si ves Zustand o Redux en una oferta, entiende la idea; no hace falta memorizar la API.
Recursos
TypeScript· Esencial
Está en casi todas las ofertas hoy en día, y la mayoría de los proyectos nuevos empiezan con TypeScript. Nadie espera acrobacias avanzadas con tipos: lo que cuenta es el uso cotidiano.
Recursos
Tipos básicos· Esencial
type e interface· Esencial
Describir la forma de tus datos. Saber escribir un tipo para la respuesta que devuelve una API.
Recursos
TypeScript con React· Esencial
Tipos de props, de estado y de eventos. Es la mayor parte del trabajo del día a día.
Recursos
Generics· Recomendable
Con saber leerlos es suficiente. Nadie espera que un junior escriba sus propios tipos genéricos.
Recursos
Trabajar con APIs· Esencial
Gran parte del trabajo de frontend consiste en mostrar datos que vienen de una API y enviarle datos de vuelta. No se trata de escribir el backend, sino de comunicarte con él.
REST y JSON· Esencial
Endpoints, métodos, cuerpos de solicitud, respuestas en JSON. Probar una API con Postman o una herramienta similar.
Recursos
Carga y errores· Esencial
¿Qué muestras mientras llegan los datos y qué pasa cuando llega un error? Lo que más se saltan los proyectos junior.
Lo que deberías saber
- Estados de carga, error y vacío
- Cancelar una solicitud
- Mensajes de error que de verdad signifiquen algo para el usuario
TanStack Query· Recomendable
Se encarga por ti de obtener datos, de la cache y de los reintentos. Aparece mucho en las ofertas.
Recursos
Cómo funciona la autenticación· Recomendable
Qué es un token, qué es una cookie y cómo puedes saber que un usuario ha iniciado sesión. No para construirla, sino para entenderla desde el lado del frontend.
Recursos
04Listo para trabajar
Next.js· Recomendable
Apréndelo después de React, no antes. Está en una buena parte de las ofertas; entender por qué existe el renderizado en el servidor es un buen punto de partida.
Recursos
Routing basado en archivos· Recomendable
SSR, SSG, CSR· Recomendable
Dónde y cuándo se genera una página. Conocer los conceptos te ayuda mucho en las entrevistas.
Recursos
Testing· Recomendable
Nadie espera que un junior tenga una estrategia de testing; sí que sepa escribir un test sencillo de un componente y entender por qué se escriben tests.
Vitest· Recomendable
Testing Library· Recomendable
Un proyecto real· Esencial
Prefiero ver a un junior que sepa explicar por qué eligió cada tecnología en un proyecto real que un CV con 15 frameworks. Hacia aquí te lleva toda la hoja de ruta.
Lo que deberías saber
- No una app de tareas, sino un proyecto que resuelva un problema real
- Uno que obtenga datos de una API real y gestione los estados de carga y de error
- Uno que se vea bien en móvil y funcione con teclado
Despliegue· Esencial
Si tu proyecto no se abre en una URL, es como si no existiera. Con Vercel, Netlify o Cloudflare Pages lleva unos minutos.
Recursos
README· Esencial
Qué hace el proyecto, cómo ejecutarlo y por qué tomaste las decisiones que tomaste. Es el primer archivo que lee un reclutador, y a menudo el único.
Explicar tus decisiones· Esencial
«¿Por qué Zustand?», «¿Por qué esta estructura de carpetas?». Lo que una entrevista mide en realidad es cómo respondes a preguntas como estas.
05Cosas que puedes aprender después
Cómo funciona el backend· Más adelante
Entender el backend es muy útil para un desarrollador frontend. Pero escribir APIs y montar bases de datos y autenticación es un trabajo full-stack.
Node.js· Más adelante
Escribir una API sencilla y conectarle tu frontend te abrirá los ojos. No es obligatorio para un puesto de frontend junior.
Recursos
GraphQL· Más adelante
Si tu empresa lo usa, lo aprenderás en una semana. Conocer REST va primero.
Recursos
Infraestructura· Más adelante
Normalmente hay alguien en el equipo que se encarga de esto. Lo que se espera de ti es que sepas usar lo que ya existe.
Docker· Más adelante
Ejecutar un proyecto en un contenedor. Para empezar basta con poder leer un Dockerfile existente.
Recursos
CI/CD· Más adelante
Tests que se ejecutan en cada push y un deploy en cada merge. En tu primer trabajo lo encontrarás ya configurado.
Recursos
Cloud· Más adelante
AWS, GCP, Azure. En frontend suele reducirse a una CDN y hosting estático.
Arquitectura· Más adelante
Arquitectura, escalabilidad, code review, mentoring. Esto llega con la experiencia; si lo ves en una oferta junior, probablemente se ha mezclado algo.
Escalabilidad· Más adelante
Mantener manejable un código base que crece. Antes tienes que haber trabajado en un código base grande.
Rendimiento avanzado· Más adelante
Core Web Vitals, análisis del bundle, optimización del renderizado. Basta con un sentido común básico del rendimiento; el resto lo aprenderás trabajando.
Recursos