Alice Averlong🏳️⚧️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
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
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
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
* 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.
theme switching is a bit ugly but it works. I'm intentionally leaving it as crap for anti-perfectionism reasons
ewww. not a good sign when you look up a database and one of the first how-to guides they give is how to plug it into your AI
sarah tonin 
9pfs
The Orange Theme
Alice
Janne Moren@foone
To keep with the whole "state of software in 2026" aesthetic, you should have the "dark mode" selection highlight be lighter than the background, and the "light mode" highlight be darker. Switch them around when you switch the mode.
To keep with the whole "state of software in 2026" aesthetic, you should have the "dark mode" selection highlight be lighter than the background, and the "light mode" highlight be darker. Switch them around when you switch the mode.
gloriouscoware you sure you're using React?
because if you're getting mad you might actually be using Angrular
@gloriouscow I should make a video where I respond to my shitty app. you know, a react react video
@foone when I'm struggling with CSS I just eat some beans
tailwind really does make it easier
@gloriouscow pffft
both a reaction to your joke and an impression of the sound it makes
Emily_S
Deven Phillips
Bennolius 😷⚡@infosec812 @foone it's made by Facebook for their ridiculous purposes so therefore it is the obvious and best choice for my simple website which actually shouldn't need JS at all. See also: GraphQL
it's pronounced 'yagoda'@foone working with react in the past taught me there are no right ways to do things, only bad and worse.
Jocelynephiliac 
@foone it really is it's own world that just happens to use some browser bits. I made it a special interest for six years and got incredibly good with it, but then reached nirvana and realized I never wanted to work in an SPA again. No
matter how much optimization you do, you're still shipping megabytes of JS.
I do still love JSX, however, and built my own componentized template engine on it.
Johnny Xmas@foone why are you citing on my phone
LP🔸Light up the night@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
🌰🐈⬛ Kathee 🐈⬛🌰 Stop shoving AI down my throat it's not a d@foone came over from the hellsite to see if there was more info here 
I am keeping an eye on the research
I am keeping an eye on the research
Saphire Lattice@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
Ian
SilverStar Ebonclaw@foone this is a very "How It Started" to "How It's Going" thread.
connie
Human Brain Enthusiast@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)
Josh 
George Haritonidis@foone are you focusing only on Latin script? Cos there’s JCUKEN (Russian layout) – https://en.wikipedia.org/wiki/JCUKEN
@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?
Becky
C.Missing this one, but it's a bit niche:
https://www.reddit.com/r/MechanicalKeyboards/comments/1kfbo0/
@cazabon I've not flirted with any Klingons recently so I don't THINK I need this one
Pink
grawity
Daniel González@foone You added some QWERTY localizations, you opened a full can of worms. Like there are also es-ES and es-LA variants.
PsyMar aka Sam@foone I wonder if you could do some sort of automatic detection for variant QWERTY layouts, like Ñ is on latin american keyboards where US keyboards have semicolon, and Swedish keyboards have Å to the right of P and äö to the right of L