{"id":21454,"date":"2025-09-03T10:00:03","date_gmt":"2025-09-03T15:00:03","guid":{"rendered":"http:\/\/carterembry.com\/?p=21454"},"modified":"2025-09-03T11:27:37","modified_gmt":"2025-09-03T16:27:37","slug":"adopting-typescript-at-scale","status":"publish","type":"post","link":"https:\/\/carterembry.com\/es\/2025\/adopting-typescript-at-scale\/%20","title":{"rendered":"Adoptar TypeScript a escala (o cambiar las ruedas de un autob\u00fas en marcha)"},"content":{"rendered":"
\n
\n\t

\u00a1Hola amigos y amigas! Soy yo, Daniel.<\/p>\n

Si me conoces en la vida real, probablemente me habr\u00e1s o\u00eddo parlotear largo y tendido sobre algo relacionado con JavaScript. Mi primer trabajo de programaci\u00f3n profesional fue casi todo con Vanilla JavaScript, as\u00ed que me encanta JS desde hace mucho tiempo. A diferencia de otras personas, sus peculiaridades y excentricidades me resultan entra\u00f1ables. La herencia protot\u00edpica es un poco estrafalaria al principio, pero en realidad es bastante sencilla para las necesidades cotidianas. He visto muchas modas ir y venir (te miro a ti, Coffeescript). Dicho esto, tard\u00e9 mucho en subirme al tren de Typescript. Pero mira, ahora que estoy aqu\u00ed... Soy TODO EN<\/strong>.<\/p>\n<\/div>\n<\/div><\/div><\/div><\/div>

\n
\n\t

I amor<\/em> Typescript. Puedes establecer contratos claramente comprensibles para tus estructuras de datos, funciones y clases, y aplicarlos en tiempo de compilaci\u00f3n. Eso significa que si alguien hace un mal uso de algo o cambia alg\u00fan contrato o interfaz, se detecta. antes de<\/strong> ir a pinchar y perjudicar a tus usuarios. Es un c\u00f3digo que explica c\u00f3mo debe utilizarse.<\/em> \u00bfQu\u00e9 puede no gustarte? Ya pensaba en JS de esta manera, \u00bfpor qu\u00e9 no a\u00f1adir una capa para explicar mis pensamientos? Esto realmente brilla para los equipos o la interfuncionalidad, pero tambi\u00e9n es genial para mi futuro yo (despu\u00e9s de haberme dormido y olvidado todo).<\/p>\n

En mi trabajo diario utilizamos Typescript\u2122 pero no siempre ha sido as\u00ed. Trabajo en una aplicaci mumble-mumble<\/strong> a\u00f1os con muchas generaciones de c\u00f3digo: desde los d\u00edas de React basado en clases con Redux+Thunks hasta los componentes funcionales m\u00e1s modernos basados en React Hooks. Es como excavar a trav\u00e9s de capas de sedimento rocoso para descubrir los porqu\u00e9s hist\u00f3ricos. Todo lo nuevo est\u00e1 escrito en Typescript y eso sienta muy bien, pero no ayudaba cuando ten\u00edamos que profundizar en funciones antiguas (o *gasp* limpiar deudas). Cuando nos dimos cuenta de la alegr\u00eda de utilizar nuestros nuevos componentes (y del dolor de utilizar los antiguos), quise llegar m\u00e1s r\u00e1pido. Quer\u00eda vivir en el futuro, no en el pasado.<\/span><\/span><\/p>\n

Entra en La asombrosamente \u00fatil herramienta de AirBnB, ts-migrate.<\/a><\/h3>\n<\/div>\n<\/div><\/div><\/div>
\n
\n\t\t\"Meme\n\t<\/div>\n\n<\/div><\/div>
\n
\n\t
\n

Quer\u00eda llegar antes. Quer\u00eda vivir en el futuro, no en el pasado.<\/p>\n<\/blockquote>\n<\/div>\n<\/div><\/div><\/div><\/div>

\n
\n\t

Esta genial herramienta revisar\u00e1 todo tu c\u00f3digo base, convirtiendo todos .js(x)<\/strong> archivos a\u00a0.ts(x)<\/strong>.<\/p>\n

Lo s\u00e9, lo s\u00e9, esto parece sucio. Utiliza por defecto el temido cualquier<\/strong> tipo de datos, que es un no-no preferente<\/a>. En los lugares donde no puede determinar c\u00f3mo deben interactuar los tipos, inserta un comentario indicando a Typescript que ignore la l\u00ednea siguiente. De nuevo, lo s\u00e9, lo s\u00e9, esto no parece menos sucio.<\/p>\n

PERO escucha. Estos archivos JS ya se comportan esencialmente as\u00ed. No hay tipos, as\u00ed que todo es ya un cualquiera.<\/strong><\/p>\n

 <\/p>\n<\/div>\n<\/div><\/div><\/div><\/div><\/div>

\n
\n\t

As\u00ed que, independientemente del asco, esto tiene al menos dos ventajas estrat\u00e9gicas inmediatas:<\/h3>\n
    \n
  1. Integrar nuevos componentes en componentes antiguos es ahora seguro desde el punto de vista del tipo. Antes de este cambio, bien podr\u00edan haber sido JS normales y corrientes cuando ten\u00edamos que introducirlos en c\u00f3digo antiguo.\n
      \n
    • Esto significa que ahora nuestro nuevo c\u00f3digo Typescript est\u00e1 tirando hacia arriba de la calidad de estos archivos antiguos, en lugar de que los archivos antiguos tiren hacia abajo de toda la base de c\u00f3digo.<\/li>\n<\/ul>\n<\/li>\n
    • Cada lugar que necesita atenci\u00f3n para estar realmente preparado para Typescript est\u00e1 ahora marcado por un comentario o un cualquier<\/strong> tipo de datos. Intentamos limpiar cualquier archivo antiguo que se toque, archivo por archivo. Enumerar la magnitud de un problema puede llevar mucho tiempo en s\u00ed mismo; con este enfoque, ya est\u00e1 hecho.<\/li>\n<\/ol>\n<\/div>\n<\/div><\/div><\/div><\/div>
      \n
      \n\t

      Es un c\u00f3digo que explica c\u00f3mo debe utilizarse. \u00bfQu\u00e9 puede no gustarte?<\/p><\/blockquote>\n<\/div>\n<\/div><\/div><\/div><\/div><\/div>

      \n
      \n\t

      S\u00e9 que esa sensaci\u00f3n de \"suciedad\" persistir\u00e1 en algunos de vosotros, pero os digo... tu vida ser\u00e1 mejor por ello.<\/strong> El nuestro es definitivamente mejor. Pudimos desautorizar los archivos JS, forzando as\u00ed a\u00fan m\u00e1s la adopci\u00f3n. Tenemos una enumeraci\u00f3n clara de nuestra deuda JS restante. Y la limpieza de archivos antiguos se ha convertido en un f\u00e1cil a\u00f1adido al trabajo existente, en lugar de un l\u00edo insalvable.<\/p>\n

      Las ventajas positivas superan con creces cualquier preocupaci\u00f3n sobre el desorden creado por un proceso automatizado. Esto no estaba claro antes de utilizarlo, pero ahora est\u00e1 clar\u00edsimo. \u00bfNo lo est\u00e1 siempre?<\/p>\n

      Abraza el futuro: s\u00f3lo te llevar\u00e1 un poco de tiempo y no te arrepentir\u00e1s.<\/p>\n<\/div>\n<\/div><\/div><\/div><\/div><\/div><\/div>","protected":false},"excerpt":{"rendered":"

      \u00a1Hola amigos y amigas! Soy yo, Daniel. Si me conoces IRL, probablemente me habr\u00e1s o\u00eddo parlotear largo y tendido sobre algo relacionado con JavaScript. Mi primer trabajo profesional de programaci\u00f3n fue casi todo con JavaScript de vainilla, as\u00ed que me encanta JS desde hace mucho tiempo. A diferencia de otras personas, sus peculiaridades y excentricidades me resultan entra\u00f1ables. La herencia protot\u00edpica es un poco [...]<\/p>","protected":false},"author":3,"featured_media":21459,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"wprm-recipe-roundup-name":"","wprm-recipe-roundup-description":"","site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"default","adv-header-id-meta":"","stick-header-meta":"default","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"categories":[10,5,7],"tags":[],"class_list":["post-21454","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-about-daniel","category-professional-opinions","category-technical-jargon"],"_links":{"self":[{"href":"https:\/\/carterembry.com\/es\/wp-json\/wp\/v2\/posts\/21454","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/carterembry.com\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/carterembry.com\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/carterembry.com\/es\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/carterembry.com\/es\/wp-json\/wp\/v2\/comments?post=21454"}],"version-history":[{"count":24,"href":"https:\/\/carterembry.com\/es\/wp-json\/wp\/v2\/posts\/21454\/revisions"}],"predecessor-version":[{"id":21482,"href":"https:\/\/carterembry.com\/es\/wp-json\/wp\/v2\/posts\/21454\/revisions\/21482"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/carterembry.com\/es\/wp-json\/wp\/v2\/media\/21459"}],"wp:attachment":[{"href":"https:\/\/carterembry.com\/es\/wp-json\/wp\/v2\/media?parent=21454"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/carterembry.com\/es\/wp-json\/wp\/v2\/categories?post=21454"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/carterembry.com\/es\/wp-json\/wp\/v2\/tags?post=21454"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}