@vanilla@social.spicyweb.dev avatar

vanilla

@vanilla@social.spicyweb.dev

Vanilla has never tasted so hot. Join a fabulous community of web developers learning how to use “vanilla” web specs like HTTP, HTML, CSS, JavaScript, & Web Components.

Produced by @jaredwhite

This profile is from a federated server and may be incomplete. Browse more on the original instance.

vanilla, to webdev
@vanilla@social.spicyweb.dev avatar

“React Is Not Modern Web Development”

@jaredwhite’s personal thoughts on a great entry by @collinsworth into the growing body of work which details why greenfield projects are better served by other frameworks…or none at all.

https://thathtml.blog/2023/08/react-is-not-modern/

vanilla, to CSS
@vanilla@social.spicyweb.dev avatar

Another good addition to the corpus of why is bad news for and is actually an indication of deeper concerns about our industry, by Jeff Sandberg:

https://thathtml.blog/2023/08/tailwind-death-of-craftsmanship/

vanilla,
@vanilla@social.spicyweb.dev avatar

@kevin Rails World just platformed Adam Wathan and DHH, the creator of Rails, has been out telling everybody they should use it.

Phoenix ships with it as a recommended default:
https://phoenixframework.org/blog/phoenix-1.7-final-released

Next.js "now ships with TypeScript, ESLint, and Tailwind CSS configuration by default"

https://nextjs.org/docs/getting-started/installation

vanilla,
@vanilla@social.spicyweb.dev avatar

@jjtbsomhorst All of the links provided in the excerpt at That HTML Blog and the article by Jeff Sandberg are great places to start. ✌️

Bootstrap wasn't necessarily bad at the time it came out. It pioneered a lot of concepts. But modern CSS has come incredibly far since. Advanced grid layouts are now a few lines in a vanilla .css file—literally was impossible before! And design systems built via CSS variables mean even Sass' days arguably are numbered.

vanilla, to Podcast
@vanilla@social.spicyweb.dev avatar

Justin Fagnani (@justinfagnani) made a memorable appearance on the @jsparty to talk all about the popular base class: Lit. 🔥

It’s a great episode to listen to regardless of if you’re new to Lit or you’ve already been using it for a while.

https://thathtml.blog/2023/08/this-podcast-is-lit/

vanilla, to webdev
@vanilla@social.spicyweb.dev avatar

"In a World…" 😉

> Imagine a world where pages and templates can easily be written using familiar concepts and then statically and/or dynamically rendered and sent to the browser. From there, you can once again target certain tag names for progressive enhancement as client-side web components. Call that hydration or islands or whatever you like…

https://thathtml.blog/2023/08/node-frameworks-web-components/

vanilla,
@vanilla@social.spicyweb.dev avatar

@bp That sounds dreamy! (Yeah, I want that too…)

vanilla, to webdev
@vanilla@social.spicyweb.dev avatar

The demise of and as an indie-first, "static site" hosting company feels like an end of an era. But why did it have to happen like this? Where did things go wrong? And which companies can folks turn to for streamlined, pragmatic web hosting and architecture?

Here's my take on it, serving as a reply of sorts to @remotesynth's excellent coverage of the topic:

https://www.spicyweb.dev/farewell-jamstack/

vanilla,
@vanilla@social.spicyweb.dev avatar

@veronica That one's a rant all right! 😂

vanilla,
@vanilla@social.spicyweb.dev avatar
vanilla,
@vanilla@social.spicyweb.dev avatar

@veronica Progressive enhancement is the new progressive enhancement 😉 👏

vanilla,
@vanilla@social.spicyweb.dev avatar

@dmje @remotesynth @tomhazledine Perhaps the state of the art today is really great…but back in the early 2010s things were painful. Sites hacked, plugins failing, flaky hosting, hassles with databases, sites going down because of traffic spikes or whatever…just lots of problems. 🤷🏻‍♂️

vanilla,
@vanilla@social.spicyweb.dev avatar
vanilla,
@vanilla@social.spicyweb.dev avatar

@remotesynth @dmje @tomhazledine So it's Next.js's world, and we all live in it… 😬

vanilla,
@vanilla@social.spicyweb.dev avatar

@remotesynth @solopx From a mindshare standpoint, either Hugo or Eleventy are probably the two most obvious successors to Jekyll and both excellent projects. I (@jaredwhite) am of course partial to Bridgetown, being as I work on it, but like with Jekyll you'd need to feel comfortable setting up a Ruby install.

vanilla, to webdev
@vanilla@social.spicyweb.dev avatar

Did you know handleEvent() was a thing? I didn’t! It's a really awesome way to add event listeners to web components (although it works with literally any JavaScript object).

Check it out:

https://thathtml.blog/2023/07/handleevent-is-mindblowing/

vanilla,
@vanilla@social.spicyweb.dev avatar

P.S. If you’re working with a shadow root inside your component, you’ll likely want to attach the event listener to that rather than the element itself… (see updated article, link at top of thread)

vanilla, to webdev
@vanilla@social.spicyweb.dev avatar

Latest posts on That Blog:

Subscribe via email & RSS so you don't miss a thing!

https://thathtml.blog

vanilla, to webdev
@vanilla@social.spicyweb.dev avatar

“New Projects Galore! A Blog and a Podcast”

Get all caught up on the thrilling projects which recently launched alongside The Spicy Web:

That HTML Blog and @justaspec Podcast:

https://www.spicyweb.dev/new-projects-galore/

Una, to random
@Una@front-end.social avatar

If you thought last year was an exciting time for CSS and web UI... (well, because it was)

I just made a list of all the APIs that landed/are expected to land/strong chance of cross-browser support by the end of the year and

HOLY MOLY MY FRIENDS 🤯

2023 is definitely our year!

vanilla,
@vanilla@social.spicyweb.dev avatar
vanilla, to webdev
@vanilla@social.spicyweb.dev avatar

I swear, I'd lose my <head> if it weren't attached to my <body>!

vanilla, to random
@vanilla@social.spicyweb.dev avatar

From @matuzo:

> I've heard several people say they've tried Cascade Layers but didn't see any changes, so they dropped them again. That can also easily happen to you when you structure your CSS in layers for the first time. I can explain why.

https://www.matuzo.at/blog/2023/cascade-layers-are-useless/

vanilla, to webdev
@vanilla@social.spicyweb.dev avatar

A wise tip by @cferdinandi:

> When I choose tools, when I evaluate them, one of the biggest questions I ask myself is: “Does this work with the grain of the web, or against it?”

Very well stated!

https://gomakethings.com/the-grain-of-the-web/

vanilla,
@vanilla@social.spicyweb.dev avatar

@vintprox Sure, that's perfectly understandable. The challenge seems to be fighting the inertia of using legacy third-party libraries long after the platform specs themselves have greatly evolved.

vanilla, to webdev
@vanilla@social.spicyweb.dev avatar

are often derided as not applying to the "branch" or "app" or "framework" components in your project. That's really not the case…they can fulfill important roles at all levels of the frontend stack.

Nevertheless it's true that web components are particularly awesome for "leaf" components.

Think of every element you wish already had. Say a <drawer>.

Just build your own <my-drawer> and make it feel as built-in as possible! Use it everywhere you would a native <drawer>. 🙌

vanilla,
@vanilla@social.spicyweb.dev avatar

Possbily even better, many of these leaf components have already been built and available via well-regarded open source component libraries. Shoelace, for example, comes with a drawer! Pull in <sl-drawer> and boom, you're ready to roll.

Modern Web UI should be seemless blend of built-in elements and community-supplied elements. Focus on building your actual websites and services. And let the platform do its job.

  • All
  • Subscribed
  • Moderated
  • Favorites
  • megavids
  • thenastyranch
  • rosin
  • GTA5RPClips
  • osvaldo12
  • love
  • Youngstown
  • slotface
  • khanakhh
  • everett
  • kavyap
  • mdbf
  • DreamBathrooms
  • ngwrru68w68
  • provamag3
  • magazineikmin
  • InstantRegret
  • normalnudes
  • tacticalgear
  • cubers
  • ethstaker
  • modclub
  • cisconetworking
  • Durango
  • anitta
  • Leos
  • tester
  • JUstTest
  • All magazines