👨🏼‍💻

khriztianmoreno's Blog

Inicio Etiquetas Acerca |

Posts with tag programming

Predicciones 🧞‍♀️💻 2024

2023-12-04
programmingweb-developmentdiscuss

Algunos puntos que deberías prestar atención para este año 2024 que seguro tendrán un alto impacto en el ecosistema tecnológico.Bun logra su objetivo de convertirse en el runtime predeterminado para frontend: Todavía tienen algunos obstáculos que superar, pero si logran proporcionar un reemplazo directo para Node que mejore instantáneamente el rendimiento de su aplicación 10 veces, será una opción obvia para la mayoría de los desarrolladores. El lanzamiento v1.0 de septiembre pasado fue un paso importante hacia la compatibilidad y la estabilidad general de Windows, y la apuesta es a que Bun comience a convertirse en la opción predeterminada este año.La IA reemplazará las herramientas no-code/low-code: Resulta que la IA es mucho mejor y más rápida a la hora de crear paneles de análisis de marketing. Herramientas como Basedash y 8base ya utilizan IA para crear un conjunto completo de requerimientos, herramientas internas personalizadas, y surgirán otras para reemplazar a los builders de arrastrar y soltar para crear sitios que no dependan en gran medida de la lógica empresarial.Netlify es adquirida por GoDaddy: Con múltiples rondas de despidos, 2023 claramente no fue el mejor año para Netlify. Pero a veces la mejor manera de recuperarse es buscarse un nuevo ~~sugar daddy~~, GoDaddy. Después de retirar la marca Media Temple hace unos meses, parece que GoDaddy podría volver al mercado de adquisiciones para una plataforma como Netlify.Alguna otra que se te ocurra? Ayudame actulizar este post!!Profile@khriztianmoren

Clonar un objeto en JavaScript - 4 mejores formas [Ejemplos]

2023-06-18
javascriptprogrammingweb-development

Clonar un objeto en JavaScript significa crear una copia idéntica de un objeto existente. Esto significa que el nuevo objeto tendrá los mismos valores para cada propiedad, pero será un objeto diferente.¿Por qué es importante clonar un objeto en javascript?Clonar un objeto en javascript es importante para preservar el estado original de un objeto y evitar la propagación de los cambios. Esto es especialmente útil cuando hay varias instancias de un objeto que se comparten entre varias partes de la aplicación. Clonar el objeto original garantiza que las otras instancias no se vean afectadas por los cambios realizados en el objeto original. Esto también permite a los desarrolladores usar una sola instancia del objeto y crear una copia única para cada parte de la aplicación. Esto evita tener que crear cada vez una nueva instancia del objeto, lo que ahorra tiempo y recursos.¿Cómo clonar un objeto?Para clonar un objeto JavaScript correctamente, tienes 4 opciones diferentes:Usar la función structuredClone()Usar el spread operatorLlamar la función Object.assign()Usar JSON parsing.const data = { name: "khriztianmoreno", age: 33 }; // 1 const copy4 = structuredClone(data); // 2 const copy1 = { ...data }; // 3 const copy2 = Object.assign({}, data); // 4 const copy3 = JSON.parse(JSON.stringify(data));1. structuredClone()Crea un clon profundo de un valor dado utilizando el algoritmo de clonación estructurada.const original = { someProp: "with a string value", anotherProp: { withAnotherProp: 1, andAnotherProp: true, }, }; const myDeepCopy = structuredClone(original);2. spread operatorEl operador de propagación (...) permite expandir un objeto o un arreglo en una lista de elementos individuales, y se utiliza para crear una copia de un objeto.const original = { name: "khriztianmoreno", age: 33 }; const clone = { ...original };En el ejemplo anterior, se esta creando un nuevo objeto clone a partir de los valores del objeto original, es importante notar que esto solo hace una copia superficial, si el objeto original contiene objetos o arreglos dentro de el, estos no serán clonados sino que se asigna la referencia del objeto original.También se puede utilizar para clonar arreglos de la siguiente manera:const original = [1, 2, 3, 4]; const clone = [...original];3. Object.assignLa función Object.assign() es otra forma de clonar objetos en JavaScript. La función toma un objeto destino como primer argumento, y uno o más objetos fuente como argumentos adicionales. Copia las propiedades enumerables de los objetos fuente al objeto destino.const original = { name: "khriztianmoreno", age: 33 }; const clone = Object.assign({}, original);4. JSON parsingEl método JSON.parse() y JSON.stringify() es otra forma de clonar objetos en JavaScript. El método JSON.stringify() convierte un objeto en una cadena de texto en formato JSON, mientras que el método JSON.parse() convierte una cadena de texto en formato JSON en un objeto de JavaScript.const original = { name: "khriztianmoreno", age: 33 }; const clone = JSON.parse(JSON.stringify(original));ConclusionesVentajas de clonar un objeto en javascriptEl clonado de objetos permite al desarrollador crear una copia de un objeto existente sin tener que redefinir todos los valores del objeto. Esto significa que el desarrollador puede ahorrar tiempo y esfuerzo al no tener que recrear un objeto desde cero.El clonado de objetos también permite al desarrollador crear una versión modificada de un objeto existente. Por ejemplo, un desarrollador puede modificar los valores de un objeto existente para crear una versión personalizada. Esto es útil para ahorrar tiempo al no tener que reescribir el código para crear un objeto desde cero.El clonado de objetos también permite al desarrollador crear una versión mejorada de un objeto existente. Por ejemplo, un desarrollador puede añadir nuevas propiedades a un objeto existente para mejorar su funcionalidad.El clonado de objetos también ofrece una forma de hacer copias de seguridad de los objetos. Esto significa que si el objeto existente se ve afectado por una falla de software, el desarrollador puede recurrir a la copia de seguridad para recuperar los valores originales.Desventajas de clonar un objeto en javascriptClonar un objeto en Javascript puede ser una tarea útil, pero también hay algunos inconvenientes que deben tenerse en cuenta. El primero es el tiempo de ejecución. El clonado de objetos en Javascript puede ser un proceso lento, especialmente si el objeto es grande. Esto puede llevar a una mala experiencia de usuario si se está intentando clonar un objeto mientras se ejecuta una aplicación.Otra desventaja del clonado de objetos en Javascript es que no se pueden clonar objetos complejos. Esto significa que los objetos que contienen referencias a otros objetos no se pueden clonar correctamente. Esto puede ser un problema si se está intentando clonar un objeto que contiene referencias a otros objetos importantes, ya que el clon no tendrá estas referencias.Por último, el clonado de objetos en Javascript también puede llevar a problemas de seguridad si se clonan objetos que contienen información sensible. El clon puede contener la misma información que el objeto original, lo que puede ser un riesgo para la seguridad si se comparte el clon con otros usuarios.¡Eso es todo amigxs! ¡Espero que este artículo lo ayude a comprender las diferentes opciones que tenemos a la hora de clonar un objecto/arraglo en javascript.Profile@khriztianmorenoHasta la próxima.PD: Este articulo fue escrito completamente usando Inteligencia Aritifcia

Cómo usar los métodos Call, Apply y Bind en javascript

2023-05-12
javascriptweb-developmentprogramming

En este artículo, veremos qué son los métodos call, apply y bind en javascript y por qué existen.Antes de saltar, necesitamos saber que es this en javascript, en este post puedes profundizar un poco más.Call, Apply and BindEn Javascript, todas las funciones tendrán acceso a una palabra clave especial llamada this, el valor de this apuntará al objeto en el que se ejecuta esa función.¿Qué son estos métodos call, apply y bind?Para decirlo de una manera simple, todos estos métodos se usan para cambiar el valor de this dentro de una función.Entendamos cada método en detalle.call()Usando el método call, podemos invocar una función, pasando un valor que será tratado como this dentro de ella.const obj = { myName: "khriztianmoreno", printName: function () { console.log(this.myName); }, }; obj.printName(); // khriztianmoreno const newObj = { myName: "mafeserna", }; obj.printName.call(newObj); //mafesernaen el ejemplo anterior, estamos invocando el método call en la función printName al pasar newObj como parámetro, por lo que ahora this dentro de printName apunta a newObj, por lo tanto, this.myName imprime mafeserna.¿Cómo pasar argumentos a funciones?El primer argumento del método call es el valor al que apunta this dentro de la función, para pasar argumentos adicionales a esa función, podemos comenzar a pasarlo desde el segundo argumento del método call.function foo(param1, param2) {} foo.call(thisObj, arg1, arg2);dónde:foo es la función que estamos invocando al pasar el nuevo valor this que es thisObjarg1, arg2, son los argumentos adicionales que tomará la función foo ( param1= arg1 , param2 = arg2 )apply()La función apply es muy similar a la función call. La única diferencia entre call y apply es la diferencia en cómo se pasan los argumentos.call — pasamos argumentos como valores individuales, comenzando desde el segundo argumentoapply — los argumentos adicionales se pasarán como un arreglofunction sayHello(greet, msg) { console.log(`${greet} ${this.name} ! ${msg}`); } const obj = { name: "khriztianmoreno", }; // Call sayHello.call(obj, "Hello", "Good Morning"); // Hello khriztianmoreno ! Good Morning // Apply sayHello.apply(obj, ["Hello", "Good Morning"]); // Hello khriztianmoreno ! Good Morningen el ejemplo anterior, tanto el método call como apply en la función sayHello están haciendo lo mismo, la única diferencia es cómo estamos pasando argumentos adicionales.bind()A diferencia de los métodos call y apply, bind no invocará la función directamente, sino que cambiará el valor this dentro de la función y devolverá la instancia de la función modificada.Podemos invocar la función devuelta más tarde.function sayHello() { console.log(this.name); } const obj = { name: "khriztianmoreno" }; // it won't invoke, it just returns back the new function instance const newFunc = sayHello.bind(obj); newFunc(); // khriztianmorenopasando argumentos adicionales: pasar argumentos adicionales en bind funciona de manera similar al método call, podemos pasar argumentos adicionales como valores individuales a partir del segundo argumento del método bind.function sayHello(greet) { console.log(`${greet} ${this.name}`); } const obj = { name: "khriztianmoreno" }; const newFunc = sayHello.bind(obj, "Hello"); newFunc(); // Hello khriztianmorenoEn el caso del método bind, podemos pasar argumentos adicionales de dos formas:Al llamar al método bind en sí mismo, podemos pasar argumentos adicionales junto con el valor de this a esa función.Otra forma es que podemos pasar argumentos adicionales mientras invocamos la función de retorno del método bind.Podemos seguir cualquiera de las formas anteriores y funciona de manera similar sin ninguna diferencia en la funcionalidad.function sayHello(greet) { console.log(`${greet} ${this.name}`); } const obj = { name: "khriztianmoreno" }; const newFunc1 = sayHello.bind(obj, "Hello"); newFunc1(); // Hello khriztianmoreno const newFunc2 = sayHello.bind(obj); newFunc2("Hello"); // Hello khriztianmorenoNOTA: si no pasamos ningún valor o pasamosnull mientras llamamos a los métodos call, apply, bind, entonces esta función interna de llamada apuntará al objeto global.function sayHello() { // executing in browser env console.log(this === window); } sayHello.call(null); // true sayHello.apply(); // true sayHello.bind()(); // trueNo podemos usar los métodos call, apply y bind en las funciones flecha para cambiar el valor de this, porque las funciones de flecha no tienen su propio contexto this.El this dentro de la función de flecha apuntará a la función externa/principal en la que está presente.Por lo tanto, aplicar estos métodos en la función de flecha no tendrá ningún efecto.¡Eso es todo amigxs! ¡Espero que este artículo lo ayude a comprender qué son los métodos call(), apply() y bind() en javascript.!Profile@khriztianmoren

Introducción a los archivos .env

2023-03-09
javascriptweb-developmentprogramming

Imagínate tener que pagar cerca de $148 millones por una violación de datos que expuso los datos de unos 57 millones de usuarios 😱😰Pues eso fue lo que le sucedio a Uber, no hace mucho tiempo, y el culpable fue nada más y nada menos que un secreto codificado publicado abiertamente para que cualquier mal actor lo explote.Por eso en este post, vamos a conocer que son y como podríamos trabajarlos en nuestros proyecto con javascript.envContextoHoy en día, millones de desarrolladores de software mantienen sus secretos (es decir, credenciales como claves de acceso y tokens a los servicios utilizados por los programas) seguros con archivos .env.Para aquellos que no estén familiarizados con el tema, los archivos .env se introdujeron en 2012 como parte de una solución al problema del secreto codificado mencionado en el párrafo introductorio anterior.En lugar de enviar los secretos junto con su código base a la nube, los desarrolladores ahora podrían enviar su código base a la nube y mantener sus secretos separados en sus máquinas en formato clave-valor en archivos .env; esta separación redujo el riesgo de que los malos actores tuvieran en sus manos las credenciales confidenciales en la nube.Para ejecutar programas, los desarrolladores ahora solo tendrían que jalar su código base más reciente del repositorio remoto e inyectar los secretos contenidos en sus archivos .env locales en el código jalado.A menos que un equipo de desarrollo sea pequeño y "desigual", que no se preocupe mucho por DevOps, normalmente mantiene múltiples "entornos" para su base de código para garantizar que los cambios se prueben bien antes de enviarse a producción para interactuar con los usuarios finales. En el caso de varios entornos, los desarrolladores pueden optar por emplear varios archivos .env para almacenar las credenciales, uno para cada uno de esos entornos (por ejemplo, un archivo .env para contener las claves de la base de datos de desarrollo y otro para contener las claves de la base de datos de producción).Para resumir, los archivos .env contienen credenciales en formato clave-valor para los servicios utilizados por el programa que están creando. Están destinados a almacenarse localmente y no cargarse a repositorios de códigos en línea para que todos los lean. Cada desarrollador de un equipo normalmente lleva uno o más archivos .env para cada entorno.UsoEn este post, veremos cómo usar un archivo .env en un proyecto básico, asumiendo que está usando Node.js y git para el control de versiones; esto también debería aplicarse a otros lenguajes. Siéntase libre de omitir esta sección si no está interesado en los aspectos técnicos de cómo usar un archivo .env.Para comenzar, diríjase a la raíz de la carpeta de su proyecto y cree un archivo .env vacío que contenga las credenciales que le gustaría inyectar en su base de código. Puede verse algo como esto:SECRET_1=924a137562fc4833be60250e8d7c1568 SECRET_2=cb5000d27c3047e59350cc751ec3f0c6A continuación, querrá ignorar el archivo .env para que no se confirme en git. Si aún no lo ha hecho, cree un archivo .gitignore. Debe tener un aspecto como este:.envAhora, para inyectar los secretos en su proyecto, puede usar un módulo popular como dotenv; analizará el archivo .env y hará que sus secretos sean accesibles dentro de su base de código bajo el objeto de process. Continúe e instale el módulo:npm install dotenvImporte el módulo en la parte superior del script de inicio para su base de código:require(‘dotenv’).config()Eso es todo, ahora puede acceder a los secretos en cualquier lugar de su base de código:// display the value of SECRET_1 into your code console.log(process.env.SECRET_1); // -> 924a137562fc4833be60250e8d7c1568 // display the value of SECRET_2 into your code console.log(process.env.SECRET_2); // -> cb5000d27c3047e59350cc751ec3f0c6Excelente. Ha agregado con éxito un archivo .env a su proyecto con algunos secretos y ha accedido a esos secretos en su base de código. Además, cuando envías tu código a través de git, tus secretos permanecerán en tu máquina.DesafíosAunque simples y potentes, los archivos .env pueden ser problemáticos cuando se administran de manera incorrecta en el contexto de un equipo más grande.Imagine tener que distribuir y rastrear cientos de claves a su equipo de desarrollo de software.En un nivel simplificado, entre Developer_1 y Developer_2, esto es lo que podría pasar:Developer_1 podría agregar una clave API a su archivo .env local y olvidarse de informar a Developer_2 para que la agregue al suyo; esto le costó a Developer_2 15 minutos en el futuro depurando por qué su código se bloquea solo para darse cuenta de que se debe a la clave API faltante.Developer_2 podría pedirle a Developer_1 que le envíe la clave API para que pueda agregarla a su archivo .env, después de lo cual Developer_1 puede optar por enviarla por mensaje de texto o correo electrónico; esto ahora pone innecesariamente a su organización en riesgo de que los malos actores como Developer_2 esperen precisamente para interceptar la clave API.Desafortunadamente, estos desafíos son comunes e incluso tienen un nombre: secret sprawl (expansión secreta).En los últimos años, muchas empresas han intentado solucionar este problema. HashiCorp Vault es un producto que almacena secretos de forma segura para grandes empresas; sin embargo, es demasiado costoso, engorroso y francamente excesivo para configurarlo para el desarrollador promedio que solo necesita una forma rápida y segura de almacenar estos secretos.Existen soluciones más simples, como Doppler y el nuevo dotenv-vault, pero a menudo carecen de la infraestructura de seguridad necesaria para obtener una adopción masiva.Déjame en los comentarios cuales herramientas o servicios utilizas para solucionar de mara fácil y segura el secret sprawl (expansión secreta).¡Eso es todo amigxs! ¡Espero que esto te ayude a convertirte en un o una mejor dev!Profile@khriztianmoreno �

Algunos métodos más allá del console.log en Javascript

2023-02-17
javascriptweb-developmentprogramming

Some methods beyond console.log in JavascriptA menudo, durante la depuración, los desarrolladores javascript solemos usar el método console.log() para imprimir valores. Pero hay algunos otros métodos de consola que te hacen la vida mucho más fácil. ¿Quieres saber cuáles son estos métodos? ¡Vamos a conocerlos!1. console.table()Mostrar arreglos u objetos largos es un dolor de cabeza usando el método console.log(), pero con console.table() tenemos una forma mucho más elegante de hacerlo.// Matrix const matrix = [ ["apple", "banana", "cherry"], ["Rs 80/kg", "Rs 100/kg", "Rs 120/kg"], ["5 ⭐", "4 ⭐", "4.5 ⭐"], ]; console.table(matrix); // Maps class Person { constructor(firstName, lastName) { this.firstName = firstName; this.lastName = lastName; } } const family = {}; family.mother = new Person("Jane", "Smith"); family.father = new Person("John", "Smith"); family.daughter = new Person("Emily", "Smith"); console.table(family);console.table()2. console.trace()¿Tiene problemas para depurar una función? ¿Te quedas preguntándote cómo fluye la ejecución? ¡console.trace() es tu amigo!function outerFunction() { function innerFunction() { console.trace(); } innerFunction(); } outerFunction();console.trace()3. console.error() y console.warn()¿Cansado de logs/registros aburridos? Dale sabor a las cosas con console.error() y console.warn()console.error("This is an error message"); console.warn("This is a warning message"); console.log("This is a log message");console.error()4. console.assert()¡Esta es otra herramienta brillante para la depuración! Si la aserción falla, la consola imprimirá el seguimiento/trace.function func() { const a = -1; console.assert(a === -1, "a is not equal to -1"); console.assert(a >= 0, "a is negative"); } func();console.assert()5. console.time(), console.timeEnd(), y console.timeLog()¿Necesita comprobar cuánto tarda algo? ¡Los métodos del temporizador están ahí para rescatarte!console.time("timeout-timer"); setTimeout(() => { console.timeEnd("timeout-timer"); }, 1000); setTimeout(() => { console.timeLog("timeout-timer"); }, 500);console.time()NOTA: Los setTimeouts no se ejecutan de inmediato, lo que genera una pequeña desviación del tiempo esperado.¡Eso es todo amigxs! ¡Espero que esto te ayude a convertirte en un o una mejor dev!Profile@khriztianmoreno en Twitter y GitHu

Introducción a Volta, la forma más rápida de administrar entornos de Node

2022-05-27
javascriptweb-developmentprogramming

Volta, es una herramienta que abre las posibilidades para una experiencia de desarrollo más fluida con Node.js. Esto es especialmente relevante para trabajar en equipo. Volta te permite automatizar tu entorno de desarrollo Node.js. Permite a tu equipo usar las mismas versiones consistentes de Node y otras dependencias. Aún mejor, permite mantener las versiones consistentes en los entornos de producción y desarrollo, eliminando los errores sutiles que vienen con los desajustes de versiones.Volta elimina los problemas de "Funciona en mi máquina ..."Los desajustes de versiones causan dolores de cabeza cuando se desarrolla en equipo.Supongamos este escenario:El equipo X creó su aplicación en máquinas locales que ejecutaban Node 10, pero la canalización de compilación adoptó de forma predeterminada la versión de Node más baja que tenía a mano, Node 6, y la aplicación no se iniciaba en producción. Tuvieron que revertir el despliegue, averiguar qué salió mal, se convirtió en una noche muy larga.Si hubieran usado Volta esto pudo haberse evitado.Como trabaja Volta?Volta es "una forma sencilla de administrar sus herramientas de línea de comandos de JavaScript". Hace que la administración de Node, npm, yarn u otros ejecutables de JavaScript enviados como parte de los paquetes, sea realmente fácil.Volta tiene mucho en común con herramientas como NVM, pero NVM no es la más fácil de configurar inicialmente y, lo que es más importante, el desarrollador que lo usa todavía tiene que recordar cambiar a la versión correcta de Node para el proyecto en el que están trabajando.Volta, por otro lado, es fácil de instalar y elimina la parte pensante de la ecuación: una vez que Volta esté configurado en un proyecto e instalado en una máquina local, cambiará automáticamente a las versiones adecuadas de Node.No solo eso, sino que también le permitirá definir versiones de yarn y npm en un proyecto, y si la versión de Node definida en un proyecto no se descarga localmente, Volta saldrá y descargará la versión apropiada.Pero cuando cambia a otro proyecto, Volta cederá a los ajustes preestablecidos en ese proyecto o volverá a las variables de entorno predeterminadas.Volta en acciónDemos a Volta a dar una vuelta. Primero, cree una nueva aplicación React con Create React App.Ejecute el siguiente comando desde una terminal.npx create-react-app volta-sample-appUna vez que haya creado su nueva aplicación React, abra el código en un IDE e inícielo a través de la línea de comando.npm run startSi todo va según el plan, verá un logotipo de React giratorio cuando abra un navegador en http://localhost:3000/Ahora que tenemos una aplicación, agreguemos Volta.Descarga Volta localmentePara instalar Volta, ejecute el siguiente comando:curl https://get.volta.sh | shellSi tiene Windows, descargue y ejecute el instalador de Windows y siga las instrucciones.Defina sus variables de entornoAntes de agregar nuestras versiones de Node y npm específicas de Volta a nuestro proyecto, veamos cuáles son las variables de entorno predeterminadas.Obtenga una lectura de referenciaEn una terminal en la raíz de su proyecto, ejecute el siguiente comando.node -v && npm -vPara mí, mis versiones predeterminadas de Node y npm son v14.18.1 y v6.14.15, respectivamente.Con nuestra línea de base establecida, podemos cambiar nuestras versiones solo para este proyecto con la ayuda de Volta.Fijar una version de node.jsEmpezaremos con Node. Dado que v16 es la versión actual de Node, agreguemos eso a nuestro proyecto.En nuestro proyecto en el nivel raíz donde vive nuestro archivo package.json, ejecute el siguiente comando.volta pin node@16El uso de volta pin [JS_TOOL]@[VERSION] pondrá esta herramienta JavaScript en particular en nuestra versión especificada en el package.json de nuestra aplicación. Después de enviar esto a nuestro repositorio con git, cualquier desarrollador futuro que use Volta para administrar dependencias podrá leer esto del repositorio y usar exactamente la misma versión.Con Volta podemos ser tan específicos o genéricos como deseamos definir las versiones, y Volta llenará cualquier vacío. Especifiqué la versión principal de Node que quería (16) y luego Volta completó las versiones menores y de parche por mí.Después de anclar, verá el siguiente mensaje de éxito en su terminal: pinned node@16.11.1 in package.json.Consejo: haga que su versión de node anclada coincida con la versión de Node de su servidor de compilaciónFijar una version de npmAhora abordemos nuestra versión npm. Aún en la raíz de nuestro proyecto en la terminal, ejecute este comando:volta pin npmSin una versión especificada, Volta elige por defecto la última versión de LTS para agregar a nuestro proyecto.La versión actual de LTS para npm es 8, por lo que ahora nuestro proyecto tiene npm v8.1.0 como su versión predeterminada.Verificar el package.jsonPara confirmar que las nuevas versiones del entorno de JavaScript son parte de nuestro proyecto, verifique el archivo package.json de la aplicación.Desplácese hacia abajo y debería ver una nueva propiedad llamada "volta". Dentro de la propiedad "volta" debe haber un "node": "16.11.1" y una versión "npm": "8.1.0"A partir de ahora, cualquier desarrollador que tenga Volta instalado en su máquina y baje este repositorio tendrá la configuración de estas herramientas para cambiar automáticamente para usar estas versiones particulares de node y npm.Para estar doblemente seguro, también puede volver a ejecutar el primer comando que hicimos antes de anclar nuestras versiones con Volta para ver cómo está configurado nuestro entorno de desarrollo actual.node -v && npm -vDespués de esto, su terminal debería decirle que está usando esas mismas versiones: Node.js v16 y npm v8.Mira cómo sucede la magiaAhora, puedes sentarte y dejar que Volta se encargue de las cosas por ti.Si deseas ver qué sucede cuando no hay nada especificado para Volta, intente subir un nivel desde la raíz de su proyecto y verifique sus versiones de Node y npm nuevamente.Abramos dos terminales una al lado de la otra: la primera dentro de nuestro proyecto con versiones de Volta, la otra un nivel más alto en nuestra estructura de carpetas.Ahora ejecute el siguiente comando en ambos:node -v && npm -vY en nuestro proyecto, Node v16 y npm v8 se están ejecutando, pero fuera del proyecto, Node v14 y npm v6 están presentes. No hicimos nada más que cambiar de directorio y Volta se encargó del resto.Al usar Volta, eliminamos las conjeturas de nuestras variables de entorno de JavaScript y, de hecho, dificultamos que un miembro del equipo de desarrollo use las versiones incorrectas que las correctas.Profile@khriztianmoren

Predicciones 🧞‍♀️💻 2022

2022-01-04
programmingweb-developmentdiscuss

Algunos puntos que deberías prestar atención para este año 2022 que seguro tendrán un alto impacto en el ecosistema tecnológico.RIP Babel y Webpack: No desaparecerán para siempre, pero serán reemplazados en gran medida por nuevas herramientas de compilación que son más rápidas e intuitivas, como SWC, esbuild y Vite.Serverless ayudará a los desarrolladores frontend a convertirse en desarrolladores fullstack (reales): y (con suerte) recibir el pago correspondiente. Gran parte de la tecnología sin servidor se basa en V8 y está adoptando Web APIs, por lo que los frontend developers ya estarán familiarizados con las partes clave de la infraestructura sin servidor. Ahora, en lugar de poner en marcha un servidor Express y llamarse a sí mismo un "fullstack developer", Serverless le permitirá ser realmente uno.Next.js se volverá menos un meta-framework de React y más un meta-framework web: Vercel ya ha contratado a Rich Harris (también conocido como Lord of the Svelte) y ha compartido sus planes para un enfoque edge-first para la web con cualquier framework. Se apoyarán aún más en esto en 2022, se adaptarán a más frameworks/libs JS (con fundas de almohada llenas de efectivo) y se prepararán para una IPO.Las herramientas No/Low-code dominarán aún más: Probablemente continuaremos ignorándolas; mientras tanto, más agencias y adolescentes ganarán millones de dólares enviando sitios sin escribir una línea de código. En 2022, también comenzaremos a ver empresas de software más establecidas con "desarrolladores reales" que aprovechan las herramientas sin código o con poco código porque el mejor código es el que no tiene que mantener.Meta cederá el control de React: Al igual que cuando crearon GraphQL Foundation en 2018, Meta creará una React Foundation a finales de este año y cederá el control de React. A diferencia de Microsoft/Amazon/Google, Meta nunca ha monetizado (con éxito) a los desarrolladores, por lo que React no es una prioridad estratégica para la empresa. Eso podría ser aún más cierto ahora, con los ojos de Zuck en el Metaverso y Sebastian Markbåge partiendo hacia Vercel.VC resolverá la financiación de Open Source: Al menos, se sentirá así. Con algunos proyectos OSS previos a los ingresos/tracción/pmf que generaron rondas de semillas a valoraciones entre $25-50MM, querrá desempolvar ese viejo proyecto secundario suyo. No sé si es sostenible (no lo es), pero es mucho mejor que cuando confiamos en Patreon para financiar nuestra infraestructura web crítica.Netlify adquirirá Remix: Los framework de "Bottoms up" es la ola. Netlify querrá la distribución y Remix querrá el… dinero. Permitiría al equipo de Remix dedicar su tiempo a aquello en lo que son buenos, Remix-the-framework, en lugar de Remix-the-business. El emparejamiento les daría a ambos una oportunidad mucho mejor de ponerse al día con Vercel/Next.jsMientras todo eso ocurre ...? podemos seguir trabajando tranquilamente.Profile@khriztianmoren