While Bootstrap certainly abstracts CSS away for you in a way that you can get by without knowing much about CSS (for simple things), Tailwind is just tokenized CSS. You can't use Tailwind without knowing CSS or learning CSS in the process.
The problem with tailwind is it does away with separation of concerns and messes up HTML, like the old styling tags in HTML. We moved on from those for good reasons.
While this game is quite nice and fun to play, I find it kind of tempting to just experiment with the values until you solve the current problem instead of focussing on the "How does it really work" aspect of the problem, which would lead to a deeper understanding...
One way to solve this could be to allow more freedom in solving the problem as well as a small penalty on more than 2 or 3 tries.
I write frontend code and especially with CSS it's always trial-and-error, "bruteforcing" as you describe it. Sometimes you just gotta play with it until it works, while utilizing what you've learned from the previous times whacking at similar problems.
Giving players so much freedom that they can easily identify and execute a grindy, brute-force but boring strategy is an extremely common problem in game design. Fault is irrelevant, it is the game's problem if the player stops having fun because they got trapped in a psychological pit tying to circumvent the rules when playing by the rules is ultimately easier.
This is a tradeoff so requires some balance, but OP's suggestion is simple, unobtrusive, and probably effective.
The whole purpose of a game is to complete a goal. Good games gamify you to achieving that goal. If the goal is to learn CSS and the game hasn't guided you to achieve that goal then it's failing at its purpose. Blaming the player for not playing correctly is an unbelievably bad take. The mechanics of the game should punish the user for doing the 'wrong' thing and reward them for doing the 'right' thing.
I used to work at a place where weekly we'd have a show-and-tell with the team for about 30 minutes. One week I brought this and I let people who don't code give answers to see how far we'd get. It's interesting to see some who "got it" and others who struggled.
Overall people loved it! I think it was a great way to develop some basic programming skills in people who would otherwise never code in their entire life. For years after I did this my coworkers would bring it up as kind of a "You do _that_ all day?", which I thought was funny because this is like the easiest part of my job and they thought I was a magician for it but it was nice to see they respected the work more because they did it themselves a little once.
I thought Flexbox was a CSS gamechanger and then came Grid, which is so amazing and predictible.
Really, the only pain I have left with CSS is when I get into weird cases of "I want a component to use up any remaining space that its siblings don't use, but one of its children should use up everything it gets that its siblings don't use, and then overflow scroll if there's not enough space."
There's a whole bunch of cases where I find these weird interactions between flexbox and grid and some sort of priority for sizing layout that I don't quite understand. I suspect this is mostly on me, but it's something that, unlike flexbox and grid, still feels not straightforward.
I still consider those years to be the golden years of the web development. When the fruits of web standards movement started to appear. Alas, then came react and all the good stuff was thrown out of the window. I guess tag soup is palatable, when it is buried deep in node_modules.
Nowadays, I think the opposite. I feel a pang of jealousy and regret when I load a page from before CSS Zen Garden that uses tables for layouts. It still exists and works perfectly. I love how I can automatically date it in my mind, like period furniture or buildings. Unlike the thousands of pages that I made at the time, which are either gone or broken. I yearn for the html files that I lovingly handcrafted as unique pages. I destroyed them myself so that they could use a one-size-fits-all CSS solution. And they could in turn destroy each other with each new site redesign. If I ever get back on the indieweb, I'll be creating each page as a single file and allowing them to age gracefully.
The website links to Flexbox Froggy but via a link that requires you to register an account, but you can access it directly via https://flexboxfroggy.com/
Readit News
For someone such as myself, doing backend, this gave me a solid foundation for building modern UI apps while keeping them lean and simple.
No Bootstraps, no Tailwinds.
That feels pretty lean and simple to me.
Disagree. Tailwind abstracts lots of CSS away; you can get away with using it with only having a surface level understanding of CSS.
As we know, a little knowledge can be a dangerous thing, especially in web development.
Tailwind on the other hand does nothing on that regard. If you don't know Grid or Flexbox, then Tailwind will be just as much of a pain, as pure CSS.
One way to solve this could be to allow more freedom in solving the problem as well as a small penalty on more than 2 or 3 tries.
Giving players so much freedom that they can easily identify and execute a grindy, brute-force but boring strategy is an extremely common problem in game design. Fault is irrelevant, it is the game's problem if the player stops having fun because they got trapped in a psychological pit tying to circumvent the rules when playing by the rules is ultimately easier.
This is a tradeoff so requires some balance, but OP's suggestion is simple, unobtrusive, and probably effective.
1. Good: The answer is verified by checking the absolute position. You can pass the level with any valid answer -- including non-grid variant.
2. Ugly: It send google analytics for every attempt.
Overall people loved it! I think it was a great way to develop some basic programming skills in people who would otherwise never code in their entire life. For years after I did this my coworkers would bring it up as kind of a "You do _that_ all day?", which I thought was funny because this is like the easiest part of my job and they thought I was a magician for it but it was nice to see they respected the work more because they did it themselves a little once.
Really, the only pain I have left with CSS is when I get into weird cases of "I want a component to use up any remaining space that its siblings don't use, but one of its children should use up everything it gets that its siblings don't use, and then overflow scroll if there's not enough space."
There's a whole bunch of cases where I find these weird interactions between flexbox and grid and some sort of priority for sizing layout that I don't quite understand. I suspect this is mostly on me, but it's something that, unlike flexbox and grid, still feels not straightforward.
(A long time ago) it was an amazing source to learn CSS, and get design inspiration.
2019:
https://news.ycombinator.com/item?id=21050501
2018:
https://news.ycombinator.com/item?id=18753358
2017:
https://news.ycombinator.com/item?id=14041367