Skip to content

Commit 83ae719

Browse files
DreaminDanibenmccannpaoloricciutidummdidumm
authored
docs: "What's new in Svelte" November newsletter (#881)
* first draft of dec newsletter * Apply suggestions from code review Co-authored-by: Ben McCann <[email protected]> Co-authored-by: Paolo Ricciuti <[email protected]> * It's december! * Forgot to update the description * Update apps/svelte.dev/content/blog/2024-12-01-whats-new-in-svelte-december-2024.md * Update 2024-12-01-whats-new-in-svelte-december-2024.md --------- Co-authored-by: Ben McCann <[email protected]> Co-authored-by: Paolo Ricciuti <[email protected]> Co-authored-by: Simon H <[email protected]>
1 parent 0cf5e7e commit 83ae719

File tree

1 file changed

+99
-0
lines changed

1 file changed

+99
-0
lines changed
Lines changed: 99 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,99 @@
1+
---
2+
title: "What's new in Svelte: December 2024"
3+
description: 'A better CLI and a bunch of UI libraries now support Svelte 5'
4+
author: Dani Sandoval
5+
authorURL: https://dreamindani.com
6+
---
7+
8+
I can't believe it's already the last newsletter of the year! So much has happened in the Svelte community - from two great Svelte Summits to the release Svelte 5 🎉
9+
10+
As we look forward to the next year and watch the Svelte team do [24 features in 24 days](advent-of-svelte), let's dive into what's new in the past month...
11+
12+
## What's new in Svelte
13+
14+
The bugfix versions in 5.1.x and 5.2.x addressed a bunch of issues reported by the community. So if you're noticing anything weird, make sure you upgrade to the latest version and, as always, check out the [CHANGELOG](https://github.com/sveltejs/svelte/blob/main/packages/svelte/CHANGELOG.md) for all the bug fixes.
15+
16+
The features since last month can be found below:
17+
18+
- `ContentVisibilityAutoStateChangeEvent` has been added to element definitions (**5.2.5**, [MDN Docs](https://developer.mozilla.org/en-US/docs/Web/API/ContentVisibilityAutoStateChangeEvent), [#14373](https://github.com/sveltejs/svelte/pull/14373))
19+
20+
## What's new in SvelteKit, Svelte CLI and Language Tools
21+
22+
- `isActionFailure` is a new helper method to check if a variable is an instanceof `ActionFailure` - helpful for debugging parsing of user input (**2.8.0**, [#12878](https://github.com/sveltejs/kit/pull/12878))
23+
- `const load = ...` declarations will now be typed automatically (**svelte2tsx-0.7.23**, [#2540](https://github.com/sveltejs/language-tools/pull/2540))
24+
- The CLI will now include a `jsconfig.json` in the 'no type checking' template (**0.6.2**, [#290](https://github.com/sveltejs/cli/pull/290))
25+
- When installing dependencies, the CLI will display the package manager's output (**0.6.3**, [#305](https://github.com/sveltejs/cli/pull/305))
26+
- A short description will now be shown for each add-on in the CLI menu (**0.6.5**, [#299](https://github.com/sveltejs/cli/pull/299))
27+
- Instance types will now be provided automatically in Svelte 5 (**svelte2tsx-0.7.23**, [#2553](https://github.com/sveltejs/language-tools/pull/2553))
28+
- A code lens indicator for "runes mode" will now appear atop a file when detected - "legacy mode" when not (**language-server-0.17.4**, [#2554](https://github.com/sveltejs/language-tools/pull/2554))
29+
30+
---
31+
32+
## Community Showcase
33+
34+
### Apps & Sites built with Svelte
35+
36+
- [Unsubscribe](https://unsubscribe.jnr.cx/) is an interactive site that makes fun of how hard it is to unsubscribe from things on the internet these days
37+
- [Dealcrane](https://dealcrane.com/?utm_source=discord&utm_medium=social&utm_campaign=beta_promo&utm_content=svelte) helps technology shoppers find discounts across popular internet shopping sites
38+
- [Raw Web](https://rawweb.org/) is a search engine for indexing the content of independent, especially personal, websites
39+
- [Jovian Moon's personal site](https://github.com/StephenGunn/jovian) features an interactive rocket ship to fly you straight to Jupiter (or anywhere else you want to go)
40+
- [Font Preview](https://github.com/songkeys/font-preview) makes it easy to analyze and explore font characters in the browser
41+
- [Dunks & Threes](https://dunksandthrees.com/) is a professional basketball analysis platform that provides data-driven NBA predictions
42+
- [AdresseDuBien](https://adressedubien.com/) is a small utility to find addresses for real estate ads (for France) with a Libre Map implementation
43+
- [PixelAttack](https://jason1610.github.io/PixelAttack/) takes an image, pixelizes it and makes the pixels fight each other
44+
- [NeoHtop](https://github.com/Abdenasser/neohtop) is a modern, process monitoring tool that combines the power of terminal-based system monitors with a clean, desktop-native UI
45+
- [WebVM](https://github.com/leaningtech/webvm) is a Linux virtual machine that runs in your browser
46+
- [Sveltris](https://svelte.dev/playground/8594eea15c6244908c3efad284fe2aa4?version=5.2.1) is Tetris built entirely in the Svelte REPL
47+
48+
### Learning Resources
49+
50+
_Featuring Svelte Contributors and Ambassadors_
51+
52+
- [Svelte 🧡](https://bsky.app/profile/paolo.ricciuti.me/feed/svelte-feed) is a Bluesky feed to keep up to date on Svelte news in that application
53+
- [SvelteKit Streaming: The Complete Guide](https://khromov.se/sveltekit-streaming-the-complete-guide/) by Stanislav Khromov
54+
- [Remote Workshop: Svelte 5 & Runes](https://ti.to/mainmatter/svelte-5-runes-feb-2025) is taking place February 6-7th, 2025 and taught by Paolo Ricciuti
55+
- [Svelte 5: In Action | Build A Tasks App](https://www.youtube.com/watch?v=uSWMvDPpG0k) by Syntax
56+
- [Svelte Society London](https://www.youtube.com/watch?v=mxM208nCvHc) - featuring Paolo with his talk, _Herd your async tasks!_
57+
58+
_This Week in Svelte_
59+
60+
- [Ep. 83](https://www.youtube.com/watch?v=1a-iKUCF5_g) — You might not need an effect
61+
- [Ep. 84](https://www.youtube.com/watch?v=kVbQyKf4Oe4) — manifest.build
62+
- [Ep. 85](https://www.youtube.com/watch?v=yY963ovcDQ0)@sheepdog/svelte
63+
64+
_To Read_
65+
66+
- [Web software development (2024)](https://fitech101.aalto.fi/web-software-development/) is a self-study course for all things web development and features Svelte heavily
67+
- [Async Fetching in Svelte 5](https://dev.to/jdgamble555/async-fetching-in-svelte-5-826) by Jonathan Gamble
68+
- [Cross-Origin-Isolation with SvelteKit, Vite, and Firebase](https://www.captaincodeman.com/cross-origin-isolation-with-sveltekit-vite-and-firebase) by Captain Codeman
69+
- [The $effect.tracking rune](https://www.matsimon.dev/blog/svelte-in-depth-effect-tracking) by Matt Simon
70+
71+
### Libraries, Tools & Components
72+
73+
_Component Libraries_
74+
75+
- [shadcn-svelte](https://next.shadcn-svelte.com/) now supports Svelte 5 and has brand new docs to go with the update
76+
- [Zag](https://zagjs.com/overview/introduction) now supports Svelte 5
77+
- [Skeleton V3](https://github.com/skeletonlabs/skeleton/discussions/2919) is now in beta (and, as expected, supports Svelte 5)
78+
- [Storybook 8.4](https://www.reddit.com/r/sveltejs/comments/1gpqusy/storybook_84_release/) now supports Svelte 5 and CSF natively with component testing built-in
79+
80+
_Icon Libraries_
81+
82+
- [svelicon](https://github.com/friendofsvelte/svelicon) converts Iconify SVG icons to type-safe components with one command
83+
- [moving icons](https://www.movingicons.dev/) is a collection of animated icons based on the lucide icon library
84+
- [Monicon](https://github.com/oktaysenkan/monicon) is an all-in-one icon library that provides 200,000+ icons from popular sets like Material Design, Feather, and Font Awesome
85+
86+
_Everything Else_
87+
88+
- [Svelte Multitone Image](https://stephane-vanraes.github.io/svelte-multitoneimage/) is a simple image renderer to apply multitone effects for Svelte
89+
- [number-flow](https://github.com/barvian/number-flow) is a component to transition, format, and localize numbers
90+
- [sveltednd](https://github.com/thisuxhq/SvelteDnD) is a lightweight, flexible drag and drop library for Svelte 5 applications
91+
- [ShadEditor](https://github.com/Tsuzat/ShadEditor) is a highly extensible text editor for svelte made with TipTap and ShadCN UI
92+
- [Tipex](https://www.npmjs.com/package/@friendofsvelte/tipex) is an advanced rich text editor based on Tiptap and Prosemirror
93+
- [svelte-bundle](https://github.com/uhteddy/svelte-bundle) is a tool for bundling Svelte components into a single HTML file
94+
- [svelte5-router](https://github.com/mateothegreat/svelte5-router) is an SPA router that allows you to divide & conquer your app with nested routers
95+
- [@sheepdog/svelte](https://github.com/mainmatter/sheepdog) is a library to manage async tasks and concurrency with ease.
96+
97+
That's it for this huge month in Svelte! Let us know if we missed anything on [Reddit](https://www.reddit.com/r/sveltejs/) or [Discord](https://discord.gg/svelte).
98+
99+
Until next ~~time~~ year! 👋

0 commit comments

Comments
 (0)