Let's talk about #svelte!

"Write less, do more" used to be #jquery slogan for over a decade. Then, the slogan and jQuery itself was forgotten for some time.

And we face the second birth of this slogan with Svelte!

Rich Harris shares some very interesting ideas in this great talk: https://www.youtube.com/watch?v=BzX4aTRPzno

​​A module used to arrange card elements including content infinitely according to layout type. With this module, you can implement various layouts composed of different card elements whose sizes vary. It guarantees performance by maintaining the number of DOMs the module is handling under any circumstance.

With built-in integrations for #vue, #react, #angular, and #svelte

https://github.com/naver/egjs-infinitegrid

​​Do you still wait for #ts support for Svelte? There's this tool to help you in the meantime.

When run as a script and provided a file glob, will type check all svelte/js/ts files in that glob (and all their dependencies). Performs its magic using svelte2tsx and Typescript.

https://github.com/halfnelson/svelte-type-checker

#js #svelte

​​An experiment to create a community driven language-learning platform.

> My goal is to start a community-driven language-learning platform that gives it's users and contributors a way to influence its future and adapt it to special requirements. To achieve that, I release all source code under the GPLv3 free software license, which guarantees end users the freedom to run, study, share, and modify the software.

https://github.com/kantord/LibreLingo

#python #svelte

​​Layer Cake is a graphics framework for #svelte.

It uses the measurements of your target div and your data extents to create scales that stay synced on layout changes. Use these scales to organize multiple, mostly-reusable Svelte components, whether they be SVG, HTML, Canvas or WebGL. Since they all share the same coordinate space, you can build your graphic one layer at a time.

https://layercake.graphics/

#js

​​⚡Breaking news!

#svelte now officially supports #ts!

TypeScript support in Svelte has been possible for a long time, but you had to mix a lot of disparate tools together and each project ran independently. Today, nearly all of these tools live under the Svelte organization and are maintained by a set of people who take responsibility over the whole pipeline and have common goals.

When we say that Svelte now supports TypeScript, we mean a few different things:
- You can use TypeScript inside your <script> blocks — just add the lang="ts" attribute
- Components with TypeScript can be type-checked with the svelte-check command
- You get autocompletion hints and type-checking as you're writing components, even in expressions inside markup
- TypeScript files understand the Svelte component API — no more red squiggles when you import a .svelte file into a .ts module

https://svelte.dev/blog/svelte-and-typescript

​​Inertia.js: the modern monolith. Build single-page apps, without building an API.

Inertia.js lets you quickly build modern single-page React, Vue and Svelte apps using classic server-side routing and controllers.

Inertia is a new approach to building classic server-driven web apps. We call it the modern monolith.

Inertia allows you to create fully client-side rendered, single-page apps, without much of the complexity that comes with modern SPAs. It does this by leveraging existing server-side frameworks.

Inertia has no client-side routing, nor does it require an API. Simply build controllers and page views like you've always done!

Inertia isn't a framework, nor is it a replacement to your existing server-side or client-side frameworks. Rather, it's designed to work with them. Think of Inertia as glue that connects the two. Inertia does this via adapters. We currently have three official client-side adapters (#react, #vue, and #svelte) and two server-side adapters (Laravel and Rails).

https://inertiajs.com/

#js

​​The backlash to modern front end development is gaining steam, with good reason: single-page apps have ruined the web. Can we rescue it without going backwards? In this talk, Rich Harris presents a way to do just that. Rich Harris is a graphics editor at the New York Times, where he builds JavaScript apps to help explain the news. He is also the creator of Rollup, the JavaScript module bundler, and Svelte, the front end framework.

What’s wrong with Single-Page apps? There are a lot of critiques. A non-exhaustive list of terrible things about single-page apps include:
You’ll need a bloated JavaScript framework and performance will suffer
It comes with complex tooling and is less resilient, since it won’t work without JavaScript
It will be buggy and accessibility issues

JavaScript failing is a fact of life. So what’s a developer to do? SPAs solve problems to the traditional approach, but are still problematic. Rich presents a new framework for thinking about how we can get the best of both the MPA and SPA worlds: transitional apps.

What’s a transitional app? Transitional apps samples elements from both traditional and modern architecture. The term is borrowed from interior design’s framing of “transitional design.” Transitional apps are, like multi-page apps, server-side rendered for fast initial loads, resilient since they work without JS by default, and provide a consistent experience with accessibility features built in. But like a single-page application, they also have a single codebase, fast navigation, persistent elements, and client-side state management.

Learn more about transitional apps, and how to get the best of both worlds in Rich’s talk.

#js #svelte