Comment by _fat_santa | Hacker News Reader

Comment by _fat_santa | Hacker News Reader

Parent Full thread

> Yes, tailwind might make css a lot easier, and github copilot might make coding a lot faster... but is this really easier than in the early 90ies, when you could just type <html> into notepad and make a website that didn't require any CSS or images or JS or even more than just the most basic html tags?

The thing is you can still do all of this. But we have since built tools and frameworks to let you still do this, while giving you superpowers. I think Svelte is the best example of this. You can create a dead simple site with it and have the result you are talking about, but the real power is now you can employ many of those advanced techniques that were reserved for large web apps in the same dead simple site.

> Is tailwind really easier to work with something like - let's say - pico.css? Of course if you want to do super-elaborate layouts, then probably yes - but if you embraced a more minimalist approach?

I've used tailwind quite a bit, it's killer feature is the fact that it's just intuitive. With most CSS frameworks, even minimal ones, I always refer back to the docs to see how they do a specific thing. With Tailwind you refer to the guide a few times but very quickly pick up how it does things. I think that's why it's so popular, I've typed out classes thinking "is this a thing", and almost every single time, it was.

The problem is that expectations changed, so now you're "required" to do more in certain contexts.

I absolutely loath frontend developments in companies with more than 5 engineers. In the past you may have found some spaghetti code and various abuses of jQuery but you could probably grasp the codebase in an afternoon. Nowadays every mid company codebase is a spaceship. For sure, you'll find a pseudo technical VP of engineering which enable whatever cool technology to be used and resume driven developers happy to pile on the latest Big Tech framework - which is likely to be an over-engineered, over complicated exercise in engineer retention and engineer roles marketing.

Then you have Pieter Levels pulling a mil per year with PHP and jQuery.

> In the past you may have found some spaghetti code and various abuses of jQuery but you could probably grasp the codebase in an afternoon.

My first job out of college involved a Rails codebase littered with conditionally rendered jQuery snippets. It was a nightmare to figure out what code was even loaded on any given page. Give me a modern JS codebase over that any day.

Yeah, as someone who started out in JS with procedural jQuery, moved onto prototype overloading shenanigans with classes, and now React with functional components - the JS ecosystem and tooling is still a huge mess, but I wouldn't want to go back to jQuery or prototype class hacks. At least a modern React codebase has a whiff of engineering to it. No matter how carefully we did stuff the old way at the companies I worked for, it sooner or later became an unmaintainable mess of hacks and overrides.

One big question: These "expectations" you are talking about, who's expectations are those?

Might it be possible that those expectations, and those requirements for doing "more", are not coming from the actual users/visitors to the websites - but rather from the companies owning the websites?

Because I, as a visitor of HN, come here for the IT news and the nerd stuff. I happily put up with the layout - because the sites actually meets my expectations for content. At the same time, the best, most modern, snazziest website ever... why would I go there (more than once), if there's no content of interest to me?

And that - to my experience - holds true for almost ALL visitors. They come for the content, and they put up with the layout. And this table-based layout with spacer gifs right here, imho is a lot easier to put up with, than some desing-heavy website that's perfectly optimized for conversion, engagement and retention rates and whatnot.

I think the actual problem is, that when we talk about "expectations" and "requirements" - we talk about what the HOST/SELLER wants - not what is best for the visitor.

> The thing is you can still do all of this. But we have since built tools and frameworks to let you still do this, while giving you superpowers. I think Svelte is the best example of this. You can create a dead simple site with it and have the result you are talking about

I don't know. I just tried to use Netlify to upload a simple static Html/Javascript page I made. Now I'm trying to figure out CORS errors. Pretty sure that didn't use to be a thing. For better and worse.

If you're trying to figure out CORS errors, it means you're either loading fonts or making XMLHttpRequests across domains. Neither of those were available in the 90s era OP is rhapsodizing about. You don't have to use the additional features/complexity of the past 15–20 years… but if you do, it's not surprising that things get a little more complex!

You actually do have to use HTTPS nowadays, and that's a non-trivial amount of complexity compared to just serving up a static page over HTTP.

Eh, most static site hosting provider offer it out of the box nowadays

What if I want to run a simple but non-static website? It was a lot easier to just do CGI with a small perl script in the 2000s.

Pretty much every web provider supports PHP, so it would be as simple as changing the extension from .html to .php

No it’s not. Certs are pretty dumbed down. So much so that there is a thing called certbot that just does it for you.

Yeah, we run certbot. It fails for some reason at least once a year and we have to do something to fix it. At the very least you have to find a way to run it on the regular and you can't forget about it or else your simple static website starts looking like malware. Tell me again how trivial it is for a 15-year-old kid using their parents' Windows 10 machine to get certbot running reliably.

IE had ActiveX since 1996, which allowed for things similar to Ajax.

I used https://neocities.org/ recently to make a simple static html website with no issues and no configuration. And I'm someone who usually uses the more "advanced" stuff. It's nice having the freedom to chase a little nostalgia sometimes.

Is that like modern geocities?

Exactly. Same in the spirit.

Welcome to CORS errors, so sorry you made the trip. :)

CORS will eventually click for you and then it will always make sense. Until then, sorry you’re going through the muck.

I honestly feel like CORS was invented just to get people to use reverse proxies more.

CORS enables site operators to prevent third-party sites from offloading requests for them onto clients, and conveniently reduces XSS exposure as a side-effect.

Question: Are people using tailwind for layout? Even when CSS grid is available? If so what is the benefit of tailwind layouts over modern CSS, beyond what tailwinds usually brings?

I am personally, for a couple of reasons.

(1) Tailwind uses utility classes that feel like syntactic sugar over full CSS, so I don't feel like I'm "using Tailwind for layouts" as much as "using useful CSS grid presets"

(2) Much like with margins and paddings, text sizes, and colors, Tailwind helps me "pare down" the number of different values available to me. Much like having preset "m-1", "m-2", etc. values helps me be more consistent, having preset grid columns and gap spacing helps me stay consistent and not go too crazy.

(3) Because I'm using something closer to CSS-wrapped-in-classes rather than a set of components built by someone else, and because tailwind gives both a naming convention and an easy mechanism for adding my own classes that fit right in to Tailwind's, if Tailwind doesn't give me the exact values I want for grid spacing, then I can modify theirs. If I need to add a couple new presets in addition to Tailwind's, then I can do so easily.

(4) Early on when CSS Grid was new, I got bit by some bad layout bugs that were very hard to find, and impossible to fix (they were browser bugs). So, while I'm sure the bugs I encountered have since been fixed, I'm a bit gun shy on grids. I occasionally use Grid when it makes sense (via Tailwind), but more often than not I find it easier, more flexible, and safer to just use nested flexbox cols and rows. For which I also use Tailwind, if the project is of suitable size.

To sum it all up better, I view Tailwind more as syntactic sugar over CSS that helps me build my own design system. So, I would totally use vanilla CSS for small projects that don't need a design system. But for anything more than that, I like Tailwind for the same reason I like using web frameworks on the back end: it helps me keep things structured and consistent and more maintainable, even if I could do it all on my own without the framework.

So it is basically, because you’re using tailwind anyway for styling, using it for layout is nice for consistency sake. I get that.

For (2) however I usually use CSS custom properties to reach for preset values, e.g. setting "column gap" to "var(--margin-inline-wide)", and "row-gap" to "var(--margin-block-short)" etc.

That's fair. If the question is "would I use Tailwind primarily for layouts and little else" then the answer would be "no". I would definitely use CSS variables along with grid or flexbox, because its essentially the same end with less complexity.

I would also point out that Tailwind only makes sense to me when I'm also breaking up each individual UI element like cards or buttons into reusable components, either using a reactive framework like React or Vue, or a server-side template system. I'm not sure the maintainability of Tailwind survives with more monolithic HTML pages.

You still use grid or flexbox but instead of writing a class adding grid:0 1 and referencing the class name you use a shortcut with predefined values.

Easier to remember and quicker to type. Centering content on a screen is class="place-content-center" which makes things easier.

This question doesn’t really make sense. Tailwind is just modern CSS, it’s just a composable shorthand for applying styles. There’s plenty of CSS grid utilities in Tailwind: https://tailwindcss.com/docs/grid-template-columns

I rarely use CSS grids like when I’m doing layout. The only times I use grid-template-{columns,rows} directly is when I’m using the auto layout (e.g. a stack of cards). Whenever I do an overall layout I use named grid areas with different sized cells (i.e. not repeat()). A layout scheme could be something like:

    .container {
      grid-template:
        "nav    .      header header header" auto
        "nav    .      .      .      .     " 1ex
        "nav    .      main   .      aside " 1fr
        ".      .      .      .      .     " 1em
        "footer footer footer footer footer" auto
        / 40ch  1em    1fr    1ex    15ch
    }

You could achieve something like this in Tailwind using nested flexboxes, but that is not the same as doing layout in CSS as you have to work with the shortcomings of the framework. Now I’m not saying it is not worth it, but saying it is the same is missing a huge aspect of how we do layout in modern CSS.

Tailwind is more of a method of writing CSS than a framework. Many people are writing modern CSS layouts IN tailwind, which you can consider a dialect of inline styles.

Reply on news.ycombinator.com