Esta clase pertenece al curso de reclutamiento IT. Partiremos desde la clase anterior. Te aconsejo que hagas el curso de forma secuencial, y en caso de que estés perdido/a, puedes acceder al índice del curso aquí.
En esta clase, aprenderemos qué es el desarrollo web en entorno cliente, qué lenguaje de programación es el más usado por excelencia con este fin (JavaScript) y hablaremos sobre distintos conceptos básicos relacionados con JavaScript que tienes que tener claro antes de que avancemos a estudiar los frameworks y librerías de JavaScript. Por supuesto, todo explicado de forma sencilla para IT Recruiters, que no tenéis que tener ni es necesario que tengáis formación técnica en tecnología.
JavaScript
Lo primero que hemos de aclarar, que aunque JavaScript se puede usar en el servidor (ya llegaremos a eso), en esta clase vamos a hablar de JavaScript usado en entorno cliente. Y es que JavaScript es la lengua franca del desarrollo web en entorno cliente. ¿Qué es el entorno cliente? Ni más ni menos que mi navegador. Si quieres saber más sobre qué es un entorno cliente y sobre la arquitectura cliente-servidor sobre la que está desarrollada el Internet actual, puedes consultarlo en esta clase perteneciente a este mismo curso.
Es importante que tengas muy claro qué hacen HTML y CSS para comprender qué hace JavaScript. Puedes repasar HTML y CSS en la anterior clase de este mismo curso. Pues bien, sigamos con la metáfora del edificio: HTML son los cimientos del edificio, la estructura, las paredes etc. CSS es el diseño de tu casa: la has pintado, le has puesto muebles, les has puesto cuadros etc. Genial: ahora tenemos un edificio construido y con pisos decorados. Magnífico. Sólo tengo un problema: no puedo interactuar con estos pisos: la puerta no se abre, si le doy al timbre para llamar a un determinado piso no funciona, no hay electricidad etc. ¡Nadie se metería a vivir ahí! Pues el lenguaje por excelencia del desarrollo web en entorno cliente, es decir, JavaScript te soluciona ese problema: JavaScript dota de interactividad a las páginas/aplicaciones web. HTML te ofrece estructura web, CSS diseño web y JavaScript (o JS) interactividad.
Por cierto, escucharás con cierta frecuencia el término Vanilla JavaScript. Esto no es otra cosa que utilizar JavaScript a pelo, sin usar ninguna librería o framework.
¿Son lo mismo Java y JavaScript?
Esta es una de las preguntas más repetidas entre los IT Recruiters más juniors. Lo cierto es que no tienen mucho que ver, son dos lenguajes de programación muy distintos. Ahora bien, si son tan distintos… ¿por qué tienen un nombre parecido?
Por simplificar mucho la historia, te contaré que en 1995, cuando Netscape Navigator (uno de los dos grandes navegadores web de la época, el otro era Internet Explorer) agregó compatibilidad con la tecnología Java en su navegador, JavaScript estaba en desarrollo. Primero se llamó Mocha, unos meses más tarde LiveScript y, posteriormente, JavaScript. Se le llamó así porque la idea era que JavaScript fuera un lenguaje complementario en entorno cliente de lo que es Java en entorno servidor. Y, ciertamente, es algo que se ha conseguido. ¿O cuántos perfiles reclutas tú con el front en Angular o React y el backend en Java? Pues eso.
¿Qué es el ECMAScript?
Es posible que, reclutando, alguna vez hayas oído eso de: «que tenga x experiencia con JavaScript, que sea reciente, y que además maneje del ECMAScript 6 en adelante«. Perfecto. Otro nombre de otro «posible lenguaje de programación» que se parece a JavaScript. Otra forma fácil de liarse. Pero para eso estoy yo aquí, para que no te lies. Pues bien, ¿qué es el ECMAScript? El ECMAScript no es ni más ni menos que el estándar de JavaScript para asegurarse de que las páginas web funcionan bien en los distintos navegadores. Esto es importante porque JavaScript es un lenguaje de programación interpretado, es decir, que una vez que el código es enviado del servidor al cliente (el navegador), nuestro navegador lee cada línea de código y la interpreta y la ejecuta, ofreciéndonos como resultado el poder interactuar con las páginas/aplicaciones web. Es importante que los navegadores sepan qué tipo de código de JavaScript pueden recibir, y para eso sirve el ECMAScript.
Digamos que el ECMAScript es a JavaScript algo así como la Real Academia Española (RAE) al castellano: cada uno habla castellano como quiere, pero hay unas normas ortográficas, de sintaxis etc. que marca la RAE, para asegurar que todos nos podamos entender de forma adecuada. El mes pasado, en Junio de 2021, salió la última versión (en el momento en que escribo esto) de ECMAScript, el ECMAScript 12 (ES12 o ES2021).
¿Qué es TypeScript?
Como IT Recruiter, estarás observando que cada vez más se demanda TypeScript (TS). ¿Por qué y qué tiene que ver TypeScript con JavaScript? JavaScript tiene un gran problema y es que no permite decirle al ordenador de forma explícita cómo tiene que tratar un dato, de qué tipo es. Por ejemplo, si yo le digo al ordenador con mi programa que procese que en España hace 40º de temperatura… ¿Ha de interpretar 40º como un número o como una cadena de caracteres-como letras-, para simplificar? Esto, que parece una tontería, es fuente de mil y un problemas.
Imagínate que estás desarrollando con el lenguaje por excelencia de desarrollo web en entorno cliente, o sea, JavaScript, una aplicación muy grande, que utiliza muchos datos. Pero, tú no puedes decir de forma explícita al PC qué tipo de dato es, cómo quiere que lo trate. Pues vas a tener muchos errores y te va a costar tiempo saber de dónde vienen, porque el ordenador no te indica dónde te estás equivocando. Esto en aplicaciones grandes, dónde trabajan muchos desarrolladores y dónde tú no tienes por qué haber tocado nunca el código que desarrolla otra persona del equipo es un problema. Y para el desarrollador que venga dentro de dos años a hacer cosas en el proyecto y que no conozca siquiera al que desarrolló un determinado código del programa que está fallando y que no le pueda preguntar, mucho más.
Pues esto te lo soluciona TypeScript (TS). TypeScript es un lenguaje de programación lanzado por Microsoft en 2012 que es un superset o un superconjunto de JavaScript. Si te gustan los videojuegos, sería el equivalente a una extensión. Es decir: es JavaScript pero sumándole la posibilidad de poder decirle al ordenador cómo quiero que trate mis tipos de dato (a grosso modo). Y esto permite que si hay un problema en el tratamiento de los datos, el ordenador me lo indique directamente y no tenga que perder horas y horas buscando por qué falla el programa aunque el ordenador no me muestre ningún fallo. Se utiliza por excelencia en aplicaciones grandes, al facilitar la escalabilidad y el mantenimiento del proyecto. Y, además, se usa con Angular, cada vez se usa más con React etc. Digamos que vivimos en un momento dónde TypeScript es cada vez más y más adoptado por los desarrolladores y las empresas, por todas las ventajas que ofrece.
¿Qué es AJAX?
AJAX (Asynchronous JavaScript and XML) es un conjunto de técnicas que se utilizaban (y aún se utilizan) con JavaScript para realizar peticiones asíncronas al servidor. Para comprender esto hemos de entender un par de conceptos:
- El código es la forma en la que yo como programador le digo al ordenador qué es lo que tiene que hacer, porque como ya hemos visto en clases anteriores, el ordenador sólo ejecutará lo que yo le diga, no lo que yo le quiero decir (puedo quererle decir por ejemplo que tras x tiempo haga una determinada cosa, pero escribir el código mal y que haga otra cosa completamente distinta). El ordenador lee el código que yo le he escrito de arriba a abajo, y va ejecutando de forma secuencial las instrucciones que yo le he escrito.
- ¿Qué ocurre si por ejemplo estoy desarrollando una aplicación de tipo meteorológico y le digo al ordenador a través del código «envíame a esta API (esto ya veremos qué es más adelante, por ahora piensa que es como un intermediario) una petición para que me devuelva (ya la API se encargará de cómo obtener los datos, de eso yo me despreocupo) la previsión meteorológica en un determinado lugar en los próximos tres días«? Recuerdas que el código se lee de arriba a abajo, ¿no? Esta petición realmente no depende de mí, sino de la API, así que no sé cuándo tendré los datos sobre la información meteorológica de los próximos tres días (que cuando la tenga la mostraré en pantalla para ofrecérsela al usuario). La API me puede dar la información en 300ms, en 2 segundos o nunca porque esté el servidor caído. Si el ordenador sigue leyendo el código de arriba a abajo tengo un problema: hasta que no me devuelva la información meteorológica la API, estoy bloqueando la ejecución de mi programa-la lectura del código de arriba a abajo (porque estoy usando código síncrono, que sólo avanza cuando tiene una respuesta)-, y en caso de que por algún problema jamás me llegue dicha información estoy bloqueando mi programa de forma indefinida. Mal asunto, porque como te podrás imaginar, una aplicación que no está funcionando o que funciona mal supone una pérdida de dinero para el propietario de la misma, ya que no puede ofrecer su producto o servicio de forma adecuada.
¿Cómo me ayuda la asincronía a no bloquear mis programas?
Pues de una forma muy sencilla. Si la aplicación no es asíncrona, como hemos visto, es muy fácil que la aplicación se bloquee, o tarde en cargar los datos etc. Sin embargo, la asincronía, explicada de forma sencilla sería lo siguiente: «Envíame a la API la petición para que me devuelva la información meteorológica de los próximos tres días y cuando tengas esa información, la pinto en pantalla, pero mientras tanto, sigue leyendo la siguiente línea del programa«. Es decir, una aplicación asíncrona ejecuta el código de nuestro programa de forma no bloqueante. De esta forma, optimizamos el funcionamiento de nuestro programa y no lo bloqueamos.
AJAX como IT Recruiter te lo vas a encontrar, por supuesto, pero has de saber que es algo obsoleto y que cada vez se usa menos (se usa precisamente en proyectos antiguos, y con antiguo me refiero fácilmente a proyectos que utilizan tecnologías de 2010 por ejemplo). En la actualidad, JavaScript tiene otras formas de implementar la asincronía en el código mucho más limpias que, en general, no te las van a pedir como característica al reclutar, ya que se dan por hechas cuando reclutas a alguien para perfiles como Angular o React (frameworks y librerías de JavaScript, ya lo veremos en las próximas clases).
En el caso de AJAX es un poco distinto, ya que AJAX se utiliza con Vanilla JavaScript, sin utilizar ninguna librería o framework (AJAX es de esa época en la que no existían librerías ni frameworks de JavaScript, de hecho AJAX se lanzó en 1999).
Índice del curso
Recuerda que para seguir nuestro curso de Reclutamiento IT sólo tienes que ir al índice y seguir por la clase de tu interés. ¡Feliz aprendizaje!
Si tienes dudas, recuerda que puedes preguntarle a la comunidad con el hashtag #SoySalvajeReclutamientoIT en Twitter y que puedes contactar con nosotros (aunque no me comprometo a responder por falta de tiempo, aunque responderé si puedo) por Twitter, Instagram o por nuestro formulario. Por supuesto, recuerda que si quieres que te ayudemos a crecer como profesional de forma más personalizada, no dudes en consultar nuestros servicios. Y si estás pensando en comprar algún producto relacionado con informática, no dudes en consultar nuestras recomendaciones en la sección Productos. Nos vemos en la siguiente clase.