This is how I move fast and break nothing. By having fullstack type-safety from database all the way to the frontend with auto-completion. My current stack:<p>+ SvelteKit (could be Next, Nuxt, Solid or any other TypeScript framework)<p>+ tRPC (typed calls between frontend and backend, <a href="https://trpc.io" rel="nofollow">https://trpc.io</a>)<p>+ trpc-sveltekit (glues SvelteKit and tRPC, <a href="https://github.com/icflorescu/trpc-sveltekit" rel="nofollow">https://github.com/icflorescu/trpc-sveltekit</a>)<p>+ Prisma (ORM, <a href="https://www.prisma.io" rel="nofollow">https://www.prisma.io</a>)
There is so much "let me just see if this works..." <i>tap tapppy tap</i> .... "no... NO WAY... OMG IT WORKED!" with Svelte.<p>Very little surface area. It embraces your knowledge of plain ole CSS/JS/HTML and empowers you with reactivity and a means of if being able to add motion to your ui.<p>Newbs and Pros alike can build <i>fast</i> with it. That speed + reactivity allows your software to better keep up with your converstaions that make it all so. Thats insanely powerful.<p>It's soooo good. Congratulations to Richard Harris and everyone on the Svelte/SvelteKit Team! <3
As someone who wrote his first lines of JS in 2001, working with Svelte feels a lot like the good old days of JS when front-end was simple.<p>To me the main selling point is that the stack trace is actually useful for a change - you especially can find in there the line which caused the re-render and subsequent error.<p>JS frameworks/libraries by and large lost that feature a decade ago.
Related:<p><i>SvelteKit</i> - <a href="https://news.ycombinator.com/item?id=29902450" rel="nofollow">https://news.ycombinator.com/item?id=29902450</a> - Jan 2022 (3 comments)<p><i>My Evaluation of SvelteKit for Full-Stack Web App Development</i> - <a href="https://news.ycombinator.com/item?id=29806385" rel="nofollow">https://news.ycombinator.com/item?id=29806385</a> - Jan 2022 (125 comments)<p><i>SvelteKit Is in Public Beta</i> - <a href="https://news.ycombinator.com/item?id=26557886" rel="nofollow">https://news.ycombinator.com/item?id=26557886</a> - March 2021 (114 comments)<p><i>What's the Deal with SvelteKit?</i> - <a href="https://news.ycombinator.com/item?id=24996750" rel="nofollow">https://news.ycombinator.com/item?id=24996750</a> - Nov 2020 (2 comments)
Sveltekit has been an absolute DREAM to learn and use with my app! Been tracking their 1.0 progress closely and it's been incredible.<p>Sveltekit + TailwindCSS + FastAPI has made it super easy to whip up functionality and have a fine-tuned approach as well.<p>As someone else said, the "I CAN'T BELIEVE IT WAS THAT EASY" is an ongoing sentiment whenever I use it.<p>Looking forward to seeing it grow and gain more popularity
While I like Svelte, I fear it looses some of the flexible API-building enabled by React.<p>Specifically: since it uses a templating system, you can't pass around interface definitions easily:<p>- <a href="https://github.com/sveltejs/svelte/issues/3480" rel="nofollow">https://github.com/sveltejs/svelte/issues/3480</a> (no dynamic slots)<p>- <a href="https://github.com/sveltejs/svelte/issues/5381" rel="nofollow">https://github.com/sveltejs/svelte/issues/5381</a> (can't wrap children)<p>You can always find workarounds for these cases, often using `<svelte:component>`, but React's Javascript/Typescript-centric design avoids such issues before they even occur. For instance, I can trivially define a tabbed interface by mixing strings, JSX, and components, without imposing any DOM-structure. The component that reads this definition can use it to build a tabbed-view on mobile, and a master-detail-view on desktop. It could even build a table of contents.<p>In the definition, I can still work mostly with strings, but fall back to JSX in the rare case where I do need some advanced formatting:<p><pre><code> const tabs = [
{ name: "Tab 1", icon: <img ... />, content: MainTab },
{ name: <>Tab with <b>bold<b/> text</>, icon: <MyIconComponent ... />, content: SecondTab },
]
</code></pre>
Again, I like Svelte, but I'm not yet sure whether the better syntax is worth the reduced expressivity.
congrats team!<p>the livestream and meta discussions around the launch are happening here <a href="https://www.youtube.com/watch?v=N4BRVkQVoMc" rel="nofollow">https://www.youtube.com/watch?v=N4BRVkQVoMc</a><p>theres a full in browser tutorial as well: <a href="https://learn.svelte.dev/" rel="nofollow">https://learn.svelte.dev/</a><p>I've been keeping a reference implementation of a SvelteKit blog, inspired by @leerob's nextjs site: <a href="https://github.com/sw-yx/swyxkit/" rel="nofollow">https://github.com/sw-yx/swyxkit/</a> for the past year and it's now updated for 1.0. hope it helps someone get going!
I've been using SvelteKit since July of this year on downforeveryoneorjustme.com and it's easily my favorite Javascript framework at this point. I found Svelte made sense to me almost immediately and debugging issues has always been a breeze.<p>Congratulations to the Svelte/SvelteKit team!
Congrats to the team for this!<p>I have been building an application in SvelteKit and it's an incredible framework. I really believe it's going to become the dominant front-end framework in the next few years.
SvelteKit 1.0 is the one release I was actually waiting for. I've seen a lot of flashy stuff launch in the frontend framework recently but this one feels...genuine?<p>Huge congratulations to Rich and team! Hope I'll be able to contribute to Svelte's growth someday.
Congratulations to the whole SvelteKit team!<p>I've been using Svelte / SvelteKit for 1.5 years now – it is without comparison the most enjoyable and productive web f̵r̵a̵m̵e̵w̵o̵r̵k̵ language I've ever used.<p>I'm lucky enough to work with Svelte / SvelteKit full-time. I'm gratified that the site I help build and maintain is included in the SvelteKit showcase: <a href="https://kit.svelte.dev" rel="nofollow">https://kit.svelte.dev</a><p>Trading Strategy: <a href="https://tradingstrategy.ai" rel="nofollow">https://tradingstrategy.ai</a>
I'm just completing a job using svelte/kit, tailwind, postgres, typescript.<p>Actually, I was new to the entire stack, but it went smooth as butter.
(Though I have plenty of experience with JS, HTML, CSS, other databases, etc.)<p>IMO, svelte and sveltekit are well designed and have a great dev experience.<p>LOL, as I was writing this he was apologizing on the stream for the breaking changes. That was a bit of a pain, but not really that bad. My only real gripe is using folders to organize both layout hierarchy and route hierarchy is going to turn out to be a mistake.
If you're just learning SvelteKit, check this tool out: <a href="https://github.com/svelte-add/svelte-add" rel="nofollow">https://github.com/svelte-add/svelte-add</a><p>It will save you a ton of time by making it really easy to add integrations to your projects (like Tailwind, Bootstrap, Supabase, Jest, etc)
There is a plethora of javascript frameworks: React, Vue, Svelte, Remix, etc. If I know nothing about front-end development, and would like to learn one that is:<p>- Intuitive<p>- Suitable for small projects as well as large projects.<p>- That is here to stay, i.e. either adopted by many companies, or its adoption curve is going up.<p>Which one should I pick? Would Svelte be a good choice?
For anyone who might have missed the announcement hidden in the launch video, there's Svelte Auth now from the Vercel NextAuth team: <a href="https://vercel.com/blog/announcing-sveltekit-auth" rel="nofollow">https://vercel.com/blog/announcing-sveltekit-auth</a>
Great news and looking forward to how this goes. I still find it incredible that the frontend javascript ecosystem hasn't found a reliable and productive contender yet, a framework you could be sure would be still relevant without too much changes in 5+ years, something like what Ruby on Rails is for full-stack.<p>Some would say that React/NextJS has this role but I have to disagree. When using React/NextJS you still have to rely on third party library for routing, state management, querying etc. like React-Query, React-Router, Redux (Next has a router but you still need libraries to do the rest). Some of these libraries change a lot, some become less relevant, new libraries emerge, and in the end when you start a React project you must go through the "library shopping" step.
Congrats to Svelte. More than a couple years ago, I gave my team the opportunity to go React, Vue or Svelte after giving them time to test them out. React was basically the legacy code that we were familiar with. This was right around the first hooks release and after using it for a while, and we had a nasty redux state manager, and nothing about React felt truly great for DX besides JSX, and that was everywhere already.<p>I'm happy with Vue but every time I look at Svelte code I get a bit jealous. Its a very nice environment, one I would pick up for personal projects if that time was there, and I wish Svelte godspeed and a huge adoption curve.
All the praise for SvelteKit in this thread peaked my interest. But where would I start?<p>I'm currently looking around to find a modern "toolkit" to write a new webbased frontend for our traditional desktop app. It's goin to be more or less CRUD with lots of tables/grids.<p>Currently I favour vue.js with Quasar because of all the tooling and ressources it offers. It looks like it's easy to start with a traditional "navigation on the left, content on the right" layout.<p>I need nothing fancy, it's going to be business CRUD for a small circle of users. Deployed on premises at our customers sites.
While the breaking changes were rough this year, the new structure is a huge improvement over before. It is now extremely clear the order that items are loaded, and what is loaded on the server vs client. Form actions are also amazing.<p>Congrats to the team and thanks for all the hard work!
Fantastic news! Although I loathe writing libraries [1] in Svelte, I love writing apps and kit is great extension to server side. I like similar to Remix push for Web APIs, like forms for mutations etc. I like nested layouts with data endpoints. I like that most of the internal state is visible as reactive store.<p>[1] Creating complex type definitions for more generic components is hard and require knowledge about internals.
Exciting to see this hit 1.0! The new tutorial site looks great and I love that the sidebar is searchable now. Also the Cmd-K search on the docs (<a href="https://kit.svelte.dev/" rel="nofollow">https://kit.svelte.dev/</a>) is awesome to have as well.<p>I've been really enjoying working with Svelte for the last year or so now. My main project is a video editor, running under Tauri and using plain client-side Svelte, but I've also used SvelteKit to throw together a few little admin dashboard-y things and it's been very quick to get started with. Right now those projects are pretty lightweight too, just SvelteKit with TypeScript, the pg-promise package to connect with Postgres, and a handful of handwritten SQL queries.<p>Congrats to the team! Looking forward to see what the future holds for Svelte[Kit].
I'm a React expert, but whenever I can I choose Svelte, it really is a joy to use. I've been using SvelteKit for some time now, it's great to see it out of beta so I can shill it to more projects.
SvelteKit is nice to rapidly develop websites (after some initial training/familiarization/minor frustrations stage), I only wish it was a library w/ perhaps a separate CLI utility and the framework optional; ie- if they exposed some core features as re-usable functions or one-off CLI commands to build a static site with its clientside window.location/cached routing technique that makes sites feel blazing fast for example.<p>This way you wouldn't have to drop in and adopt the entire framework just to get one or two features.
I’ve been using SvelteKit since very early beta, and it’s been amazing to watch it evolve along the way to 1.0. It is by far and away the most intuitive framework I’ve used and I can’t say enough good things about it.<p>Congratulations to the team, and keep up the good work!
How so people feel about client side navigation? Browsing svelte.dev it appears back/forward navigation now requires a request each time as browser cache is no longer usable.<p>Page refresh also seems to reset scroll position but that might be unrelated.
Been using Sveltekit and love what the community has done to the framework. Makes life of a developer very straightforward and I'm sure that Sveltekit will rise to be a dominant frontend framework soon.
There are a handful of them here - <a href="https://trpc.io/docs/example-apps" rel="nofollow">https://trpc.io/docs/example-apps</a>
Congrats all Svelte team and community, highly antecipated project. Played a lot with the early releases. To me, Svelte suite is the best option for front-end applications.
Is there any option if I want to do traditional (non JS) SSR but also want to share an API endpoint for both browser and other use cases?<p>Seems like a JS frontend framework or a JS SSR is the only option for such use case. If SSR and API force a JS backend that leaves a lot of the benefit that other languages bring to the table and effectively limiting you to 1 (JS) or 2 (TS including) languages. Seems like a sad state of affair in that regard.
Thanks for finally having a SvelteKit tutorial :)<p>I was using SvelteKit, but I really need the tutorial to get better at it (also to adapt better to the changes that have happened).
I've been waiting for this for months! Credit to the team. Looking forward to the weekend to play around with it. Also, super excited for svelte 4
Is Svelte and in extension SvelteKit somehow the next step in the evolution of frontend frameworks? From what I know it has more fine grained reactivity than for example React or Vue and should therefore just run more efficient? Or has the approach of Svelte also drawbacks that I am not aware of?
Perfect timing!<p>I literally started working on a project in Svelte after spending like two afternoons trying to do it in React.<p>Svelte is such a God send. So much simpler and powerful than React. Not to mention the fact that React only handles the UI layer but is too unopinionated w.r.t. the application architecture.
I enjoy Svelte a lot and congrats on the release. However the job market for Svelte seems really weak, at least for US dev salaries. I hope Sveltekit increases adoption, as it's a nice alternative to NextJS
What would be the best route to upgrade a medium sized project from say `1.0.0-next.263`?<p>There's 327 intermediate versions up to this one and a considerable amount of breaking changes.
Congratulations on the milestone!<p>I'm a bit confused, does this mean I can use Prisma with Sveltekit out of the box? It's server side rendered like a typical expressjs app?
I've been following Svelte since it first appeared on the State of JS survey. So cool to see it evolve over time and happy to see all the hard work pay off!
While most of the comments here seem positive… A custom template language is like another programming language to learn (to make mistakes in). I prefer JSX/TSX which is closer to reusing HTML.
Why is there a new frontend-whatever-work / tool every week? Database stuff is fairly stable, so is backend stuff. Browser APIs seem stable to me too? Why can't you guys decide that this is how things are best done