1 Thing A Week

Weekly posts from the mind of Charanjit Chana

Week 334: Momento: the sports ticket scrapbook app

Every now and then, a new web app in the vein of Wordle comes along. On and off for a while now I've been playing Football Grid, a game where you guess the 9 different players who have played for a combination of two clubs or a club and a specific country.

I wanted to tweet a suggestion, only to find out the account had an app in the app store and I went to take a look.

Momento is a sports scrapbook that helps you keep track of the various games you have attended as a fan.

Read the post from week 334

Vanishing Clock

via Kottke

Link to this notable item

Week 333: Cities at similar latitudes

Something I had long planned to look into was cities of at a similar latitude because it always surprises me when I stumble across the fact that New York is closer in latitude to where the Mediterranean is rather than somewhere like London. Given New York gets snow I would have expected it to be higher than it is. This tweet made me want to finally take a look at it:

Read the post from week 333

Week 332: 3 Months with Apple Fitness+

Included with my Apple Watch Ultra 2 was a trial of Apple Fitness+, I waited a little before getting it going, but was keen to see what the service was like.

Overall, it is a great service but for my own body I pushing myself too hard with longer workouts on my exercise bike. I've had to take a bit of a break but the plan is to get back on it tonight.

The trainers are all very good, instructions are clear and the on screen graphics help to push you along. The full integration between devices is brilliant, Apple have nailed it as a non-line coaching set up. I really enjoyed lots of the workouts I did and there were plenty that pushed me well out of my comfort zone too.

Things that were not so great with Apple Fitness+

Let's get the bad things out of the way, there aren't many.

My biggest annoyance was how things are filmed when a new move is introduced. For cycling you always see the leader's legs so matching their speed is up to you. For other workouts, like HIIT for example, you might feel like you're doing it right until the camera angle changes. Too many times I was too far gone in burst before realising I wasn't set up right.

My only other annoyance was around zone information when cycling. If you're doing a generic indoor cycling session, you get zone information which helps you understand how much effort you're putting in and I find motivating. When in an Apple Fitness+ session with a trainer you're often asked to 'go all out' but without the context of zones, I don't have much to go on. I think zones should be available in all cycling workouts or at least made an option.

Audio gripe

I do not understand the appeal of Spatial Audio with these workouts. My iPad or iPhone mounted on a bike, Spatial Audio makes it feel like everyone is a little further away. Maybe others find it useful and more immersive, but I found it pointless.

The great things about Apple Fitness+

The coaches are all enthusiastic. My favourite partners for riding were Bakari and Sherica. When Cory was in the room too, you know you're gonna have a good session. Wierdly, I found Cory a great partner for the room because he's always smiling and matched my rhythm more often than not.

Honestly, all the coaches were motivating and never let you down with a dull or pointless ride, but Bakari and Sherica were the best persona's for me. If you're using Apple FItness+, give them a go!

Being able to use your phone, your iPad or your TV (via the Apple TV app) made it a great option. Sometimes I'd take over the living room, other times I'd be zoned in with the iPad. Paired with an Apple Watch made it all seamless. With my various headphones it's great too. No need to worry about Spatial Audio, in my opinion and a recent update let you put more emphasis on the soundtrack. This helped me enjoy it all more because sometimes a great song comes on that get's you in the right frame of mind and this helped to stay there.

It's worth mentioning that they've done a lot of work to make sure you can do all sorts of work outs that are tailored to the equipment you have, even if that's none. It's pretty accessible even if you're not using a bike, treadmill or weights.

Being able to build a custom program is great and there are automated options to. Just tell it what kind of activities you want to do and your plan will be ready in seconds. I didn't always appreciate a notification saying 'there's still time' when it gets to about 7pm when I know I'm almost free from work and family duties to be able to work out, but the reminders did keep me on track and even if I was tired I did do something more often than not.

Is Apple Fitness+ worth it?

If you have the equipment at home, then it's pretty cost effective. Cheaper than Peloton, but I didn't realise they had free lessons. That would be a great move for Apple to introduce a subset of classes you could take but right now it's a paid experience no matter what.

I think it's worth the price. I need to figure some stuff out personally so that I'm not pushing myself harder than I should. Once I've done that it will be something I'm looking at diving back into.

Read the post from week 332

Julius Caesar and Leap Days

I'm a day late on this. I only became aware of the ending in 00 & divisible by 400 during the last leap year which is odd to me given that one of the leap years in my life time was for the year 2000! Maybe we were all to pre-occupied with the Y2K bug to worry about leap days.

Link to this notable item

Apple Cancels Electric Car Project

When the next version of CarPlay was originally announced, it left me scratching my head:

If Project Titan (Apple's rumoured car project) is real, then Apple have struck an amazing deal here to be able to integrate with an unbelievable number of cars that will be hitting the road from late-2023 onwards.

Turns out both Aston Martin and Porsche announced right at the end of 2023 that cars with the new CarPlay integration were coming in 2024. I was personally surprised it happened because there seemed to be a bit of resistance to the announcement back in 2022.

This outcome seems best to me, Apple do great software and hardware and are the best at bringing both together. The premium cost for an Apple device are palatable because of their performance and longevity but Apple aren't going to sell a family car for family car money which limits it's reach.

The Apple Vision Pro might be very expensive now, but with time and great adoption, the price will surely come down to make it more accessible. That never happens in the car industry.

Link to this notable item

Week 331: Swift Playgrounds on the iPad Mini

As I mentioned previously, I am diving into SwiftUI at the moment. It's both enjoyable and frustrating. Working with PHP is very straightforward, in my opinion. Errors are obvious, configuration is easy enough and it's extremely well documented. Not that SwiftUI isn't, but I am not used to the same types of languages so there has been a learning curve.

I don't know if it makes it harder or if the form factor is irrelevant, but I am learning mostly on my iPad Mini. The device is capable but the on screen keyboard makes it tough. You can only see a handful of lines of code and the previews are mostly obscured if writing an app or working on the preset Playgrounds.

Read the post from week 331

Introducing Apple Sports, a new app for sports fans

I'm building my own, Liverpool specific, app at the moment using SwiftUI so the timing is terrible. Apple Sports in almost unbelievably basic when compared to Apple News, but it is content rich once you drill down into games.

My app is for a single club, so a smaller niche. I'll keep building anyway, it's useful for me if no one else.

Link to this notable item

A list of tautological place names

Link to this notable item

Things Unexpectedly Named After People

Of all of these, PageRank was the one that blew my mind. It was named after Larry Page! For more than 20 years I just assumed it referenced the rank of a page 🤦‍♂️.

Clicking through, I also didn't know Max Factor was named after Max Factor!

Link to this notable item

Week 330: Revisiting the world of DHTML in 2024

My first adventures with web development involved devouring DHTML books from the library and constantly browsing online for how these elements worked and interacted together. There was a good topic on DHTML from the past on HTML Hell over Christmas.

Read the post from week 330

Week 329: Yamaha YHT-1840 Review

Having recently upgraded our home theatre system, I shared the Yamaha YHT-1840 on Good Gear Club and thought it was worth a little more of an in-depth look here.

Yamaha YHT-1840 setup

Read the post from week 329

We don't need more sleep

Link to this notable item

Honda Offering Wireless Apple CarPlay Upgrade for 2018-2022 Accords

Well done, Honda. I'd love the same for my Mercedes. I've looked at dongles to make it work but not sure how reliable they would be so have stuck with the wired version for now.

Link to this notable item

Greenhouse Effect

Link to this notable item

Week 328: Getting to grips with SwiftUI

Swift Playgrounds has proved to be a very interesting app on the iPad. Armed with a Bluetooth keyboard, I went through some of the courses to learn more about Swift and it gave me a pretty good grounding in it's concepts.

Once I'd made it through the Learn to Code and Get Started with Apps guided playgrounds, I decided to see what I might be able to build out and I've been prototyping in SwiftUI for a few weeks now.

What I'm struggling most with though is how to make use of certain layouts that Apple have used. I've nailed a few things like navigation and tab based views, but haven't quite figured out lists. The main reason is that the defaults are not what Apple fall back on in their own apps. There's quite a lot of exceptions they have in their own use of SwiftUI from what I can see. Once I've figured a few of those out I think I can build out a really good app and I'd love to have it out in the App Store this year.

Watch this space!

Read the post from week 328

Why Girona winning LaLiga could be bad news for Manchester City

I for one am delighted with this revelation. I wouldn't say I oppose multi-club ownership but it's become very murky in the way that transfers occur. I think there should be a limit on how many sales can be made between clubs that share ownership. Loans too, clearly the number of players shared is going to be higher because of the underlying relationship but cap it.

If the two teams finish in the same position, the one with the highest club coefficient (City in this case) would be awarded qualification.

No club would sanction it, but in terms of avoiding a cartel, I feel that the club with the lower coefficient should be the one to qualify. They won't have to enjoyed the same windfall from being in the competition before so at a disadvantage from the start. The clubs with more money and clout should be pushed to be at their best, not to just fall back on their reputation.

via Kottke.org

Link to this notable item

Week 327: Danke, JĂĽrgen

I already wasn't feeling my best last week only to bit hit with the news that JĂĽrgen Klopp had decided to step down as manager come the end of the 2023/24 season.

Genuinely devastating news for Liverpool fans. I didn't know how to feel.

Jurgen Klopp wearing sunglasses and holding a bottle of bear at the Liverpool Trophy Parade in 2022. He can be seen waving at fans.

Read the post from week 327

Week 326: The Indie Web should be easier

Earlier this month, I came across a post from Gilest Turnbull titled Make The Indie Web Easier and I couldn't agree more.

we need more tools for it. We need simpler tools for it. And we need to make installing and using them trivially simple.

For building products and larger teams, additional steps make sense. Maybe it's tests, maybe it's abstraction or maybe it's a lack of trust, but whatever the reason I get why there are all sorts of tools around web development.

But if you want to kickstart an idea, it can feel like a minefield.

The example that sticks in my mind was when reviewing a candidates project that was pure front-end and technically just two pages in total. It weighed over 140MB. One hundred and forty. That wasn't the candidates fault, but the fault of the tutorial they followed or the course they had taken.

As a comparison, I couldn’t have made it much simpler to get started with a pure front-end site with just HTML, CSS and basic JavaScript than I did for my DEV #dohackathon submission site, The Neptunes. You can see the repo on GitHub but the kicker was the deployment script. That needed some digging which a developer might not want to dive into... but it did give me an insight into a deployment platform that meant less configuration overall than if I'd spun up and administered a linux box with Apache/NGINX and other bits and pieces by hand.

I would love the web to be simpler and easier than it is at the moment. Tools like HTMX and Hotwire look quite interesting as a way of simplifying how we make sites more interactive.

I'll leave you with the closing paragraph from Giles:

If we truly want to open up the web for everyone to publish on, we have to make it easier. Let’s give people choices. Let’s give people options for tools they can set up and use, with no more knowledge than the knowledge they already have.

Read the post from week 326

Week 325: Glowing hover effect with CSS

All inspired by a tweet from @aman684__, I wanted to look at building a hover effect that mimicked a pixelated interface that would glow as you dragged the mouse across it. Just without JavaScript and only driven by CSS. It felt like :has() would make it a breeze, but it turned out to be a bit tougher than expected.

My first attempt was with a table layout. It worked as a small demo but when I tried to build it out I turned to programatically building a long list of selectors that then caused my browser to lock up. It was an unexpected outcome.

I stopped and took some time to think and decided to go for a div based layout so that I wasn't having to work with rows and columns as separate concepts from the cells themselves. I basically ended up being able to always select n number of elements before and/or after the one being hovered. There's still a quirk where hovering too close to the left or right causes the glowing effect to appear on the opposite side. With a bit of effort, I reckon that could be overcome but I think the demo I have is a good place to pause.

The CSS explained

@function selectorBuilder($count) {
  $selector: '';
  @for $i from 1 through $count {
    $selector: $selector + "+ div ";
  }
  @return $selector;
}

A function that takes the number of items to iterate through and then append + div that many times.

.container {
  display: grid;
  grid-template-columns: repeat(20, 1fr);
  margin: 0 auto;
  width: min(100vw, 1000px);
}

.container div {
  --r: 255;
  --g: 255;
  --b: 255;
  --opacity: 0.1;
  aspect-ratio: 1;
  background-color: rgba(var(--r), var(--g), var(--b), var(--opacity));
  border: 1px solid #222;
  grid-column: span 1;
  width: 100%;
}

Create a square grid layout, using variables for building the various color values which then makes it easier to override different bits later on, depending on their visual vicinity to the square being hovered on.

.container div {
  &:has(+ div:hover),
  &:has(#{selectorBuilder(1)} + div:hover),
  &:has(#{selectorBuilder(17)} + div:hover),
  &:has(#{selectorBuilder(18)} + div:hover),
  &:has(#{selectorBuilder(19)} + div:hover),
  &:has(#{selectorBuilder(20)} + div:hover),
  &:has(#{selectorBuilder(21)} + div:hover),
  &:has(#{selectorBuilder(38)} + div:hover),
  &:has(#{selectorBuilder(39)} + div:hover),
  &:has(#{selectorBuilder(40)} + div:hover) {
    --opacity: 0.5;
  }
}

There are lots of variations of the above where I am building out the selectors. In this case, the squares that looking like they're immediately around the item being hovered on are given an opacity of 0.5.

.container div {
  &:has(#{selectorBuilder(2)} + div:hover) {
    /* properties */
  }
}

As an example, the above generates this selector:

.container div:has(+ div + div + div:hover) {
  /* properties */
}
If the div is followed by 3 divs, and the third one is being hovered, then the div (3 before the one being hovered) will be caught by the selector.

Given my first attempt used up a lot of resources, I don't think this is a production-ready solution. That's before you factor in the quirks of how it behaves at the edges. But it's something that wouldn't have been possible without :has(). I'd long wanted a parent selector, but :has() just opens up a whole world of possibilities that I hadn't really thought about before..

Read the post from week 325


View more posts in the archive or discover more notable items.