<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:content="http://purl.org/rss/1.0/modules/content/">
  <channel>
    <title>Alex Bates</title>
    <link>https://alexbates.dev/blog</link>
    <description>Writing from Alex Bates on web and mobile development, side projects and things learned along the way.</description>
    <language>en-gb</language>
    <lastBuildDate>Fri, 23 Oct 2026 13:03:10 GMT</lastBuildDate>
    <atom:link href="https://alexbates.dev/rss.xml" rel="self" type="application/rss+xml" />
    <item>
      <title>Hacking a £30 photo frame into a family dashboard</title>
      <link>https://alexbates.dev/blog/hacking-a-photo-frame-into-a-family-dashboard</link>
      <guid isPermaLink="true">https://alexbates.dev/blog/hacking-a-photo-frame-into-a-family-dashboard</guid>
      <pubDate>Fri, 23 Oct 2026 13:03:10 GMT</pubDate>
      <description>Turning a cheap Android photo frame into a dashboard built around our household, and how easy personal software has got.</description>
      <category>blog</category>
      <category>tech</category>
      <content:encoded><![CDATA[<p><img src="https://a.storyblok.com/f/287788953313969/2000x1506/d7600fde2c/frame-kitchen.jpg" alt="" /></p><p>How&#39;s it going? This one&#39;s a side project I&#39;ve been wanting to write up, partly because it&#39;s fun and partly because of what it says about building software right now. A few years ago, hacking a photo frame and writing a custom dashboard for one household would probably have been a month of evenings I&#39;d never have found. With AI tools, it was about 10 hours.</p>
<p>A while back I listened to a podcast where someone talked about a cheap digital photo frame they had lying around. They opened it up, realised it was basically an old Android tablet in a frame, and decided to hack it, switching off all the manufacturer&#39;s software and running their own dashboard on it instead. <a href="https://github.com/wesbos/photo-frame-dashboard">Wes Bos</a> has since open-sourced the whole process, so I decided to give it a go.</p>
<p><img src="https://a.storyblok.com/f/287788953313969/2000x1506/d7600fde2c/frame-kitchen.jpg" alt="The photo frame on the kitchen counter showing the family dashboard"></p>
<h3>What&#39;s inside</h3>
<p>I picked up a 10.1&quot; Humblestead frame from Amazon for about £30 or thereabouts. Under the slideshow it&#39;s running Android 6 from 2016 on a little Allwinner chip, with a web engine from 2015. It also ships with an over-the-air updater, a factory test app and the vendor&#39;s photo app, which keeps a remote-command channel open back to the manufacturer&#39;s servers. Not something I wanted on my kitchen wall.</p>
<p>Mine came with a debug build of Android that already gave full root access over USB, so I could skip the trickier unlock routes other people have needed. After a full (and fairly paranoid) backup (the manufacturer doesn&#39;t publish the firmware anywhere, so this is the only copy), I swapped the home screen, switched off the vendor apps, upgraded the web engine to a 2022 version and installed a small full-screen app that opens my dashboard on boot. Nothing on the frame calls home any more. It just shows a web page from inside the house.</p>
<h3>Three parts</h3>
<ul>
<li>The dashboard is a plain JavaScript web app built for the frame&#39;s 1280×800 screen, with a home screen plus calendar, tasks, shopping, photos, smart-home controls and a Claude screen. It&#39;s light by day and dark by night, and it dims at 10pm and switches off at 11.</li>
<li>The server is a small Python app (I called it homehub) running on a Raspberry Pi 3 Model A+. It does all the talking to Google, the weather and our devices, and hands the dashboard one bundle of data every few seconds. All the logins and keys live here rather than on the frame.</li>
<li>And the frame itself, with the unlock, backup and clean-up above.</li>
</ul>
<h3>Making it ours</h3>
<p>I had a lot of fun deciding exactly what each screen should show, based on what we actually check during the day:</p>
<ul>
<li>The weather is tied to our routines. Instead of a generic forecast, it knows when the dog walks and nursery runs happen and flags rain, wind or cold for those exact times.</li>
<li>Calendars for me, the family, work and UK bank holidays, all on one timeline.</li>
<li>Our shared Google Keep shopping list, synced both ways, so ticking something off on the frame takes it off our phones too.</li>
<li>A photo slideshow from a shared Google Drive folder, read by the server through its own Google Cloud service account, with each photo captioned with where it was taken.</li>
<li>Our Tapo smart plugs, controlled directly over Wi-Fi without going through TP-Link&#39;s cloud, plus play, pause and volume for the kitchen speaker.</li>
<li>My Claude Code sessions and plan usage. I can also ask Claude to &quot;add a task for tomorrow to pick up the Vinted parcel&quot; and it appears on the frame.</li>
</ul>
<p><img src="https://a.storyblok.com/f/287788953313969/2560x1600/6285ab2d06/dashboard-home.jpg" alt="The dashboard's home screen: clock, weather, calendar, photo, lamps and Claude usage"></p>
<h3>Software for one household</h3>
<p>I can&#39;t imagine anyone ever selling this product. It&#39;s built around our dog&#39;s walk times, our nursery runs, our shopping list and our lamps, and it only has to work for one household. That kind of software used to be out of reach. It was never worth the time, so you&#39;d make do with whatever a generic app or gadget offered, but that&#39;s changed a lot over the last couple of years.</p>
<p>Nearly all of this was built with Claude Code, and I spent most of my time deciding things (what goes on each screen, what should happen at 11pm, what&#39;s useful versus clutter) rather than typing. The parts that would probably have stopped me cold a few years ago took minutes, like reverse-engineering an Android frame, talking to smart plugs over their local protocol, getting into Google Keep without an official API and deploying it all to a Pi.</p>
<p><strong>It feels like it&#39;s never been easier to build something that fits your own life exactly, rather than bending your routine around someone else&#39;s product.</strong></p>
<p>You do still need to steer it, though. We mocked up layouts before writing any code, every piece was reviewed before moving on, and anything that touched the frame waited for my explicit OK. The reviews caught real bugs along the way, like a &quot;tomorrow&quot; task saving as 9am. But being the one making the decisions, rather than the one doing all the typing, turned something I&#39;d probably never have started into a weekend-sized project.</p>
<hr>
<p>All in it came to about £70 and roughly 10 hours, and it&#39;s now living upstairs showing us the day at a glance. The code&#39;s on <a href="https://github.com/ajbates93/photo-frame">GitHub</a> if you fancy building your own, and Wes&#39;s repo is the place to start for the frame itself.</p>
<p>Cheers!</p>
]]></content:encoded>
    </item>
    <item>
      <title>Becoming a Father</title>
      <link>https://alexbates.dev/blog/becoming-a-father</link>
      <guid isPermaLink="true">https://alexbates.dev/blog/becoming-a-father</guid>
      <pubDate>Fri, 03 Oct 2025 00:00:00 GMT</pubDate>
      <description>A major life milestone and serious change of pace.</description>
      <category>blog</category>
      <category>personal</category>
      <content:encoded><![CDATA[<p><img src="https://a.storyblok.com/f/287788953313969/1808x2400/3e66c40fe4/noah-birth.jpg" alt="" /></p><p>Hello, everyone!</p>
<p>A bit of a different topic for this blog post - a major life event unfolded for me back in August, my partner Vicky and I welcomed our little boy, Noah, into the world! I&#39;m going to keep this one short because there&#39;s not a lot to say other than that becoming a parent &amp; experiencing paternity leave (which I was fortunate enough to get a full month off - a lot compared to most in the UK) has been the most incredible experience of my life.</p>
<p><img src="https://a.storyblok.com/f/287788953313969/1808x2400/3e66c40fe4/noah-birth.jpg" alt=""></p>
<p>I&#39;ve found it to be a fairly serious mindset shift as my evenings have shifted from casually coding on the sofa, maybe with a glass of wine or a beer and the TV on in the background, to basically the same thing... it&#39;s just now I have a little one asleep on top of me, so using the laptop is a little tricker. I&#39;ve found that I&#39;m spending less time exploring new technologies through code and more through reading blog posts/articles that come up through various subreddits/feeds. <strong>Learning to be more efficient with your time seems more important than ever, now.</strong> Also, learning the importance of having everything that you will need for the next few hours around you within reaching distance is incredibly important, so as not to wake the beast when he&#39;s finally gone down for a nap. One executive decision I took was to (impulse) buy a Nintendo Switch 2, which has been a game-changer when it comes to being nap-trapped!</p>
<p>I&#39;m sure as time goes on I&#39;ll find some more time for working on projects in the evening, but until then I&#39;m more than happy being used as a portable mattress for Noah on an evening.</p>
]]></content:encoded>
    </item>
    <item>
      <title>Introduction to Mobile Development</title>
      <link>https://alexbates.dev/blog/introduction-to-mobile-development</link>
      <guid isPermaLink="true">https://alexbates.dev/blog/introduction-to-mobile-development</guid>
      <pubDate>Wed, 16 Jul 2025 00:00:00 GMT</pubDate>
      <description>It&apos;s never too late to learn a new skill!</description>
      <category>blog</category>
      <category>tech</category>
      <content:encoded><![CDATA[<p>How&#39;s it going? I thought I&#39;d come and put some thoughts down about my experience of picking up a new language/framework and discuss some ways of learning that I&#39;ve been using over the last month or so.</p>
<p>For the first time in a few years, I&#39;ve had a prolonged bit of time during work hours to focus on internal projects &amp; upskilling due to a few client projects ending around the same time. This can be a little unnerving at first, but it&#39;s important to take it as an opportunity to increase your value to wherever or whoever you work for.</p>
<p>I decided to focus on learning a mobile framework, as my company is primarily a Mobile App company. Our stack for apps is split between Swift (iOS) and Flutter (Android/Cross Platform). As I&#39;m an android user (Google Pixel 9 Pro) I figured I&#39;d pick up some Flutter.</p>
<p>In the age of LLMs it&#39;s tempting to take shortcuts to expedite the proces when doing something like this. You could jump straight into a codebase and be writing some fairly complex stuff using Cursor within minutes. My opinion is by doing something like this you&#39;re only screwing yourself over down the line. I decided to build a learning pathway using Claude where I could tailor it exactly to my own needs.</p>
<p><img src="https://a.storyblok.com/f/287788953313969/1616x606/e0c4d96a27/claude-flutter-prompt.png" alt=""></p>
<p>I was able to provide it with my exact level of experience, other languages I&#39;ve worked in, and what I was hoping to achieve from the project. This allowed it to generate a list of useful modules to follow.</p>
<p><img src="https://a.storyblok.com/f/287788953313969/1482x934/79c14cc48f/claude-flutter-pathway.png" alt=""></p>
<p>I&#39;m a fan of tutorials in general, especially when you&#39;re lucky enough to find one that feels like it&#39;s made exactly for you, so having the ability to essentially build your own within a few minutes was really cool. <strong>It&#39;s pretty amazing to think about how far it&#39;s come and how much our general approach to programming has changed over the last few years.</strong></p>
<hr>
<p>Working through the tutorials really helped build the fundamental knowledge of working with Dart and Flutter, and at this point I was lucky enough to get to spend some time building out a proof of concept using Flutter for a colleague of mine&#39;s project. The app is called <a href="https://sooncall.com/">SoonCall</a>, and iOS users can check it out right now. It&#39;s invaluable for keeping track of relationships with your friends, especially if you&#39;re someone like me where you could easily let days and weeks go by where you keep meaning to check in with someone but never get round to it. It&#39;s also really well built with an awesome UI and UX. More news to follow down the line about a potential Android release!</p>
<p><img src="https://a.storyblok.com/f/287788953313969/600x753/197cc6e679/sooncall-promo.png" alt=""></p>
<p>Thanks to Mark for letting me be a part of this!</p>
<hr>
<p>In general I&#39;ve been pleasantly surprised by my brief foray into App Development. There&#39;s a lot more learning to be done, especially around the whole deployment side of things. I&#39;ve been working on my own app, something that probably warrants it&#39;s own blog post down the line, and I&#39;ve been pretty surprised at just how involved it is at getting something released onto the Play Store in production. I&#39;ve not tried releasing for iOS yet 😅.</p>
<p>That&#39;s all for now. Take care!</p>
]]></content:encoded>
    </item>
    <item>
      <title>Middlesbrough Frontend 2025</title>
      <link>https://alexbates.dev/blog/middlesbrough-frontend-2025</link>
      <guid isPermaLink="true">https://alexbates.dev/blog/middlesbrough-frontend-2025</guid>
      <pubDate>Wed, 18 Jun 2025 00:00:00 GMT</pubDate>
      <description>Attending the MFE25 conference and a few key takeaways from some of the speakers.</description>
      <category>blog</category>
      <category>tech</category>
      <content:encoded><![CDATA[<p><img src="https://a.storyblok.com/f/287788953313969/1392x348/6b2a007354/middlesbrough-front-end.jpg" alt="" /></p><p>What&#39;s up? I&#39;ve not been very good at keeping this blog up to date but hopefully this is the start of a new routine.</p>
<p>I took a day off work and made the journey up to Middlesbrough (only an hour and a half from where I&#39;m based) to spend the day listening to some really interesting talks. I really appreciated the variety of talks at this conference. A lot of conferences, especially at the moment, have a real AI-centric theme, regardless of the subject matter. It was nice that MFE didn&#39;t seem to have this, other than the one AI-specific talk (&quot;When AI leaves the chatbox: designing human-centered web experiences in an AI-first world&quot; by Laura Richards) which was a brief dive into how we should be approaching introducing AI into our products, when appropriate, and the importance of transparency for your users.</p>
<p>One of morning talks (&quot;What has Vue ever done for you?&quot; - <a href="https://www.lichter.io/">Alex Lichter</a>) was focused around the Vue ecosystem and delved into a lot of the other projects that exist within the <a href="https://unjs.io/">UnJS</a> umbrella of projects. It was really cool to see some of these projects getting spoken about - I quite often find that a lot of what the Vue team (and related developers) do for the Javascript ecosystem on the whole gets overshadowed by the larger frameworks like React. There&#39;s so many important projects being maintained in this space that make up the foundations of so many other projects it&#39;s great to see them get recognition.</p>
<p>One of the most useful talks was &quot;Beyond the Spec: Cranking View Transtions up to 11 (Safely, Maybe)&quot; by <a href="https://bram.us/">Bramus Van Damme</a>. This was one of those talks that makes you want to go away and start implementing new stuff in your own projects. In fact, that&#39;s exactly what I did with this site. The <a href="https://developer.mozilla.org/en-US/docs/Web/API/View_Transition_API">View Transition API</a> was something that I&#39;d been aware of but never done any further reading about or watched anything longer than a 2-minute explainer. I&#39;ve been working through his slides and replicating the <a href="https://live-transitions.pages.dev/">example</a> that he shared to try and replicate them on this site.</p>
<p>Anyway, that&#39;s all for now. Cheers!</p>
]]></content:encoded>
    </item>
    <item>
      <title>Building this Blog</title>
      <link>https://alexbates.dev/blog/building-this-blog</link>
      <guid isPermaLink="true">https://alexbates.dev/blog/building-this-blog</guid>
      <pubDate>Wed, 16 Oct 2024 00:00:00 GMT</pubDate>
      <description>A few notes on the stack I used to build this site, and some other stuff that&apos;s been going on.</description>
      <category>blog</category>
      <category>tech</category>
      <content:encoded><![CDATA[<p>Hi there! 👋</p>
<p>I wanted somewhere to come and brain dump every now and then. Quite often I&#39;ll work on little side projects and I thought it would be useful to talk about interesting things I&#39;ve come across whilst building.</p>
<p>A bit about me - I&#39;m a software dev based in the UK that mainly works in web development. I&#39;ve worked at a couple of different companies along the way. One of which for a very long time and the other for about a year now.</p>
<p>This site is built using Nuxt - a Vue.js meta-framework. I&#39;ve been writing applications in Vue for about 4 years now and I love it.</p>
<p>One thing I was excited to explore with this project is the ever-growing list of Nuxt Modules. Here&#39;s a list of the ones I&#39;m using (so far):</p>
<ul>
<li><a href="https://content.nuxtjs.org/">Nuxt Content</a> for writing content (these blogs) in Markdown. I didn&#39;t want to put in anything too heavy like a CMS for the time being, so Nuxt Content was exactly the tool I needed. It&#39;s all just Markdown.</li>
<li><a href="https://ui.nuxt.com/">Nuxt UI</a> for the design system. Nuxt UI has a bunch of components that are easy to use and look great. I&#39;ve been thinking about splashing out on the pro license.</li>
<li><a href="https://fonts.nuxt.com/">Nuxt Fonts</a> for loading the fonts. This was really cool DX. Literally all I did was install the module and specify the font in my<br>tailwind.config.ts. That&#39;s it. Behind-the-scenes the module is doing all the heavy lifting for stuff like downloading the font files. It also does some pretty neat stuff like using fontaine to avoid nasty things like cumulative layout shift.</li>
<li><a href="https://nuxtseo.com/">Nuxt SEO</a> to avoid all the boring SEO stuff that I don&#39;t want to deal with. Lazy, I know.</li>
</ul>
<p>The Nuxt Module ecosystem has grown massively since I last built a production site in it. This took me probably a couple of evenings to get completely up and running from scratch which was really nice.</p>
<p><img src="https://a.storyblok.com/f/287788953313969/4672x2664/67254f4bce/nuxt-modules.webp" alt=""></p>
<p>The plan is to keep working on this site and adding more features as I go. I just wanted to get something out the door for now.</p>
<p>Cheers!</p>
]]></content:encoded>
    </item>
  </channel>
</rss>
