When You first look at this app, it looks so simple...but then Rich starts explaining all the neat small quirks You can achieve with Svelte to make this app as awesome as possible. For me, amazing learning experience.
If you wanted to show the button when the input is valid using Tailwind you could put class="peer" on the input element and class="peer-valid:block" on the button.
Yes. This actually shows a common problem with the vast majority of tailwind complaints: it's a much more robust than meets the eye. It's difficult to "get" on a side-project weekend.
For someone who had worked with different convoluted and opinionated css frameworks over a decade, I see tailwind as the holy grail of what css frameworks should have been in the first place. No more fighting over default styles, no more sass/scss. Tailwind is just simply beautiful! People who have argued tailwind to be not good absolutely have no idea.
Try the VS Code plugin 'Inline Fold' by Mohammed Alamri - it automatically hides/folds all your Tailwind classes. Then set a keyboard shortcut to hide/show the classes
I've been struggling to find a good ORM for javascript / typescript. I've used knex, then tried prisma, then moved to drizzle. When Rich said "they all suck." I really agree. They are *good enough* but not quite there yet imo.
Raw SQL with string interpolation and type coercion is where it’s at. Best experience IMO. But I’m biased, I think every software engineer should know at least basic sql
For sql, hands down the best way I've seen across all languages is sqlc in golang, it's not an orm or query builder, you write raw sql in a file, and it generates typesafe functions for you. Honestly just amazing, would be interesting to do it for js
Sqlx for Rust is very similar. You inline SQL but at compile time it validates the SQL, placeholders, etc and generates the correct return types for you
@@pearceodegard582 Yes, AFAIK with sqlx the query must be known at compile time so it cannot contain any dynamic data in the query itself. Then you place placeholders in it and call the query with values for them, which is escaped by the database itself rather than doing string manipulation before sending it over.
I had the same view of Tailwind as you before trying it out, now I can't go back. It actually solves the key sole problem prior to its creation - management of styling your application.
Seeing Rich speak ill of all the trendy struff is kinda reassuring to me that I'm not crazy. Also he thinks a lot in the way that I think, like mutating the data for the sake of a more responsive presentation, like why complicate stuff when you can simply get things done?
@@thedelanyo Backend serves 90s style html to the browser. All dynamic behaviour happens through href links, forms and inputs. Full page reload on every interaction.
You make sure you use form actions and the data loading feature to handle CRUD. Make sure there are no features hidden behind logic that requires JS on the client. So basically don't do thinks like "on:submit|preventDefault={handleSubmit}" etc.
Big fan of your work Rich, but I'll be brutally honest with you, I am worried that you are working at vercel.They are (rightly so as a VC Backed company) prioritizing the commercial interest over the community that make frameworks a success. I know people will call me crazy but the quality of the nextjs has decreased and is becoming increasingly lockled in to vercel. It is for instance, quite hard to selfhost a decent serverless xp for next if your not using vercel. The svelte core team and community are refreshingly pragmatic and seems to favor simplicity. I am worried that those two realities are not just compatible. I hope you'll be able to fight against the nextification of svelte and if not that your tc is worth it. With all respect and gratitude for the hard work. Tim.
lol, embedding SQL. That's insane. For so many reasons. lol. I assume he's done it for brevity and presentation reasons, but even so - how you cannot value a proper ORM is beyond me. I've found I disagree with a lot of what Rich Harris talks about - but he does do a lot of things right, as well.
The creator of Skeleton (a Svelte UI library) was asked the same question not long ago. His answer: " I did some testing during the last major refactor of the modal system. It has some a11y benefits, but honestly I found it incredibly difficult to work with. Especially in framework like Svelte - it doesn't work in a "Svelte-like" manner, it seems more geared towards folks writing apps in vanilla JS. We may revisit in the future, as I'm typically keen and prefer native browser solutions, but as it stands it's likely not going to be a consideration anytime soon Just FYI, we recreate most of the a11y benefits now - include focus trap, etc. So don't let that scare you away from our implementation [...] It's been a few months so some of the specifics have escaped me, but I recall the open and close mechanics relied on modifying a open attribute. There wasn't a great way to programmatically trigger it as we desired. And it really didn't jive well with the singleton approach we use for our notification features (ex: toasts) [...] (when asked about the close event on an HTMLDialogElement) Yeah you have to have a reference to the element - which is not great in Svelte to start with, as that means you have to start awaiting lifecycle events (ex: onMount) and then it relies on events rather than being able to control the state directly. [...] It totally makes sense for apps not build with something like Svelte, React, Vue, etc - where you have simpler and reactive state management. So I get why they went that path. " I'm tired of copy-pasting so I suggest you join the discord if you wanna see the rest / ask him a more specific question yourself
The dialog element spec is implemented horribly. It requires you to use the `openDialog()` function - unlike every other html element ever. Simply adding the `open` attribute does nothing. I'm simply baffled by just how awful that spec is. It makes it practically unusable for most scenarios.
