Artículos de Tecnología > Front End

Roadmap para principiantes en JavaScript

Marianna Costa
Marianna Costa
banner

¿Qué es JavaScript?

Antes de presentar el Roadmap de sus estudios de JavaScript, es importante comprender qué es y con qué fines podemos usarlo. JavaScript (o, para abreviar, JS) es un lenguaje de programación dinámico de alto nivel que se utiliza principalmente para el desarrollo web front-end.

¿Para qué sirve?

JavaScript te permite hacer una infinidad de cosas increíbles. Utilizando JS es posible, por ejemplo, promover la interacción de una página web con el usuario que la usa. Cuando nos encontramos con un sitio web que tiene contenido que se actualiza durante un período de tiempo, que tiene formularios interactivos, botones e imágenes, o incluso animaciones, es posible concluir que JS probablemente esté involucrado en la construcción de esta página. Corre junto con otros lenguajes de desarrollo web, como: HTML y CSS. Además de crear páginas web, puede usar JS para desarrollar aplicaciones, desarrollar juegos e incluso servidores backend.

¿Dónde está presente JS y cómo se comporta en el mercado laboral?

Hay varias empresas con sitios web famosos que utilizan recursos de JavaScript. Algunas de ellas son: Amazon, Facebook, Google, LinkedIn, Netflix, YouTube, y una multitud de otros sitios web. En el mercado laboral, JS tiene una gran reputación, como uno de los lenguajes más versátiles de la actualidad. Se considera el lenguaje web más popular del mundo, y no se limita al front-end. En otros segmentos de desarrollo también es posible utilizar este lenguaje, como por ejemplo: en back-end con NodeJS, para crear juegos, e incluso inteligencias artificiales para crear y capturar imágenes y textos de forma dinámica. Esta versatilidad se refleja en la cantidad de puestos de trabajo disponibles para desarrolladores de JavaScript en el mercado laboral actual. Haz una búsqueda en tu LinkedIn de estas vacantes, ¡seguro que te animará con muchas oportunidades!

¿Dónde puedo programar en JS? ¿Qué necesito saber para aprender?

Puedes programar en JS utilizando cualquier editor de texto compatible con el lenguaje. Recomendamos los editores de texto VS Code, Sublime Text y Atom. Puede obtener más información sobre estos editores de texto haciendo clic aquí. Para aprender JS no es necesario haber aprendido previamente a programar, es un lenguaje muy amigable para principiantes, favoreciendo la comprensión de la lógica de programación, base fundamental para aprender a programar. Conoce más sobre por qué JavaScript es uno de los mejores lenguajes para principiantes en programación, haciendo clic aquí.

Por último, cabe mencionar que para trabajar bien con JS, es interesante tener conocimientos básicos de HTML y CSS. Puedes encontrar cursos sobre estos lenguajes aquí en Alura Latam.

Entonces, ¿estás interesado en estudiar JavaScript? ¡Vamos con tu Roadmap de estúdios!

¿Qué es un Roadmap?

Empecemos con una pequeña contextualización: El Roadmap (hoja de ruta) es un tipo de mapa que permite organizar las tareas a realizar para un determinado objetivo. En este caso, tu objetivo es aprender JavaScript, por lo que este Roadmap será tu guía, conteniendo todos los temas, en orden, que debes estudiar para pasar de lo básico a lo avanzado en este lenguaje de programación.

¿Vamos? Para construir una buena base de conocimientos que te permita avanzar en tus estudios, es bueno saber, inicialmente:

TemaAsunto
Estructuras del lenguajeExpresiones, tipos de datos, variables, comentarios.
Condicionales y LoopsIf, While, For, Switch, Do While.
FuncionesQué son las funciones y sus tipos.
Otros recursosRecursividad, Rest y el operador Spread, setTimeout, setInterval, Decorators, Forwarding, Call, Apply y bind.
Operadores y conversión de tiposmatemáticos, lógicos, de comparación, de asignación, relacionales y conversión de tipos.
ArraysMap, Filter, Reduce, Push, Pop, Slice, Sort, Splice, Shuffle, Shift, Unshift.
JSONMétodos JSON, toJSON, Stringify, Parse.
ObjetosReferencia a objetos, Garbage collection, This, constructores, operador New, objeto Dates, objeto Math.
EventosEventos del navegador, Bubbling y Capturing, delegación de eventos, acciones estándar, Dispatching, eventos personalizados.
Eventos del ratónMouseover, Mouseout, Mouseenter, Mouseleave, Drag and drop, eventos del cursor, Scrolling.
Eventos del tecladoKeydown, Keyup, Keypress, Keycode.
Manipulación del DOM - Conceptos básicosÁrbol DOM, navegación por el DOM, propiedades getElement, querySelector, propiedades del nodo.

A partir de aquí, una vez entendidos los conceptos anteriores, podrá pasar a los asuntos de nivel intermedio:

TemaAsunto
Manipulación del DOM - IntermedioEstilos y clases, tamaños de elementos, tamaño de ventanas, coordenadas, Popups, desplazamiento.
Otros temas intermedioseditores de código, consola, calidad del código, depuración, normas de código, Polyfills, Transpilers.
Animaciones en JavascriptWeb Animation API, Canvas, Sprite Sheets, SVG.
Programación asíncrona y CallbacksTimers, Promises, Async y Await, AJAX, eventos. Interacciones, arrays, template Literals, strict Mode.
FormulariosPropiedades y métodos, enfoque: focus/blur, eventos: change, input, copiar y pegar, eventos del formulario, método Submit.
Programación funcionalDefer y Async, CORS, Closures, expresiones regulares, Unicode, estructura de datos, Map Data Structure, Set Data Structure.

Ha llegado el momento de dar otro gran paso en tu camino como dev. A partir de aquí, ya tendrá un gran y amplio conocimiento en JS, pudiendo aprovechar tus estudios con conocimientos avanzados:

TemaAsunto
Almacenamiento de datos y APICookies, LocalStorage, History API, Fetch, Cache, Service Workers, IndexedDB.
Archivos y datos binariosArrayBuffer, TextDecoder, TextEncoder, Blob, File y FileReader, FormData*.
Solicitudes de redFetch API, FormData, Cross-Origin Requests, objetos URL, XMLHttpRequest, File Upload, Long polling, WebSocket.
MódulosImport y Export, importación dinámica, Generators.
ClasesSintaxis básica, herencia, propiedades estáticas, métodos públicos, métodos privados, Instanceof Mixins.
Manejo de erroresTry Catch, Throw, error de objeto, errores personalizados y pruebas automatizadas.

Conclusión

A lo largo de este artículo hemos explorado las principales ideas y conceptos de JavaScript, un lenguaje de programación que abre muchos caminos en el area de la programación y sobre todo de la tecnología. Si estás interesado en seguir carrera en el desarrollo front-end, a partir de aquí es interesante empezar tu jornada de estudios sobre los frameworks.

En la plataforma de Alura Latam encontrarás formaciones en dos frameworks que trabajan conjuntamente con JS para el front-end: React y Angular, que forman parte de nuestra formación front end. Disfruta de este Roadmap lleno de contenido, sigue adelante con tus estudios y no dudes que, siguiendo estos pasos, te convertirás en un profesional capaz de intentar tus primeros trabajos como dessarrollador en JavaScript. Sumérgete en JavaScript y en la tecnología!

Sobre las autoras:

foto-mari

Marianna Costa

Brasileña, estudiante de Ingeniería Informática y formo parte del Scuba Team en Alura Latam. Amante de la tecnología desde siempre, me enamoré del desarrollo front end hace dos años. Soy muy curiosa y siempre estoy interesada en aprender sobre los diversos asuntos, me encanta compartir y recibir conocimiento porque creo firmemente que "compartir conocimiento es lo mismo que difundir desarrollo".

foto-rafa

Rafaela Rocha:

Soy Rafa, una de las Scubas Front-End aquí en Alura LATAM. Soy Técnico en Computación, apasionada por la programación y el área de tecnología. Siempre dispuesta a aprender cada día más en esta área que sigue creciendo.

Artículos de Tecnología > Front End

En Alura encontrarás variados cursos sobre Front End. ¡Comienza ahora!

Semestral

  • 194 cursos

    Cursos de Programación, Front End, Data Science, Innovación y Gestión.

  • Videos y actividades 100% en Español
  • Certificado de participación
  • Estudia las 24 horas, los 7 días de la semana
  • Foro y comunidad exclusiva para resolver tus dudas
  • Acceso a todo el contenido de la plataforma por 6 meses
US$49,90
un solo pago de US$49,90
¡QUIERO EMPEZAR A ESTUDIAR!

Paga en moneda local en los siguientes países

Anual

  • 194 cursos

    Cursos de Programación, Front End, Data Science, Innovación y Gestión.

  • Videos y actividades 100% en Español
  • Certificado de participación
  • Estudia las 24 horas, los 7 días de la semana
  • Foro y comunidad exclusiva para resolver tus dudas
  • Acceso a todo el contenido de la plataforma por 12 meses
US$79,90
un solo pago de US$79,90
¡QUIERO EMPEZAR A ESTUDIAR!

Paga en moneda local en los siguientes países

Acceso a todos
los cursos

Estudia las 24 horas,
dónde y cuándo quieras

Nuevos cursos
cada semana