HN user

unculture

247 karma
Posts2
Comments55
View on HN

Repository pattern is useful if you really feel like you're going to need to switch out your database layer for something else at some point in the future, but I've literally never seen this happen in my career ever. Otherwise, it's just duplicate code you have to write.

It's quite cold a lot of the time in Northern Europe, and people who are cycling to commute there often really aren't going very fast so won't sweat much.

You can also get "moisture wicking" clothes, that might help with a certain amount of sweat.

There is quite a lot of e-bike use in Amsterdam and Copenhagen. Google "bakfiets" - it's a whole "suburban parents with a family size e-bike" cliche (but a good one!).

If you're making a wholesale design change, you should expect a wholesale code change. If you're making a small change to a component that's the same every everywhere you should ideally expect to make that change in a single place. If you don't have that, that's a problem, but it's not Tailwind's fault.

Global defaults are a separate matter. As are prose styles / styles for UGC text because you don't know the HTML structure ahead of time - by all means use the cascade here, but for almost but for everything else you have two maintainable options:

1) Some CSS naming system or scoping system, e.g. BEM where you enforce proper naming and selector complexity limits (except in rare circumstances). This is extremely hard to do in the long term on a big project.

2) Leverage the component system / template system of whatever system you're using to make reusable components and use utility styles.

Using the cascade extensively on a long running project is a recipe for maintainability disaster - you will face a wild goose chase for the file you want every time you want to make a change, and then another wild goose chase for unexpected changes because your selectors weren't specific enough.

I'm also pretty strongly of the opinion nowadays that separation of concerns of CSS and HTML is a false separation - the single concern is how a thing looks on the page.

You really need to cut out these accusations of dishonesty - it’s a bad look.

He’s not saying “separation of concerns and good naming practices” are bad things, he’s saying that separation of concerns between HTML and CSS is mostly a false separation (it’s the same concern - making the UI look right) and that good naming practices are hard - best just do that in one place, the component that address the concern with both style and structure.

Option 1: Find a visual error, open devtools, find the nearest most descriptive class or id (.primary? Oh no…), open IDE, global search in styles folder structure (most likely but not the only place to find CSS) for “.primary”. 40 files returned. After 15 minutes find a file that looks like it might be the right one. 10 minutes to understand the CSS (lots of advanced CSS in here…). Find the cause of the visual error, make the 1 line change. 30 minutes - job done.

Option 2: Find a visual error, open e.g. React Devtools, find the component name, open the IDE, find the component source file, find the HTML, change the utility style class, job done - 5 minutes.

These are not contrived examples. I had a one liner take 40 minutes to find in a codebase a couple of weeks ago. Not an exaggeration.

I really used to believe in separation of concerns but I don’t any more, because of all the time I’ve had to spend fighting with “option 1” codebases over the years. Pretty much any big codebase with normal CSS is going to be an “option 1” eventually unless it’s the work of a single good CSS developer (rare skill), or a team where someone who’s a good leader also cares about CSS enough to enforce a convention like BEM in perpetuity (even rarer skill).

Anyone building anything complex these days is using some component abstraction - whether it’s client side or not - to manage complexity. May as well make use of it for styles if it’s already there.

The reason that there’s a backlash against separation of concerns, the cascade, and (low) specificity is that each of these things is a complete disaster for maintainability in the long run.

One note in making an example of that Catalyst button. If you wrote out all the styles required to do the amount of work that button is doing it would also be extremely difficult to understand, and what’s more, it’d be in a completely different file to the single thing that gives it any meaning - the HTML.

Lots of people, particularly Laravel people, are doing static analysis with tools like PHPStan or Psalm. Over time there have been more and more type-oriented features introduced to the language too. Obviously you can't catch everything, but it's a dynamic language so that's the trade off you've signed up for.

There is a line to be drawn somewhere. If you set your naming level too high, then it's not clear what you're doing in the details. If your naming level is too granular, then you start to lose clarity because you can't see the wood for the trees.

Regarding the problem of a developer new to the codebase being told to change the text size in a specific place; Tailwind works well in this specific situation.

At the beginning of your project, you will have chosen a (or accepted the default) text size scale. The new developer will probably choose the next largest step in the scale and step back. The new size will be in harmony with the rest of the project because it matches the scale. If this specific element is repeated elsewhere in the project, then it will be part of a component and all instances of that component will receive the change.

The right place for a considered name in this example is at the component level.

It’s more like “i.e. shall we inline all our variables” / avoid naming things at all.

Adding a name for something is a weighty task that’s orthogonal to the task at hand. If you can avoid the name without losing understandability then it’s a win.

The other side of that coin is that if you add a name it has to be worth the effort.

In CSS, a number of techniques developed over the years in response to the maintainability challenges of even well thought out, traditional good practice CSS in large projects. These techniques (eg. BEM) required class names for almost every element you need to add styles to. This was to avoid long selectors that a) are hard to understand, even for experienced CSS developers and b) are tightly coupled to and generally not co-located with the HTML.

Tailwind gives us away to avoid those having to choose those names, which just took a long time and lots of conversation if you wanted to get them right.

Yes, it’s literally in the HTML so it’s coupled, but it’s co-located. The maintenance story is much simpler than with BEM and much much simpler than with trad CSS. Lower effort for a better long term result - it’s a win.

There’s no imaginary grid here, m-2 and p-2 are just setting margins and padding. The 2 is a point in a table of sensible defaults for those values. You are free to set your own scale or just use your units of choice if you like. The defaults are well thought out though, and usually work well.

The whole point of Tailwind is that the worry about naming CSS classes goes away for most part. It turns out you can safely skip the vast majority of those granular naming decisions and conversations - that’s a massive amount of saved time and brain cycles for everyone.

If you’re using eg. BEM you have to come up with all these granular names for subcomponents that really no one cares about apart from you (the frontender I mean). If you’re not using BEM or similar and going for longer selectors in the main, then you have a coupling issue between the structure of your CSS selectors and the structure of the HTML that may make maintenance in the future harder.

You can absolutely travel the same roads, but there is something about the speed you are travelling that opens you up to really noticing the little details of the landscape around you.

Here's some illustration sites / products I collected for a recent project as possible resources / inspiration:

  - https://storytale.io/
  - https://control.rocks/
  - https://picchustudio.webflow.io/
  - https://undraw.co/illustrations
  - https://craftwork.design/downloads/friday-illustrations/

It's probably a function of to whom a one man band can effectively market. Consumers don't buy SaaS and a single person couldn't afford a consumer level brand ad campaign anyway. Big companies mean big company sales cycles and demands - procurement departments, compliance etc. Other SaaS companies are easier to find in places like HN, and they're maybe more predisposed towards buying from lone hackers like this one.

Writing well 6 years ago

Tell that to Dave Trott, who is an influential British advertising copywriter. All of his writing comes in the form of one sentence paragraphs. There's whole books of it! https://davetrott.co.uk/