Skip to content

social fracture

Today, I was able to try out Bluesky, the Twitter ripoff. It’s very faithful if you’re used to Twitter.

I’ve been using Mastodon, lightly, for most of the year. It’s where the most relevant chatter was since Twitter’s fracture.

By a miracle, and help from OldTweetdeck, I’m still running the previous version of Tweetdeck for now. It’s on life-support and could die at any time.

Besides the light use of Facebook and Instagram, and having signed up for Pixelfed but not really using it, it’s a weird time for social media in 2023.

To recap:

  • Twitter is dying. Its owners want it to be called ? but nah, not gonna do that
    • Tweetdeck still serves its purpose for me, a general idea of what Twitter people are saying, but it’s far more conservative hyperbole now. However, still my social attention spend
  • Facebook serves people older than 30 crowd just fine, I guess, but I am allergic to its slurping up of all data to do who knows what. No thanks
  • Instagram is barely useful, mostly for the Stories feature, but just not much to enjoy beyond that
  • I wanted Pixelfed to replace Instagram, giving me control back, but I just haven’t committed
  • Mastodon is the 2nd primary attention and most of my posts, which still isn’t a lot
  • Nostr, well, is really so niche right now, you probably haven’t heard of it. But, for the few notable people I see there, and can’t really see elsewhere, it’s slightly interesting
  • Bluesky is not really gonna be much for me until I get a Tweetdeck like instant feed refresh tool. I don’t like manually refreshing Bluesky to see new posts, never did about Twitter, eithe

I won’t bother with any other social networks. It’s already too much for me.

Ideally, when magical time and effort appear in my life, I’ll set this site up to just blast out to half the list up there, Indieweb style, and start writing here on this site. Or not. It’s a lot of work, and the UI for WordPress and Gutenberg is not ideal, whether with Classic Editor or Gutenberg.

Also, I still have trust issues with the web in general. OpenAI, ChatGPT, all these new 2023 AI services, this site and my content on all the sites above and more have fed into their dataset. It’s annoying.

How do I find a balance here?

Bookmarked Unsolved Mysteries – Opening Theme (youtube.com)

This is still one of the most effective creepy theme songs and I love it!

generational divides

Older: That’s crazy
Younger: That’s wild

Older: Completely or Absolutely
Younger: ? or 100%

Older: I kinda don’t…
Younger: I low-key don’t…

Older: Know what I mean?
Younger: IYKYK

Older: That’s weird
Younger: That’s sus

Older: I got your back, my friend
Younger: I got you, fam

Older: You’re too much
Younger: You’re so extra

Older: You’re the best!
Younger: You’re the GOAT

just thrown away like that

I had to look it up just now because I don’t remember when I started using it.

It was around May of 2009. I don’t even think it was possible to use you browser to access it, either. It was before iOS had an app.

Twitter didn’t even own it yet!

This was two years after I started using Twitter in March of 2007; Twitter permitted for us to sign up at SXSW that year so I was an early user even though I didn’t really understand its utility and it was still finding its place.

Tweetdeck is how I primarily interacted with Twitter all this time. It’s consistent. It provided near real-time updates without me refreshing. It’s my go to, to see how the public is reacting.

Then, this past Sunday, it was yanked away from me and replaced by the new version. A version that’s going to be locked down behind a paywall after the end of July. And this new version just doesn’t compare or stand a chance.

Sure, I have other ways to figure all of this out. But Tweetdeck was there for me through a long span of my adulthood.

I could see all kinds of people confirming that I just felt an earthquake. I got to know smaller personalities who weren’t well-known. I also could see what celebrities were thinking. So many pointless brands hawking to get my attention.

It was always there. I learned a lot. I was always entertained.

If it’s locked up and thrown away from me, so be it. I won’t miss what it is now.

EDIT July 9 – They are allowing the old version to be used again, but I cam only assume it’ll still be hidden behind a paywall after the end of the month.

relearn using dishwashers

Bookmarked
Detergent packs are kinda wishy-washy (Dishwashers Explained)Detergent packs are kinda wishy-washy (Dishwashers Explained)

Detergent packs are kinda wishy-washy (Dishwashers Explained)

I’m writing this post to clear off some of the dust from this site. I’m linking to a YouTube video that goes deeply into using dishwashers and how so many of us have forgotten how to actually use dishwashers well. In fact, we really should stop hand washing too often to conserve water and reduce our bills since dishwashers are so efficient AND effective with less use of everything.

Four steps to effective dishwashing:

  1. Turn on the facet water and let it get as hot as it can. The dishwasher needs this hot water from beginning to end.
  2. Fill the pre-wash cup with detergent. Using a tablet? Drop a tablet into the dishwasher’s bottom. I’m using plain Finish tablets for this
  3. Fill the main wash cup with detergent. This is usually the one with a door that you lock into place until mid way through the cycle. This is where the fancier tablets can be used, but Finish is also just fine
  4. Check your rinse aid level. Do you see any in there? Fill it up, it adds a pop to the cleaning!

And seriously, if you do all four of these steps, you should be seeing a better dishwashing result every time! The biggest benefit you can take away is the pre rinse with both hot water and soap. If you get this right, the rest of the cycles do their job great.

Now, let’s see if this syndicated a nice little Twitter link into a Tweet. I haven’t tested this feature in a while!

custom roms rock

I am loving using an open source android custom rom! I can pick and choose who gets what and I’m in control of everything. This is a game changer. This deserves a blog post…

This is a test for using quill on this blog

RSVPed Attending IndieWebCamp East

IndieWebCamp East 2020 is an online gathering for independent web creators of all kinds, from graphic artists, to designers, UX engineers, coders, hackers, to share ideas, actively work on creating for their own personal websites, and build upon each others creations.

ghost peppers ouch

Lesson learned: ghost peppers affect you the whole way through the body! One accidental ingestion and 12 hours of intermittent heat ???

react’s separation of concerns

It’s funny how patterns and styles get recycled. We’ve seen clothing styles of the 60’s get reintroduced and reused decades later. The TV show Mad Men brought back mid century modern style into the 2000s. And we’ve seen it happen with coding patterns as well.

React Components

One of the first React things I learned is how to create React Components, Capital-C.

export default function NavButton() {
	return(
		<button type="button">Switch Step</button>
	)
}

To use this button, just import it into other files and apply it in the JSX. Straightforward.

Props == HTML Attributes

Buttons usually need to do things, so let’s give this some interactivity.

function NavButton(props) {
	const { transitionCallback, isDisabled } = props

	const handleClick = () => {
		transitionCallback()
	}

	return(
		<button
			onClick={handleClick}
			disabled={isDisabled}
		>
			Switch Step
		</button>
	)
}

2000s me looked at this increasingly used React pattern curiously, because I see onClick={handleClick} attached to the button element. For so many years, often from jQuery or Javascript, I avoided applying event handlers to elements. But here React made that a pattern and my mind goes back in time.

My concerns are separate

I spent the 2000s and into the 2010s learning about, what I eventually started reading from industry folks and books, a computer science term called Separation of Concerns. The idea makes sense on the front-end for many reasons and I became fairly dogmatic about it.

With Separation of Concerns, these three concepts stand on their own:

  • structure (HTML)
  • presentation (CSS)
  • behavior (JS)

By the middle of the 2010s, I wasn’t mixing JS and CSS into HTML, CSS into JS or HTML into JS. We keep them separate, .html, .css, and .js.

By contrast and in practice, however, having worked with WordPress all that time, it was often a losing battle to decouple these languages, quick jQuery or CSS fixes were little inline sprinkles here and there.

<?php
function ratio_calculator() {
    $html = '<style>
	.form-inline .form-group { display:block; margin-bottom: 10px}
</style>
<form id="form" name="form" method="GET" action="#" role="form" class="form-inline">
	<div class="form-group">	
		<label for="RT3" class="t3">RT3</label>
		<input class="form-control" type="text" name="RT3" id="RT3">
	</div>
    <input type="button" class="btn btn-primary" name="button" id="Submit" value="Get Ratio">
</form>
<div id="ratio" style="color:blue;font-weight:bold;font-size:120%"></div>';
return $html;
}
add_shortcode('calculator','calculator_form');

Yuck! I had to grit my teeth and move on.

Then came modern JS frameworks, cemented by React, slowly blowing this concept up. React’s raw JSX syntax requires to cross the decoupling line by adding HTML-like attributes called props containing Javascript and often CSS. A different and controversial method called CSS-in-JS is not only accepted but widely adopted by many React developers. And then there’s the other CSS direction of using utility first libraries like Tailwinds polluting HTML classes, but don’t get me started on that concept!

Separation of Concerns Remixed

In this new paradigm of component-first development, the abstraction for separation of concerns takes on a different look. The separation of concerns is loosely defined within the components themselves. Let’s take a look at what this means.

Here’s my first iteration of the navigation button control component to go from the initial state to the timer state.

function NavButton(props) {
	const { transitionCallback, isDisabled } = props

	const handleClick = () => {
		transitionCallback()
	}

	return(
		<button
			style={{padding:'1rem', backgroundColor:'white'}}
			onClick={handleClick}
			disabled={isDisabled}
		>
			<span className="visuallyhidden">Switch Step</span>
			test
		</button>
	)
}

This code shows a clear mix of all three languages within a Javascript function, with an HTML-like syntax inside of a Javascript return statement, inline CSS in a button element, and an inline onClick event handler calling a function.

Before I started learning how to make websites, the source code of the web documents used similar syntax that kind of looked like the above.

<head>
	<script type="javascript">
		function handleClick() { 
			var transitionCallback = props;
			transitionCallback(); 
		}
	</script>
</head>
<body>
		<input
			align="left"
			clear="left"
			bgcolor="white"
			type="submit"
			onClick="handleClick();"
			disabled="disabled"
			value="test"
		>
</body>

When I first saw React’s syntax, you can imagine how alarmed I was by its seemingly reversion back to the 1990s styling of code. My mental model is so conditioned that this bothered me for a long time, still does to some degree.

Two what end?

As I see modern libraries continue these practices, it appears the pattern of everything inside of JS will continue into the foreseeable future, one way or another. Discussions around native Web Components in the document brings a more dogmatic potential back, but not in its current iteration.

I’m always excited for the future, but I think there will always be a part of me looking of ways to scale back the abstractions and packages needed to build the modern web. Part of that will be my outdated mental model for separation of concerns. Let’s hope browser makers can find better ways to manipulate the DOM and CSSOM without breaking the clients and mixing our concerns!