WeAreDevelopers Logo WeAreDevelopers
Sign in
For You LIVE
World Congress 2022 • Jun 15, 2022

Svelte ♥ TypeScript and so will you

Ivan Hofer

Svelte's simplicity no longer requires sacrificing type safety. Master generic components, svelte-check, and typed contexts to eliminate runtime exceptions and scale your frontend architecture.

Pause
Mute Enter Fullscreen
#1 about 4 min

The importance of TypeScript in enterprise Svelte projects

Adding static type checking improves the long-term maintainability of large enterprise applications built with Svelte.

#2 about 3 min

Initializing a new SvelteKit project via the CLI

Running command line setup processes scaffolds a new application structure with basic TypeScript configuration.

#3 about 2 min

Configuring the Svelte preprocessor for TypeScript support

Exploring the generated configuration files reveals how the preprocessor integrates different languages into components.

#4 about 3 min

Creating the first typed Svelte component

Adding language attributes to script tags enables comprehensive property linting and syntax highlighting for components.

#5 about 2 min

Catching application errors with the svelte-check utility

Running background validation scripts across an entire project catches hidden compilation issues locally and inside continuous integration pipelines.

#6 about 3 min

Handling optional props and complex API responses

Leveraging discriminated unions prevents layout errors when rendering unpredictable application payloads or setting default property values.

#7 about 3 min

Implementing generic types inside Svelte components

Defining generic declarations allows developers to construct modular components capable of handling multiple variable structures cleanly.

#8 about 4 min

Typing unhandled component props and native DOM elements

Restoring type safety on custom wrapper components requires explicit type definitions for remaining attributes and standard element properties.

#9 about 4 min

Making Svelte context getters and setters type-safe

Securing global state variables via isolated wrapper files avoids loose string-based mapping collisions by using explicit object references.

#10 about 3 min

Adding generated types to SvelteKit routing endpoints

Extending request handlers with generated relative path types automatically defines dynamic network parameters natively.

#11 about 2 min

Exploring learning resources and internationalization libraries

Studying up-to-date community examples accelerates feature velocity when integrating framework-agnostic tooling.

Matching moments

1:21 min

History and timeline of Svelte and SvelteKit

Markus Hatvan · LIVE

2:00 min

The origins and early problems solved by TypeScript

Dani Coll Dani Coll · World Congress 2026 Europe

4:52 min

Core concepts and benefits of the Svelte framework

Markus Hatvan · LIVE

43 sec

Reviewing the benefits of building with Svelte conventions

Benjamin Glusa · LIVE

49 sec

Exploring a basic SvelteKit project structure and scripts

Markus Hatvan · LIVE

1:20 min

Core takeaways for end-to-end TypeScript development

Marco Podien Marco Podien · World Congress 2025

More from World Congress 2022

What the heck do "declarative" and "reactive" actually mean? thumbnail
30:40
about 4 years ago

What the heck do "declarative" and "reactive" actually mean?

André Kovac

The Design and Evolution of C++ thumbnail
1:01:15
about 4 years ago

The Design and Evolution of C++

Bjarne Stroustrup

But, you're not Facebook thumbnail
31:12
over 4 years ago

But, you're not Facebook

Kristijan Ristovski

Communicate efficiently with Software Architecture Diagrams thumbnail
28:11
over 4 years ago

Communicate efficiently with Software Architecture Diagrams

Simon Lasselsberger

Get Ready for Jakarta EE 10! thumbnail
42:53
over 4 years ago

Get Ready for Jakarta EE 10!

Ivar Grimstad

Keep your code refactorable thumbnail
26:46
over 4 years ago

Keep your code refactorable

Gerrit Stapper

Upcoming sessions on this topic

Open session

World Congress 2026 North America

September 24, 2026 · 12:50–13:20

Stage 7

Architecting Agentic Apps: WebMCP, A2UI, and Agent Experience

Ankita Sood

Sr. Principal Engineer @ Secureworks | Angular GDE

Ankita Sood
Open session

World Congress 2026 North America

September 25, 2026 · 11:00–11:30

Stage 7

Beyond Vibe Coding: An AI Builder’s Guide to Migrating 10k+ React Components

Shubham Chaurasia

Senior Software Engineer at Meta

Shubham Chaurasia
Open session

World Congress 2026 North America

September 24, 2026 · 16:10–16:40

Outdoor Stage

When Humans Stop Writing Code: Rethinking Languages, Compilers, and Responsibility

Simon Auer

Organizer of flutter vienna meetup and CEO of marqably

Simon Auer
Open session

World Congress 2026 North America

September 25, 2026 · 10:20–10:50

Stage 9

Testing React Backends Like a Pro: Mocking Databases with SQLite

David Morris

Solution Architect at Leidos

David Morris
Open session

World Congress 2026 North America

September 25, 2026 · 12:55–13:25

Stage 7

The spectrum of agentic coding: From vibe coding to high-quality software engineering

YK Sugi

Developer Experience Manager at Eventual

YK Sugi
Open session

World Congress 2026 North America

September 24, 2026 · 17:30–18:00

Stage 7

Full Stack with Flutter - are we there yet?

Nemanja Stošić

Senior Flutter Developer

Nemanja Stošić

Related videos

Why I Recommend Svelte to Every New Web Developer thumbnail
31:21
LIVE • over 5 years ago

Why I Recommend Svelte to Every New Web Developer

Markus Hatvan

Vuejs and TypeScript- Working Together like Peanut Butter and Jelly thumbnail
44:31
LIVE • over 5 years ago

Vuejs and TypeScript- Working Together like Peanut Butter and Jelly

Rob Richardson

On tour with heroes == Moving from Angular to WebComponents thumbnail
43:08
LIVE • almost 6 years ago

On tour with heroes == Moving from Angular to WebComponents

Benjamin Glusa

Don't compromise on speedy delivery nor type-safety by choosing TypeScript thumbnail
29:44
World Congress 2023 • almost 3 years ago

Don't compromise on speedy delivery nor type-safety by choosing TypeScript

Jens Claes

Do TypeScript without TypeScript thumbnail
43:27
JS Congress • almost 5 years ago

Do TypeScript without TypeScript

Simone Sanfratello

Where we're going we don't need JavaScript - Programming with Type Annotations thumbnail
29:30
World Congress 2022 • over 4 years ago

Where we're going we don't need JavaScript - Programming with Type Annotations

Peter Kröner

Related articles

From learning to earning

Jobs that call for the skills explored in this talk.