Name: TypeScript Congress 2023
Start: 2023-09-21T14:00:00.000Z
End: 2023-09-22T20:00:00.000Z

Vlad Dumitrica

Ioana Sauleac

Petra vos

Lera

Aleksei Podgaev

Kræn Hansen

Stephen Cooper

Varun

Thibault Van den Broecke

Luca Del Puppo

Joanna Otmianowska

Herrington Darkholme

Giulio Zausa

Ricardo Machado

David Barry

Robert

Michal Przybys

Jennifer

Oscar Pagani

Bernie Green

Vanessa Martin

Žiga Šinko

Nils BUntenbeck

Charles

Mathieu Habegger

Dariusz

Bruno da Hora

Kyle

Renata Rodrigues

Lukas

Mel Moe

Pieter Bos

Voy a profundizar en los internos de Nuxt para describir cómo hemos construido un marco de trabajo primero-TypeScript que está profundamente integrado con el IDE del usuario y la configuración de comprobación de tipos para ofrecer seguridad de tipo de pila completa de extremo a extremo, sugerencias para diseños, middleware y más, opciones de configuración de tiempo de ejecución tipadas e incluso enrutamiento tipado. Además, destacaré lo que más me emociona hacer en los días venideros y cómo TypeScript hace eso posible no solo para nosotros sino para cualquier autor de bibliotecas.

Haciendo Magia: Construyendo un Marco de Trabajo Primero-TypeScript

Daniel Rowe discusses building a TypeScript-first framework at TypeScript Congress and shares his involvement in various projects. Nuxt is a progressive framework built on Vue.js, aiming to reduce friction and distraction for developers. It leverages TypeScript for inference and aims to be the source of truth for projects. Nuxt provides type safety and extensibility through integration with TypeScript. Migrating to TypeScript offers long-term maintenance benefits and can uncover hidden bugs. Nuxt focuses on improving existing tools and finds inspiration in frameworks like TRPC.

I'll dive into the internals of Nuxt to describe how we've built a TypeScript-first framework that is deeply integrated with the user's IDE and type checking setup to offer end-to-end full-stack type safety, hints for layouts, middleware and more, typed runtime configuration options and even typed routing. Plus, I'll highlight what I'm most excited about doing in the days to come and how TypeScript makes that possible not just for us but for any library author.

Making Magic: Building a TypeScript-First Framework

Daniel Roe

La verificación de tipos en una base de código TypeScript puede ser lenta, especialmente para monorepos que contienen muchos proyectos que necesitan usar el verificador de tipos para generar archivos de declaración de tipos. En esta charla, presentamos, por primera vez, una nueva característica de TypeScript en la que estamos trabajando llamada “Declaraciones Aisladas” que permite que los archivos DTS se generen sin usar el verificador de tipos en absoluto. ¡Esto abre la puerta a una generación de declaraciones más rápida en TypeScript mismo, así como en herramientas externas escritas en otros lenguajes como ESBuild y swc. Verás cómo usar esta nueva opción, y tal vez (solo tal vez) te convencerás de los beneficios de los tipos de retorno explícitos. Lo más importante, mostraremos cómo las Declaraciones Aisladas permiten compilaciones paralelas para distribuir el trabajo a través de tus núcleos de CPU para mejorar significativamente la velocidad de compilación de tus proyectos TypeScript.

Compilaciones de TypeScript más rápidas con --isolatedDeclarations

This talk discusses the performance issues in TypeScript builds and introduces a new feature called isolated declarations. By running the compiler in parallel and using isolated modules, significant performance gains can be achieved. Isolated declarations improve build speed, compatibility with other tools, and require developers to write types in code. This feature has the potential to further increase performance and may be available in TypeScript soon.

Type-checking a TypeScript codebase can be slow, especially for monorepos containing lots of projects that each need to use the type checker to generate type declaration files. In this talk, we introduce — for the very first time — a new TypeScript feature we are working on called “Isolated Declarations” that allows DTS files to be generated without using the type checker at all! This opens the door to faster declaration generation in TypeScript itself, as well as in external tools written in other languages such as ESBuild and swc. You'll see how to use this new option, and maybe (just maybe) you’ll be convinced about the benefits of explicit return types! Most importantly, we will show how Isolated Declarations enables parallel builds to spread work across your CPU cores to significantly improve the build speed of your TypeScript projects.

Faster TypeScript builds with --isolatedDeclarations

Titian-Cornel Cernicova-Dragomir

Aprende sobre la inferencia con tipos mapeados inversos para crear grandes inferencias para argumentos que agregan diferentes elementos de la misma forma. La técnica puede ayudarte a introducir relaciones a nivel de tipo dentro de objetos y tuplas. La masterclass comenzará con la introducción a la técnica y repasará un par de ejemplos similares al mundo real de cómo esto se puede utilizar para mejorar los tipos de biblioteca.

Inferir varias cosas a la vez con tipos mapeados inversos

Mateusz Kruzynski introduces reverse map types and demonstrates their use in transforming object types. He discusses how reverse map types can be used for inference and to provide contextual types for parameter types. He also shows how reverse map types can be used to extend an entity and bind event listeners. In the context of state machines, he explains how reverse map types can be utilized to strongly type the initial property and create hierarchical state machines. However, there are limitations to be aware of, such as inferring a single thing per object property or tuple element.

Learn about inferring with reverse mapped types to create great inferences for arguments that aggregate different items of the same shape. The technique can help you to introduce type-level relationships within objects and tuples. The talk will start with the introduction to the technique and will go through a couple of real-world-like examples of how this can be used to improve library types.

Infer multiple things at once with reverse mapped types 

Mateusz Burzyński

¿Cómo funciona la inferencia genérica en TypeScript? Para la mayoría de las personas, esto puede parecer una caja negra. El líder de desarrollo de TypeScript, Ryan Cavanaugh, nos guía desde un simple algoritmo de inferencia genérica de un solo paso hasta un modelo simplificado de cómo realmente funciona la inferencia genérica en TypeScript, con un enfoque en ejemplos motivadores.

Hagamos un Algoritmo de Inferencia Genérica

Hello, welcome to Let's Make an Inference Algorithm. Today, I'll give you a high-level overview of how TypeScript's generic inference process works. We'll explore different possibilities like 'any,' 'unknown,' or 'number.' The algorithm for inferring type arguments collects candidates and picks the first one, ensuring the best correct answer. The concept of the best common supertype is used to determine the best candidate. Context sensitivity is addressed in the algorithm, allowing for optimal behavior.

How does generic inference in TypeScript work? For most people, this can seem like a black box. TypeScript's developer lead, Ryan Cavanaugh, walks us from a simple single-step generic inference algorithm up to a simplified model of how generic inference in TypeScript actually works, with a focus on motivating examples.

Let's Make a Generic Inference Algorithm

Ryan Cavanaugh

¿Alguna vez te encuentras preguntándote cómo identificar y abordar problemas de rendimiento en TypeScript para maximizar la efectividad de tu código? Si es así, únete a nosotros para una charla sobre el rendimiento de TypeScript y las técnicas que puedes utilizar para sacar el máximo provecho de tu código. Profundizaremos en varias formas de depurar el rendimiento, exploraremos cómo aprovechar el poder del compilador de TypeScript para detectar posibles problemas de rendimiento y utilizaremos las herramientas de perfilado disponibles para rastrear los cuellos de botella subyacentes.

Rendimiento de TypeScript: Yendo más allá de la superficie

Today's Talk provides an overview of TypeScript performance and tools to address performance issues. It covers the compiler process, including the parser, binder, checker, and transformers steps. The Talk emphasizes the importance of keeping TypeScript up to date for better performance. It also discusses strategies for optimizing TypeScript compilation and debugging, analyzing build performance using trace files, and improving performance by simplifying types and avoiding overloading union types.

Do you ever find yourself pondering how to identify and address performance issues in TypeScript to maximize the effectiveness of your code? If so, join us for a talk on the performance of TypeScript and the techniques you can use to get the most out of your code. We'll delve into various ways to debug performance, explore how to leverage the power of the TypeScript compiler to detect potential performance issues and use the profiling tools available to track down the underlying bottlenecks.

TypeScript Performance: Going Beyond the Surface

Aleksandra Sikora

Un análisis profundo de la propuesta que podría deshacer la bifurcación de TypeScript y traernos de vuelta a todos nosotros como "JavaScripters, pero con algunos tipos de TypeScript." Cubriremos los motivos del autor, cómo podría funcionar, por qué ahora y cómo va.

¿Qué es "TC39: Type Annotations" también conocido como la propuesta de Tipos como Comentarios

The TC59 Type Annotations proposal, also known as Types with Comments, introduces the ability to run typed code in JavaScript. It aims to bring TypeScript back into JavaScript and create a separation between type system and runtime. TypeScript's popularity is on par with JavaScript, raising concerns about the influence of Microsoft. The proposal progresses by addressing runtime interaction and token soup in type specifications. Research, community involvement, and quantifying the effects of supporting this comment style are important goals.

A deep dive into the proposal which could de-fork TypeScript and bring all us users back to being "JavaScripters, but with some TypeScript types." We'll cover the author's motives, how it could work, why now and how it is going.ort

What is "TC39: Type Annotations" aka the Types as Comments proposal

Orta Therox

En esta masterclass práctica, Maurice te guiará personalmente a través de una serie de ejercicios diseñados para empoderarte con una profunda comprensión de los Componentes de Servidor React y el poder de TypeScript. Descubre cómo optimizar tus aplicaciones, mejorar el rendimiento y desbloquear nuevas posibilidades.   Durante la masterclass, realizarás: - Maximizar la mantenibilidad y escalabilidad del código con prácticas avanzadas de TypeScript - Desatar los beneficios de rendimiento de los Componentes de Servidor React, superando enfoques tradicionales - Potenciar tu TypeScript con el poder de los Tipos Mapeados - Hacer tus tipos TypeScript más seguros con Tipos Opacos - Explorar el poder de los Tipos de Plantillas Literales al usar Tipos Mapeados   Maurice estará virtualmente a tu lado, ofreciendo una guía completa y respondiendo a tus preguntas mientras navegas por cada ejercicio. Al final de la masterclass, habrás dominado los Componentes de Servidor React, armado con un nuevo arsenal de conocimientos de TypeScript para potenciar tus aplicaciones React.   No pierdas esta oportunidad de elevar tu experiencia en React a nuevas alturas. Únete a nuestra masterclass y desbloquea el potencial de los Componentes de Servidor React con TypeScript. Tus aplicaciones te lo agradecerán.

Practica Técnicas de TypeScript Construyendo una Aplicación con Componentes de Servidor React

This Workshop covers a variety of TypeScript techniques, including type checking, compiling code, using operator satisfies, creating type mappings, manipulating types with template literal strings, and using opaque types for type safety. It also introduces Next.js and React Server Components for server-side rendering and direct data fetching. The importance of type checking and CI setup is emphasized, along with the use of satisfies and pick operators. Custom type mappings and their applications are explored, as well as the use of opaque types and type assertions for better type checking. The workshop also highlights the benefits of preventing undefined errors and using strict options in TypeScript.

In this hands-on workshop, Maurice will personally guide you through a series of exercises designed to empower you with a deep understanding of React Server Components and the power of TypeScript. Discover how to optimize your applications, improve performance, and unlock new possibilities.   During the workshop, you will: - Maximize code maintainability and scalability with advanced TypeScript practices - Unleash the performance benefits of React Server Components, surpassing traditional approaches - Turbocharge your TypeScript with the power of Mapped Types - Make your TypeScript types more secure with Opaque Types - Explore the power of Template Literal Types when using Mapped Types   Maurice will virtually be by your side, offering comprehensive guidance and answering your questions as you navigate each exercise. By the end of the workshop, you'll have mastered React Server Components, armed with a newfound arsenal of TypeScript knowledge to supercharge your React applications.   Don't miss this opportunity to elevate your React expertise to new heights. Join our workshop and unlock the potential of React Server Components with TypeScript. Your apps will thank you.

Practice TypeScript Techniques Building React Server Components App 

Maurice de Beijer

TypeScript va más allá de anotar la sintaxis. Exploraremos cómo los marcos modernos aprovechan la seguridad de tipo a nivel de proyecto para potenciar una mejor arquitectura, mayor estabilidad y velocidades más altas.

Explorando la arquitectura TypeScript-first de los marcos modernos

Hi, everyone. Today, I'll be showing you some of the features that modern frameworks implement or frameworks that leverage Typescript implement to improve the developer and user experience. I'll cover some of the features that Expo with Expo Router and Next.js with the AppRouter implements. Let's talk about setting up TypeScript in both Expo and Next.js. Both frameworks provide a TypeScript-first development experience. The most important feature is type safe routing, which enhances developer productivity and app stability. Frameworks provide a built-in link component for link generation. It reduces the risk of typos and throws type errors when linking to non-existent routes. In Expo, enable the .typed experiment and import the link component from the exporouter package. Expo supports static and dynamic routes, and throws errors for incorrect parameters. ExpoRouter provides hooks like UseSegments and UseRouter for more control. In Next.js, enable typedRoutes in the next config file. We can import the link component from the next link package and restart the dev server after updating the next config file. Next.js automatically generates route definitions and includes the type file in the TS config. Autocompletion is available for the href attribute, which can be a string or dynamic value. Next.js provides hooks like use router for static navigation and router.push to prevent redirection to broken routes. Catch all routes in type safe routing pose a challenge for enforcing type safety on the href attribute. TypeScript may not throw an error for routes that may be broken or lead to unwanted pages. Keep this in mind when working with catch all routes. Before a production build, route types should be in place to ensure accurate type definitions. Generating routes is an ongoing task that needs to happen at the right moment to avoid build-time errors. When implemented correctly, type-safe routes can elevate the developer experience by preventing broken links or dysfunctional routes. In Next.js, server components and client components have different limitations. Next.js provides automatic error checking for importing useState in server components and enforces the useClientDirective to prevent using client-related code in the wrong places. Next.js also ensures type safety by throwing errors for invalid segment config options and requiring the alt attribute for image components to improve accessibility. Config files in Expo and Next.js have different approaches to incorporating TypeScript, with Expo using the TS node require hook and Next.js supporting type checking through jsdoc in the config JS file. By enabling type-safe routing, we catch potential issues at compile time, ensuring robust routes and unbroken links. Many other frameworks and tools leverage TypeScript to empower developers and deliver error-free experiences to users.

TypeScript goes beyond annotating syntax. We’ll explore how modern frameworks leverage type-safety at the project-level to empower better architecture, greater stability, and higher velocities.

Exploring the TypeScript-first architecture of modern frameworks

Lydia Hallie

¿Qué tan segura es la seguridad de tipo de TypeScript? ¿Cuánto puedes confiar en tu código tipado estáticamente? ¿Incluso puedes considerar el sistema de tipos de TypeScript "fuerte"? En esta charla, observamos situaciones en las que TypeScript falla terriblemente y aprendemos por qué las cosas tienen que ser así. Hablamos de compromisos, soluciones alternativas y, finalmente, soluciones para todas las malditas y terribles mentiras que nos contamos a nosotros mismos cuando usamos TypeScript.

Las mentiras que nos contamos usando TypeScript

The Talk discusses the limitations of TypeScript and the lies we tell ourselves about its type safety. It explores examples of unsafe operations and bending the type system using keywords like type assertion and function is dice. The Talk also covers catching syntax errors, type mismatches, and the complexity of conditional types and generics. It emphasizes the importance of understanding TypeScript's limitations and making well-informed decisions as software engineers.

How safe is TypeScript's type safety? How much can you trust your statically typed code? Can you even consider TypeScript's type system "strong"? In this talk, we look at situations where TypeScript fails badly and learn why things have to be that way. We talk about trade-offs, workarounds, and ultimately solutions for all the damn, terrible lies we tell ourselves when using TypeScript.

The Lies We Tell Ourselves Using TypeScript

 Stefan Baumgartner

Los scripts de shell cumplen un propósito útil, pero tienen algunas desventajas. ¿Qué pasaría si pudiéramos superar estos problemas y hacer que nuestros scripts sean más poderosos utilizando TypeScript multiplataforma familiar? En esta charla, discutiremos por qué deberías cambiar tus scripts de shell a TypeScript y demostraremos un enfoque posible.

Reemplazando Scripts de Shell con TypeScript Multiplataforma

The speaker discusses the benefits of replacing shell scripts with TypeScript, highlighting the limitations of shell scripts and the advantages of TypeScript such as cross-platform compatibility and better tooling. Deno is presented as the ideal platform for single file scripting, with its built-in support for TypeScript, automatic dependency installation, and sandboxing. The dax library is mentioned as a useful tool for scripting, providing a cross-platform shell and other APIs. Overall, the Talk emphasizes the power and flexibility of using TypeScript and Deno for scripting purposes.

Shell scripts serve a useful purpose, but they have some downsides. What if we could overcome these issues and make our scripts more powerful by utilizing familiar cross-platform TypeScript? In this talk, we'll discuss why you should switch your shell scripts to TypeScript and demonstrate a possible approach.

Replacing Shell Scripts with Cross-Platform TypeScript

David Sherret

Vamos a repasar tu kit de supervivencia para la jungla de TS! En esta charla, obtendrás la guía completa de TS, desde consejos simples hasta técnicas complejas que te ayudarán a aprovechar al máximo TypeScript no solo en esos grandes proyectos de producción, sino también en tu pequeña idea de hobby. Exploraremos validaciones, configuración, tipos y mucho más.

Guía de supervivencia de TypeScript: Consejos y técnicas que te salvarán la vida

Hello, I'm Lucas, a software engineer at Klarna in Sweden. I will be sharing my best tips and tricks with TypeScript. One useful tool is tsconfig-basis, which eliminates the need for copying and pasting the same tsconfig file. Rendered types in TypeScript are powerful for handling different types of strings, and type guards and assertion functions make them even more useful. Enums in TypeScript can be number, string, or const, each with its own advantages and limitations. Lastly, there are new features in PS 5.2 like 'using' for resource disposal and 'unknown' for data protection, as well as a case conversion utility type for interfaces.

Let's go through your survival kit for the TS jungle! In this talk, you'll get the complete TS guide from simple tips to complex techniques that will help you take the most of TypeScript not only in those large production projects, but also in your small hobby idea. We'll explore validations, configuration, typings and much more.

TypeScript Survival Guide: Life-Saving Tips and Techniques

Lucas Santos

ArkType es un nuevo validador en tiempo de ejecución para TypeScript y la primera biblioteca con el objetivo de hacer que la sintaxis de tipos esté disponible 1:1 en JS sin ningún paso de compilación. Utiliza un analizador estático cuidadosamente optimizado para que con cada carácter que escribas, verás una lista de completados, un claro ParseError o tu tipo inferido. En tiempo de ejecución, una definición simple como "string|number[]" se transformará en un TypeNode que se puede utilizar para validar o transformar entradas, comparar con otros TypeNodes o combinar con otras definiciones para formar nuevos TypeNodes. Esta charla cubrirá el proceso de construcción de ArkType, con un enfoque en el analizador a nivel de tipo y el sistema de tipos en tiempo de ejecución, y demostrará algunas de las características más emocionantes como scopes, index signatures y generics.

ArkType: Llevando TypeScript a tiempo de ejecución

This Talk discusses the concept of runtime validation in TypeScript and how it bridges the gap between TypeScript's expressiveness and runtime capabilities. The speaker explains the evolution of top-down parsing and the shift-reduced parser that made runtime validation possible. The benefits of runtime validation in terms of flexibility, scalability, and efficiency are highlighted. The integration of validation and the type system is emphasized, along with the enhanced validation capabilities and new features offered by the Archetype framework.

ArkType is a new runtime validator for TypeScript and the first library with the goal of making type syntax available 1:1 in JS with no compilation step. It uses a carefully optimized static parser so that with each character you type, you'll see a list of completions, a clear ParseError, or your inferred type. At runtime, a simple definition like "string|number[]" will be transformed into a TypeNode that can be used to validate or transform inputs, compared to other TypeNodes, or combined with other definitions to form new TypeNodes. This talk will cover the process of building ArkType, with a focus on the type-level parser and runtime type system, and demo some of the most exciting features like scopes, index signatures and generics.

ArkType: Bringing TypeScript to Runtime

David Blass

Aprende cómo generar APIs GraphQL instantáneas utilizando un conector de origen de datos (fuentes GraphQL y no GraphQL), extenderlas y unirlas con resolutores personalizados y desplegarlas en el edge sin salir del editor de código.

Crear y Desplegar APIs GraphQL Instantáneas en el Edge

GraphBase is a platform that provides a GraphQL API for different data sources. The Workshop covers connecting to APIs, creating a new project, and building a GraphQL backend. It also explores extending APIs, transforming with Open API spec, using database adapters, and securing GraphQL queries. Caching and query scope are discussed, as well as data availability, cost, and authentication configuration.

Learn how to generate instant GraphQL APIs using a data source connector (GraphQL and non-GraphQL sources), extend and join them both with custom resolvers and deploy to the edge without leaving the code editor.

Build and Deploy Instant GraphQL APIs to the edge

Jamie Barton

Durante esta sesión aprenderás cómo crear una nueva cuenta de Rollbar e integrar el SDK de Rollbar con tu aplicación para monitorizar errores en tiempo real y responder y solucionar esos errores. También cubriremos cómo personalizar los datos de carga útil enviados a Rollbar para ampliar tus capacidades de monitorización. Agenda:- Crear una cuenta de Rollbar (Cuenta gratuita)- Integra tu aplicación con el SDK de Rollbar- Enviar errores gestionados y no gestionados a Rollbar- Añadir datos de carga útil personalizados a tu configuración.

Masterclass de Codificación en Vivo para Configurar la Monitorización de Errores con Rollbar

Today's Workshop focused on setting up a Vue TypeScript project and integrating it with Rollbar for error monitoring. Participants learned how to modify code to be TypeScript compliant, connect Rollbar plugin and test components, and add additional data to the payload. The Workshop also covered customizing the payload, configuring Rollbar, and using the transform function to modify the payload. Overall, participants gained insights into handling errors, capturing telemetry data, and integrating Rollbar with other tools.

During this session you will learn how to create a new Rollbar account and integrate the Rollbar SDK with your application to monitor errors in real-time and respond and fix those errors. We will also cover how to customize payload data sent to Rollbar to extend your monitoring capabilities. Agenda:- Create a Rollbar Account (Free Account)- Integrate your application with the Rollbar SDK- Send handled and unhandled errors to Rollbar- Add Custom payload data to your configuration.

Live Coding Workshop to Setup Rollbar Error Monitoring

Nico Krüger

En TypeScript 5.0, la cadena de herramientas de TypeScript se migró a módulos. En esta charla, profundizaremos en los detalles, discutiendo qué son los "módulos" (y cómo no los estábamos utilizando), los detalles de la migración en sí, cómo logramos hacer el cambio "en pleno vuelo" en un proyecto en desarrollo activo, cómo fue la migración y qué sigue.

Migrando TypeScript a Módulos: Los Detalles Finales

This Talk discusses TypeScript's migration to modules, the challenges faced, and the automation used for the migration. The TS Morph library and git are used for code transformation and managing changes. The final step involves converting TS dotted names to named imports. The migration to ESBuild brings benefits like faster development loop and improved import organization in TypeScript.

In TypeScript 5.0, the TypeScript toolchain migrated to modules. In this talk, we'll get deep in the weeds, discussing what "modules" even are (and how we somehow weren't using them), the specifics of the migration itself, how we managed to make the switch "mid-flight" on an actively-developed project, how the migration went, and what's next.

Migrating TypeScript to Modules: The Fine Details

Jake Bailey

Las bases de datos clave/valor (KV) se están volviendo cada vez más populares en las aplicaciones web. Sus tiempos de respuesta súper rápidos y su capacidad para admitir lecturas de consistencia eventual las hacen especialmente adecuadas para aplicaciones que se ejecutan en servidores distribuidos globalmente. Pero con lo rápido que avanza esta tecnología, es posible que no esté completamente actualizado sobre cómo usar este tipo de base de datos con TypeScript. En esta sesión, exploraremos buenos casos de uso para las bases de datos KV, examinaremos varias opciones de implementación en producción y demostraremos cómo hidratar de manera efectiva objetos TypeScript a partir de valores en una base de datos KV.

Usando TypeScript con Bases de Datos Clave/Valor

Key-value databases are optimized for high availability and partition tolerance, making them ideal for storing non-relational data structures. They prioritize speed and high availability over consistency, making them suitable for simple data models or one-to-one mappings. However, they have limited query capabilities compared to relational databases. Some available options for key-value databases include DynamoDB, CloudFlare Worker KV, Redis, and FoundationDB. Using key-value databases in TypeScript requires addressing challenges such as serialization, deserialization, secondary indexes, relationships, and validation. The Talk includes a demonstration of an application that showcases the use of secondary indexes and the implementation of a key-value database in Deno or Redis.

Key/value (KV) databases are becoming ever more popular in web applications. Their super-fast response times and ability to support eventual consistency reads make them especially well suited for apps running on globally distributed edge servers. But with how fast this tech is moving, you might not be fully up to speed on how to use this type of database with TypeScript. In this session, we'll explore good use cases for KV databases, examine several production deployment options, and demonstrate how to effectively hydrate TypeScript objects from values in a KV database.

Using TypeScript with Key/Value Databases

Kevin Whinnery

¿Cómo puede un editor mostrar automáticamente errores de tipo cuando creas un solo archivo TypeScript sin ejecutar "npm install typescript" o tener un archivo tsconfig.json? ¿Se construye una lista de finalización por tu editor de código, TypeScript mismo o algún otro ser misterioso? ¿Qué es TSServer? En esta charla te daré una visión general de cómo el servidor de TypeScript se comunica con los IDE y otros editores, ofreciendo funciones de lenguaje avanzadas sin ejecutar nunca tsc.

Cómo se integra TypeScript en tu editor

Today's Talk explores TypeScript integration and refactoring, code action handling, the TypeScript server and refactoring process, bug reporting, and the TypeScript protocol and LSP. The Talk discusses how TypeScript is integrated into editors, the role of code action providers, and the communication between the client and server. It also highlights the two-stage process of code actions and the importance of bug reporting. Additionally, it mentions the TypeScript protocol and how it allows for language-specific extensions. LSP is mentioned as a powerful extensibility solution used by various languages.

How can an editor ""automagically"" show type errors when you create a single TypeScript file without running ""npm install typescript"" or having a tsconfig.json file? Is a completion list build by your coding editor, TypeScript itself, or some other mysterious being? What is TSServer? In this talk I will give you an overview of how the TypeScript server communicates with IDEs and other editors, delivering rich language features without ever running tsc.

How TypeScript is integrated in your editor

Maria Solano

¿Cómo generas tipos dinámicamente? ¿Cómo escribes un script que crea código TypeScript? El enfoque que la mayoría de las personas recomendaría es utilizar manipulaciones del Árbol de Sintaxis Abstracta. Estaba trabajando con una fecha límite para implementar tipos para nuestro cliente OpenAPI, y habría perdido nuestra ventana de lanzamiento. Necesitaba algo diferente y más fácil de construir. Afortunadamente, un amigo me recomendó una biblioteca que no conocía: code-block-writer. Me enamoré de ella a primera vista.

Generando tipos sin trepar un árbol

This talk explores the challenges and benefits of generating types for APIs. The speaker discusses the need for a better client experience and the popularity of generating clients. They also explain the use of OpenAPI for generating REST API clients and the use of Cold Block Writer for code generation. The talk covers the process of defining types for parameters and responses, generating the client and request, and using the generated client. The speaker also touches on validation in production and the initial challenges with TypeScript.

How do you generate types dynamically? How do you write a script that creates some typescript code? The approach most people would recommend is to use Abstract Syntax Tree manipulations. I was working on a deadline to implement types for our OpenAPI client, and I would have missed our release window. I needed something different and easier to build. Luckily, a friend recommended me a library I didn't know: code-block-writer. I fall in love with it at first sight.

Generating types without climbing a tree

Matteo Collina

Tal vez hayas o no hayas oído hablar de los proxies de objetos antes, pero ¿alguna vez has entendido cómo usarlos? ¿Cuál es el caso de uso real de un proxy de objeto? En esta charla, haremos una inmersión profunda en los proxies de objetos, comprendiendo cómo funcionan y los tipos de cosas que puedes construir utilizando ellos. Construiremos envoltorios de alto nivel para bibliotecas existentes y aprenderemos cómo envolverlos de manera tipo-segura.

Desatando los Proxies de Objetos: Construyendo Envoltorios Tipo-Seguros para Cualquier Cosa

Object proxies are middleware for objects that allow control over input and output. They have various use cases such as controlling data access, adding logging, and handling responses. Implementing object proxies involves transpiling calls into network requests and handling property access and method calls. Handling object proxy traps and errors involves faking object structure, logging target objects and properties, and resolving errors. Making API calls with object proxies involves defining the correct type, making backend calls, and wrapping methods to return promises. Object proxies are widely used in ORMs and RPC libraries and should be explored and experimented with.

You must or must not have heard of object proxies before, but have you ever understood how to use them? What the actual usecase of an object proxy is? In this talk, we will do a deep dive into object proxies, understanding how they work, and the kinds of things you can build using them. We will build higher-order wrappers for existing libraries, and learn how to wrap over them in a type-safe manner.

Unleashing Object Proxies: Building Type-Safe Wrappers for Anything

Akash Joshi

¿Alguna vez has instalado una dependencia, la has importado tal como indica el README y te has encontrado inmediatamente con extraños errores de TypeScript sobre importaciones por defecto, el formato de módulo de salida o la interoperabilidad ESM/CommonJS? Cuando todo funciona en tiempo de ejecución pero TypeScript se queja, es posible que te preguntes, ¿es esto un error de TypeScript? O... ¿los tipos están equivocados? El panorama de los módulos y la publicación de paquetes en JavaScript es complicado. Casi un tercio de los paquetes npm más populares que incluyen tipos tienen algún tipo de problema relacionado con los tipos de módulo que puede causar confusión a los usuarios. Pero las cosas están empezando a mejorar. En esta charla, vamos a: - explorar cómo llegamos hasta aquí, ¿por qué las cosas son complicadas? - desarrollar un modelo mental simple y preciso de cómo TypeScript ve los paquetes - ver cómo la herramienta `arethetypeswrong` puede ayudar a detectar problemas antes de la publicación - analizar las tendencias en los datos de `arethetypeswrong` para paquetes populares a lo largo del tiempo - discutir los próximos pasos para mejorar el ecosistema de paquetes con tipos

¿Están equivocados los tipos de módulo?

This Talk discusses module system complexities and terminology, TypeScript and Node disagreements, and fixing TypeScript errors with the Helmet package. It also explores module resolution and type disagreements, challenges with TypeScript and Node support, and the need for improvements in popular packages.

Have you ever installed a dependency, imported it just like the README instructs, and immediately been met with strange TypeScript errors about default imports, the output module format, or ESM/CommonJS interoperability? When everything works at runtime but TypeScript complains, you might wonder, is this a TypeScript bug? Or… are the types wrong? The JavaScript module and package publishing landscape is complicated. Nearly one third of the most popular types-included npm packages have some sort of module-related typings issue that can cause confusion for users. But things are starting to improve. In this talk, we’ll: - explore how we got here—why are things complicated? - develop a simple and accurate mental model for how TypeScript sees packages - see how the `arethetypeswrong` tool can help catch issues before publishing - look at trends in the `arethetypeswrong` data for popular packages over time - discuss next steps for making the typed package ecosystem better

Are the (module) types wrong?

Andrew Branch

Probablemente hayas jugado con bots como ChatGPT y los hayas utilizado para brainstorming. Tal vez hayas notado que obtener respuestas en la estructura o formato correcto ha sido un desafío. Como personas, eso está bien, pero los programas son mucho más quisquillosos. Hemos estado experimentando con el uso de TypeScript en sí mismo como una forma de guiar y validar las respuestas de los modelos de lenguaje.

Domando los Modelos de Lenguaje a través de TypeScript

TypeChat is an open-source library that uses TypeScript types to guide and validate responses from language models. It allows for the creation of complex responses and provides a way to repair errors in the model. TypeChat programs enable better flow of data and the ability to refer to individual steps. The math example demonstrates the use of a program translator and metaprogramming techniques for type safety. Language models trained on both code and prose perform well in this context.

You've probably played with bots like ChatGPT and used them to brainstorm. Maybe you've noticed that getting responses in the right structure or format has been a challenge. As people, we're okay with that - but programs are much more finicky. We've been experimenting with using TypeScript itself as a way of guiding and validating responses from language models.

Taming Language Models through TypeScript

Daniel Rosenwasser

Hablar frente a una audiencia = aterrador. Aprender algo nuevo = aterrador. Hablemos de cómo hacer que el aprendizaje de algo nuevo sea aterrador, ¡MIENTRAS estás frente a una audiencia! Un año y más de 100 videos transmitidos, aprender TypeScript a mi manera ha ayudado a que todo encaje de manera acumulativa, lo que ha facilitado la comprensión de otros temas, desde Python hasta APIs. En esta charla, la audiencia se llevará una comprensión de cómo descubrir cómo aprendes como individuo es un regalo para toda la vida que nunca supiste que necesitabas.

Lecciones aprendidas mientras aprendía en vivo

Learning something new is scary, but overcoming the fear of judgment and embracing patience and practice are key. Understanding learning techniques and the importance of continuous learning are essential in overcoming the fear of public speaking. Learning from podcasts and sharing clips can help in overcoming the paralysis of learning. Making mistakes is inevitable, but it is a part of the learning process. Discovering passion and finding the dream job can be a challenging journey. Learning styles, studying techniques, and embracing frustration are crucial in the learning journey. Typescript provides structure and tools for easier learning. Continuous growth and embracing uncertainty are important for personal development. Starting live streaming requires attention to gear and audio quality.

Talking in front of an audience = scary. Learning something new = scary. Let’s talk about doing scary learning something new, WHILE being in front of an audience! One year and 100+ videos streamed, learning TypeScript the way I learn, has helped it click in a snowball effect helping other topics ranging from Python to APIs make more sense. In this talk, the audience will walk away with an understanding of figuring out how you learn as an individual is a lifelong gift you never knew you needed.

Lessons Learned While Learning Live

Jenn Junod

Todos mencionan la importancia de la "escalabilidad" y "mantenibilidad" del código y cómo TypeScript ayuda con ello. Pero cuando comencé en tecnología, recuerdo haber tenido dificultades para encontrar un ejemplo práctico y "real" con las mejores prácticas. Mi charla tiene como objetivo proporcionar un ejemplo práctico y paso a paso, compartiendo algunos de mis aprendizajes y deficiencias: crucialmente, cómo aprovechamos TypeScript y Atomic Design, sin sobreingeniería demasiado temprana.

De la teoría a la práctica: aprovechando TypeScript para una implementación exitosa de Atomic Design

Leveraging TypeScript and Atomic Design can solve code structure conundrums and achieve readability, efficiency, and flexibility. TypeScript offers benefits like intelligent refactoring, improved on-boarding, and fewer bugs. Typescript makes you think differently and opens doors for what you can do. Real-world challenges and considerations can be exacerbated when using TypeScript with atomic design. Avoid over-engineering and code depth, and stay close to the product to maintain codebase alignment.

Everyone mentions the importance of code "scalability" and "maintainability" and how Typescript helps with it. But when I got started in tech, I remember struggling to find a practical "real-world" example with best practices. My talk aims to provide such a practical, step-by-step example, sharing some of my learnings and shortcomings: crucially, how we leveraged typescript and atomic design - without over-engineering too early.ty

From Theory to Practice: harnessing Typescript for successful Atomic Design implementation

Nathalia Rus

Hay un obstáculo con el que todos nos encontramos al desarrollar tipos más sofisticados: ¿cómo puedo 'abstraer' ciertas similitudes en mi lógica a nivel de tipos? ¿Cómo puedo hacer que mis tipos sean más reutilizables y componibles? ¿Cómo puedo hacer que mis tipos sean más expresivos? Esta charla presentará los fundamentos de los Tipos de Mayor Orden, un concepto convincente hasta ahora subutilizado, y explorará cómo pueden mejorar significativamente la expresividad de la semántica de las bibliotecas, lo que conduce a una experiencia de desarrollo más intuitiva (DX). Demostraremos cómo los Tipos de Mayor Orden pueden proporcionar un nivel de abstracción elevado, lo que le permite modelar problemas de dominio complejos de manera más natural y de forma segura en cuanto a tipos. Acompáñenos para comprender cómo aprovechar los Tipos de Mayor Orden puede elevar su práctica de codificación en TypeScript, optimizando la semántica y ofreciendo una interfaz de biblioteca más potente y completa.

El Potencial de los Tipos de Mayor Orden para la Semántica de Bibliotecas

The Talk discusses the potential of higher kind of types (HKTs) for library semantics, enabling better inference and type-level operations. It explains how HKTs can be created in TypeScript by exploiting function types as a function of object attributes. This allows for the creation of composable functional utilities with intelligent type inference and a chaining interface that computes type-level results. Overall, the Talk highlights the benefits and possibilities of using HKTs in software development.

There is a wall that we all hit when developing more sophisticated types: how can I 'abstract out' certain commonalities in my type-level logic? How can I make my types more reusable and composable? How can I make my types more expressive? This talk will introduce the fundamentals of Higher-Kinded Types, a compelling concept hitherto underutilized, and explore how they can significantly enhance the expressiveness of library semantics, leading to a more intuitive developer experience (DX). We'll demonstrate how HKTs can provide an elevated abstraction level, allowing you to model complex domain problems more naturally and in a type-safe manner. Join us to understand how leveraging HKTs can elevate your TypeScript coding practice, optimizing the semantics and delivering a more potent and featureful library interface.

The Potential of Higher-Kinded Types for Library Semantics

Michael Poteat

Durante los últimos seis años en Rollbar, el equipo de ingeniería ha estado trabajando incansablemente para migrar nuestra aplicación heredada a una pila tecnológica moderna de Javascript. Hemos aprovechado Next.js, GraphQL y varias otras herramientas de JS para lanzar más características, hacer que nuestro equipo de desarrollo esté más feliz y lograr una impresionante reducción de 7 veces en el rendimiento de nuestra aplicación p99. Te invito a que me acompañes mientras presento las diversas técnicas y arquitectura que elegimos utilizar para migrar rápidamente desde nuestro monolito heredado.

Generación de Código Tipado

Today, I'm going to be talking about how type generation helped reduce bugs and improve our developer experience at Rollbar. The Monolith tech stack is built primarily on Python Pyramid, a web framework that's similar to Django, Ruby on Rails, or Express. To address debugging, performance, and code navigation challenges, we migrated to a tech stack that includes TypeScript, Next.js, GraphQL, and React Query. Codegen is used to generate TypeScript code on both the server and client side, enhancing debugging, performance, and code navigation.

For the past six at Rollbar the engineering team has been working tirelessly to migrate our legacy application to a modern Javascript tech stack. We’ve leveraged Next.js, GraphQL and a number of other JS tools to ship more features, make our dev team happier and achieve an impressive 7-fold reduction in our p99 app performance. I invite you to join me as I present the various techniques and architecture we choose to use to quickly migrate away from our legacy monolith.

Generating Typed Code

Paul Serraino

Esta charla explorará formas más avanzadas de escribir reglas de análisis estático en ESLint utilizando las APIs de flujo de control de ESLint. Explicaré rápidamente qué es un grafo de flujo de control y cómo puedes usarlo para encontrar problemas en tu código. Te mostraré cómo detectar cuándo se asigna un valor a una variable de manera inútil y otros problemas lógicos que puedes detectar utilizando esta técnica.

Reglas avanzadas de linting con ESLint

Tibor Blanesy from Sonar presents advanced techniques for linting with ESLint, including the use of ControlFlowGraph to detect errors in code. The algorithm is based on liveness analysis, which identifies live variables at any point in the program. Additionally, the talk covers the computation of block sets using the difference between outset and kill set unionized with genset.

This talk will explore more advanced ways to write static analysis rules in ESLint using ESLint's control flow APIs. I will quickly explain what a control flow graph is and how you can use it to find issues in your code. I will show you how to detect when a value is assigned to variable uselessly and other logical problems you can detect using this technique.

Advanced linting rules with ESLint 

Tibor Blenessy

La mayoría de las herramientas del ecosistema, como los empaquetadores o los transpiladores, se basan en AST. Y TypeScript proporciona una de las mejores experiencias para desarrolladores para trabajar con la base de código. Esta charla trata sobre la experiencia de lo beneficioso que puede ser utilizar sugerencias de tipo y el servidor de lenguaje TypeScript durante el análisis estático y del código basado en el ejemplo de construir una biblioteca de css-in-js en tiempo de compilación.

Mejora del análisis estático AST con el servidor de lenguaje TypeScript

Today's Talk discusses enhancing static code analysis using TypeScript language server and abstract syntax tree (AST). TypeScript can help with static analysis by providing types based on function signatures. By integrating TSMorph into a Babel plugin, we can check types for specific nodes in the abstract syntax tree. Enhancements to static analysis include checking console.log arguments and removing unnecessary expressions. TypeScript's type information can be used to compile CSS and extract it into a separate stylesheet, enabling better compilation and build time performance.

Most of the ecosystem tools, like bundlers or transpilers, are based on AST. And Typescript provides one of the best Developer Experiences to work with the code base. This talk is about the experience of how beneficial it can be to use Type Hints and Typescript Language Server during the AST and static code analysis, based on the example of building a compile-time css-in-js library.

Enhanced AST Static Analysis with Typescript Language Server

Artur Kenzhaev

Publicar bibliotecas en NPM es fácil: solo `tsc && npm publish` y listo, ¿verdad? Ups, olvidaste la compatibilidad adecuada con ESM. Y un usuario está solicitando una compilación UMD. Y no funciona en Webpack 4. Y `moduleResolution: "node16"` no puede encontrar los tipos. Publicar bibliotecas hoy en día es _complicado_. Analizaremos los muchos problemas y preguntas que debes considerar al publicar un paquete, y algunas posibles respuestas obtenidas con mucho esfuerzo a esas preguntas.

Publicación de bibliotecas de TS para diversión y beneficio

Mark Erickson discusses the complexities of publishing TypeScript libraries, including considerations like build artifact file formats, package exports, and different user environments. He shares his experiences with ESM support and interop with other module formats, and the challenges faced in migrating Redux to TypeScript. Erickson highlights the importance of understanding file formats and module types, and the insights gained from discussions with the TypeScript team. He also emphasizes the need for better tools and documentation in the ecosystem for publishing and maintaining TypeScript libraries.

Publishing libraries to NPM is easy - just `tsc &amp;&amp; npm publish` and you're done, right? Whoops, you forgot proper ESM compat. And a user is asking for a UMD build. And it doesn't work in Webpack 4. And `moduleResolution: "node16"` can't find the types. Publishing libraries today is _complicated_. We'll take a look at the many problems and questions you should consider when publishing a package, and some hard-earned possible answers to those questions.type

Publishing TS Libraries for Fun and Profit

Mark Erikson

Sumérgete en el mundo de las herramientas del ecosistema de TypeScript y descubre las capacidades transformadoras que pueden potenciar tu flujo de trabajo de desarrollo. En esta masterclass, podrás descubrir las herramientas esenciales para la configuración de proyectos, análisis de código, pruebas e implementación. Además, aprenderás cómo los editores de código inteligentes, formateadores y linters mejoran la calidad del código. Por último, exploraremos los verificadores de tipos, analizadores estáticos y herramientas de refactorización que mejoran la mantenibilidad del código, las bibliotecas y frameworks de TypeScript, y veremos su integración perfecta con los empaquetadores, ejecutores de tareas, frameworks de pruebas y pipelines de CI. ¡No te pierdas esta masterclass para desatar todo el potencial de TypeScript y maximizar tu productividad con el extenso ecosistema de herramientas a tu disposición y que probablemente no conocías!

Desbloqueando el Potencial de TypeScript: Explorando el Poder de las Herramientas del Ecosistema

Today's Talk explores the world of TypeScript ecosystem tooling, discussing essential tools for project setup, including package managers and project scaffolding. It also covers code analysis, testing, and deployment in TypeScript, as well as best practices for maintaining high-quality code. The Talk emphasizes the importance of intelligent code editors, code formatters, and linters in ensuring code quality. It also highlights the significance of codebase maintainability and following TypeScript best practices for efficient and scalable code.

Dive into the world of TypeScript ecosystem tooling and uncover the transformative capabilities that can supercharge your development workflow. In this talk, you can discover essential tools for project setup, code analysis, testing, and deployment. Also, learn how intelligent code editors, formatters, and linters improve code quality. Finally, let's explore type checkers, static analyzers, and refactoring tools that enhance codebase maintainability, TypeScript libraries and frameworks, and witness their seamless integration with bundlers, task runners, testing frameworks, and CI pipelines. Don't miss this talk to unleash the full potential of TypeScript and maximize your productivity with the extensive ecosystem of tools at your disposal and that you probably didn't know!

TypeScript Congress 2023

The Type of Conference Developers Need