mirror of
https://github.com/sveltejs/svelte.git
synced 2024-12-01 17:30:59 +01:00
993b40201c
* New FAQ, new renderer * Push blog stuff * Fix blog posts * Add tutorial to be rendered * Update documentation/content/blog/2023-03-09-zero-config-type-safety.md Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com> * Update documentation/content/blog/2023-03-09-zero-config-type-safety.md Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com> * Revamp a lot of renderer, make it (soft) compatible with sveltekit * Remove markdown types * Clean up faq +page * Document stuff * Make the options more explicity * chore(site-2): Restructure docs pt 2 (#8604) * Push * Update readme * Push * inor accessibility fix * minr stuff * Add prepare * Run prettier * Remove test script * pnpm update * Update sites/svelte.dev/src/routes/examples/[slug]/+page.svelte Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com> * Update sites/svelte.dev/package.json Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com> --------- Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com> --------- Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
9.6 KiB
9.6 KiB
title | description | author | authorURL |
---|---|---|---|
What's new in Svelte: September 2022 | Migrating to SvelteKit's new filesystem-based router | Dani Sandoval | https://dreamindani.com |
Still looking for something to do this month? It's your last chance to get tickets to Svelte Summit, Stockholm! Join us on Sept 8-9th 🎉
With the redesign of SvelteKit's filesystem-based router merging early last month, there's lots to cover this month - from the migration script to a number of new blog posts, videos and tutorials.
But the new routing isn't the only new feature in SvelteKit...
What's new in SvelteKit
Link
is now supported as an HTTP header and works out of the box with Cloudflare's Automatic Early Hints (1.0.0-next.405, PR)$env/static/*
are now virtual to prevent writing sensitive values to disk (1.0.0-next.413, PR)$app/stores
can now be used from anywhere on the browser (1.0.0-next.428, PR)config.kit.env.dir
is a new config that sets the directory to search for.env
files (1.0.0-next.430, PR)
Breaking changes:
- The filesystem-based router and
load
API improves the way routes are managed. Before installing version@sveltejs/kit@1.0.0-next.406
or later, follow this migration guide (PR, Issue) event.session
has been removed fromload
along with thesession
store andgetSession
. Useevent.locals
instead (1.0.0-next.415, PR)- Named layouts have been removed in favor of
(groups)
(1.0.0-next.432, Docs, PR & Migration Instructions) event.clientAddress
is nowevent.getClientAddress()
(1.0.0-next.438, PR)$app/env
has been renamed to$app/environment
, to disambiguate with$env/...
(1.0.0-next.445, PR)
For a full list of changes, check out kit's CHANGELOG.
Updates to language tools
- TypeScript doesn't resolve imports to SvelteKit's $types very well, the latest version of Svelte's language tools makes it better (105.21.0, #1592)
Community Showcase
Apps & Sites built with Svelte
- canno is a simple interactive 3d physics game with adjustable gravity, cannon power, and debug visualizer - made with threlte
- straw.page is an extremely simple website builder that lets you create unique websites straight from your phone
- Patra lets you share short notes just with a link. No database. No storage
- promptoMANIA is an AI art community with an online prompt builder
- Album by Mood lets you listen to music based on your mood
- Daily Sumeiro is a daily game to test your math and logic skills
- Lofi and Games - play relaxing, casual games right from your browser
- Pitch Pipe is a digital pitch pipe with a frequency analyser and just-intonation intervals
- classes.wtf is a custom, distributed search engine written in Go and Svelte to make searching for Harvard courses much quicker than the standard course catalog
- Scrumpack is a set of tools to help agile/scrum teams with their ceremonies like Planning Poker and Retrospectives
Learning Resources
Starring the Svelte team
- Supper Club × Rich Harris, Author of Svelte — Syntax Podcast 499
- Let's talk routing with Rich Harris on Svelte Radio
- 2.17 - Building the Future of Svelte at Vercel with Rich Harris
- 1.15 - What's Up With SvelteKit with Shawn Wang (swyx)
- Adding Notion Tailwindcss and DaisyUI to Svelte App
- Svelte 101 Session
- Astro and Svelte
- Storyblok in Svelte
- Svelte London August Recording
Learning the new SvelteKit routing
- Migrating Breaking Changes in SvelteKit by Brittney Postma (Netlify)
- Major Svelte Kit API Change - Fixing
load
, and tightening up SvelteKit's design before 1.0 - Video by LevelUpTuts - SvelteKit Is Never Going To Be The Same - Video by Joy of Code
- Let's learn SvelteKit by building a static Markdown blog from scratch by Josh Collinsworth (updated Aug 26th to keep up with the new changes)
To Watch
- Svelte Guide For React Developers and Svelte State Management Guide by Joy of Code
- What Is Bookit? The Svelte Kit Storybook Killer and What Is @type{import In Svelte Kit - JSDoc Syntax by LevelUpTuts
- TWF Yet another JS Framework... or not? Svelte! by TWF meetup
To Read
- Creating a Figma Plugin with Svelte by Lennart
- Svelte Video Blog: Vlog with Mux from your own SvelteKit Site and Svelte Shy Header: Peekaboo Sticky Header with CSS by Rodney Lab
Libraries, Tools & Components
- @svelte-plugins/tooltips is a simple tooltip action and component designed for Svelte
- Lucia is a simple authentication library for SvelteKit that connects your SvelteKit app to your database
- remix-router-svelte is a Svelte implementation of the
react-router-dom
API (driven by@remix-run/router
) - MKRT is a CLI to help you create SvelteKit routes, fast
- Histoire is a tool to generate stories applications - scenarios where you showcase components for specific use cases
- sveltekit-flash-message is a Sveltekit library that passes temporary data to the next request, usually from endpoints
- svelte-particles is a lightweight TypeScript library for creating particles
- svelte-claps adds clap button (like Medium) to any page for your SvelteKit apps
- Neon Flicker is a Svelte component to make your text flicker in a cyberpunk style
- ComboBox is a search input to help users select from a large list of items
- @svelte-put is useful svelte stuff to put in your projects
- vite-plugin-svelte-bridge lets you write Svelte components and use them from React & Vue
UI Kits and Starters
- Svelte-spectre is a UI-kit based on spectre.css and powered by Svelte
- Skeleton allows you to build fast and reactive web UI using the power of Svelte + Tailwind
- iconsax-svelte brings the popular icon kit to Svelte
- laravel-vite-svelte-spa-template is a Laravel 9, Vite, Svelte SPA, Tailwind CSS (w/ Forms Plugin & Aspect Ratio Plugin), Axios, & TypeScript starter template
- neutralino-svelte-boilerplate-js is a cross platform desktop template for Neutralino and Svelte
- figma-plugin-svelte-vite is a boilerplate for creating Figma plugins using Svelte, Vite and Typescript
- Urara is a sweet & powerful SvelteKit blog starter
- SvelteKit Commerce is an all-in-one starter kit for high-performance e-commerce sites built with SvelteKit by Vercel
Did we miss anything? Let us know on Reddit or Discord!
See ya next month!