me: I need to make a simple web-app for a project
also me: I need to learn some react basics for a job interview

WHY NOT COMBINE THE TWO? good question, why not?

christ, the first example in the react docs has a minor error.

not giving me a good feeling about the quality of this software

okay so my first attempt at writing any react code resulted in a hydration error and also my UI elements are rendered black on black, making them invisible
What obvious layout am I missing?

I updated it a bit.

(I should add ĄŽERTY just in case I ever flirt with any Lithuanian tranfems)

I've accidentally put it next.js into an infinite loop
it's constantly trying to recompile the typescript

okay I think I'm gonna give up on getting autocomplete to work for now.

There's like half of a result on google for the error I'm getting

or maybe I just need to clientside render the whole thing
okay it's all there and working, it just looks like shit because I haven't properly laid it out
OK, I laid it out. This was 99% easy and straightforward, and 1% WHY IS THE ADD BUTTON PLACED STUPID
New layout, because I realized I needed another drop-down
Added some types for keyboard type
things I still need to do:
* make this webapp list the existing keysmashes in the database, not just add new ones
* make the add-dialog a dialog/drawer, not permanently taking up half the page
* figure out how we're gonna do redaction/anonymization. Some of the 26 users in the database (and future users) may not want to have their names in any future public release.
* hook it up to the heatmap
* render the keysmash as an animation, with handedness highlighting
* fix dark mode. I didn't have a migraine the last time I was coding on this ✅
WHY WON'T THEME SWITCHING WORK

okay my theme switching does kinda work if I hardcode it to dark mode, then I can switch the theme

but it only affects the theme, not the background.

But the background is set by the system theme, so if you have the theme set to lightmode and system them set to dark, you get a black background and black UI form

So it's just invisible

<CssBaseline /> was the issue. I wasn't including it
so I can switch themes but it's not getting my browser theme, hmmm
oh it was but my manual color theme setting was overriding it.

okay it's working.

react is a tiring framework.
everytime I need to make a tiny change, I end up getting mad for an hour and then I'm tired of programming for the day.

@foone why are you citing on my phone

@foone is it interesting to split physical ones by if they're...split, or not?

I'm not sure if it'd affect the keysmash patterns if each hand is more isolated to its own half-keyboard, but it seems plausible.

@LionsPhil A bit. I've had some split-keyboard users approach me, but I think I'm just declaring that out-of-scope so this project will stop feature creeping
@foone came over from the hellsite to see if there was more info here  I am keeping an eye on the research

@foone align-items my behated/beloved...

... In a pinch can always slap something silly like "height: 100%"- wait that would break if you have two rows of flex stuff wouldn't it

@foone Oh god, Material Design rises from it's tomb to ruin your day.
@foone this is a very "How It Started" to "How It's Going" thread.
@foone I wonder if it’s possible to determine the layout from a single keypress of a specific key the app tells you to press (by position)
@foone I mean, I might argue that you should flirt with some Lithuanian transfems in order to use ĄŽERTY.
@foone are you focusing only on Latin script? Cos there’s JCUKEN (Russian layout) – https://en.wikipedia.org/wiki/JCUKEN
JCUKEN - Wikipedia

@foone
Swedish and other Nordic layouts (including Dvorak versions - "svorak" for Swedish). Turkish. I'm sure many others.

How important is it for you to know the physical layout of the keyboard? Could you get away with a subset of keys? Let it be user configurable?

@foone maybe like GB varients of qwerty? Only affects some special characters
@Baa @foone Also maybe JIS qwerty aka japanese layout (few characters like parens off by one, plus extra keys)
@foone left single-hand Dvorak, right single-hand Dvorak?
@chrisjrn handedness is handled (no pun intended) at a different layer
@foone ok, but single-hand Dvorak then?

@foone @chrisjrn

the most famous single-handed layout: Maltron

@foone i wouldn't say "obvious", but there is an alternative to the french AZERTY keyboard, BÉPO (it's kinda like the french version of Dvorak), that a bunch of my friends and colleagues use
@foone Dvorak, but with the original number ordering
@foone That's how it goes
@foone nobody hydrates a pizza like you!
@foone Even "good" React is Byzantine and slow. The good news is the inefficiency creates jobs...
@mirth @foone There's a Keynes quote in here somewhere.
@foone does that mean you need to drink more water or?
@foone It took me a moment to figure out that "Hydration error" is an actual thing in react and not just a way of saying it made you spill your drink.
@foone
Eight minutes lol
@EndlessMason and it took me about 7 minutes to get around to opening the docs
@foone
I'm going to guess you're not on the slow release meds then
@EndlessMason I am! but I was trying to juggle like five things at once which distracted me!
@foone What is it?
@williamoconnell the first CodeSandbox embed has a "Show More"/"Show Less" toggle but all it shows/unshows is a blank line at the end of the code

@foone React is one of the biggest piles of crap I’ve ever seen.

Even the basic premise of it (kind of “let’s build a browser in the browser”) is deeply flawed.

@thomasfuchs yeah that's been my impression too, but a job I'm applying for does some basic react code-a-longs for their tech interviews, so I'd like to be familiar with it.
@foone The whole thing is built on top of two massive anti-patterns (the order of calls to methods [useState and useRef, and thus nearly every hooks] changes their outputs, and implementing logic with exceptions [don't look into suspend too much]) and is so complicated to use correctly that they had to release a precompiler to make it bearable. Of course it's absolute garbage.

@kawazoe @foone yep.

I'm used to javascript being a language you have to defend yourself against while writing it.

Doesn't justify making needing to defend yourself a feature of a library.