usePollingUpdate – React Hook for polling on interval

A simple hook to poll a server for updates every n milliseconds, and remove itself on unmount.

usePollingUpdate will call pollingFunction every interval milliseconds, and clean up after itself.

// usePollingUpdate.js

import { useEffect, useState } from "react";

const usePollingUpdate = (pollingFunction, interval) => {
  const [ subscription, setSubscription ] = useState(null);
  useEffect(() => {
    const id = setInterval(pollingFunction, interval)
    setSubscription(id)
    return () => {
      if(subscription){
        clearInterval(subscription);
      }
    }
  }, [])
}


export default usePollingUpdate;

// in the component
import usePollingUpdate from './hooks/usePollingUpdate';

// list items is the function to query the API. 15000 polls the server every 15s.
usePollingUpdate(() => listItems(1, true), 15000);

UseCallback Debounce

const debouncedOnChangeText = useCallback(_.debounce(onChangeText, 150), [])

Calls the onChangeText handler only every 150ms, without recreating it over and over.

Overnight Hike Packing Checklist

Went for my first overnight hike, and who knows what I’ll forget later.

Cooking

  • Cutlery kit (Knife/Fork/Spoon thing)
  • Hiking Stove – Saucepan + bowl + cooking base kit
  • Gas Canister for Hiking Stove (1 lg, 1 sm)
  • Newspaper for fire

Hiking

  • 3L water, across 3 containers (one for way, one for there, one for way back. Pour out excess before leaving to return)
  • Headphones, charged
  • Phone, charged

Food

  • Hiking snacks – nut bars x 4
  • 2x bananas
  • 2 x 500ml soups for dinner
  • 1 pack biscuits, chocolatey
  • 1 bag lollies
  • Pringles for chips

Sleeping

  • Bed roll
  • Sleeping bag. Rated to expected temperature – 10 deg if not in tent
  • Tarp
  • Tent, or tools to build shelter

Clothing

  • Weatherproof hiking boots
  • Comfortable socks for hiking
  • Long, thin pants for hiking (shorts if hot or not scrub)
  • Long, thin shirt for hiking (t shirt if hot or not too much sun)
  • Hat for hiking
  • Second pair of socks for sleeping
  • Thermal pants for sleeping
  • Thermal long sleeve shirt for sleeping
  • Thick jumper for cold weather
  • Beanie for cold weather

Safety

  • Head Torch with new batteries
  • 5m & 2m rope
  • UHF, charged, channel 14. Has safety torch built in.
  • A way to fully recharge phone (e.g. battery pack & charger cable)
  • Small hatchet or hand saw
  • Folding Knife
  • Lighter (check full)

Micro-Saas – building framework

I’ve worked on the fun technical side of probably 20 SaaS side projects over about 10 years. Ship the project or plugin, slap a landing page on the front, and never touch it again. Now I’m trying to formalise a framework for micro-saas delivery.

I’ve only finished this to a complete site once with PayItLater, and have been working on the second recently with my Recustom Micro-saas – sending scheduled SMS to previous customers on behalf of businesses.

Below is my almost complete playbook of all the details required to build a micro-saas.

Map out the app plans

Map out the app plans. Don’t build yet.

It’s probably notes on a few pages – super scratchy and scribbly and hard to read.

Don’t skip complexity – connect nodes, decide on relationship types, scribble up some column names.

Get a pen and paper and scratch it all out.

Design the app pages

Design the app pages using draw.io
All pages should be either designed or accounted for. I’m not design heavy so most pages will follow a general theme, but you do need a good idea of the scope involved. Don’t leave out 30 pages here, or you’ll underestimate the work involved.

Breakdown

  1. Design the auth pages & layout (e.g. Register) using draw.io
    These are a pain, and slow to get right. I think the same auth stack should be re-used for other projects – there’s no point doing this work over and over again for micro-saas.
    1. Sign In / Sign Out / Reset Password (incl. social providers)
    2. Create Account
  2. Design the app pages
    1. Navigation bar (top / left / bottom?)
    2. Should be out of the box bootstrap navs. Need to keep mobile in mind.
    3. Colour schemeUse plain Bootstrap unless it’s a technical audience
    4. Rough draft name/logo (don’t spend time on this)Use an off the shelf icon as the logo.
  3. Design the data schema
    This can change, but the act of getting it down on paper will surface problems you haven’t thought of. Think about how the data will be stored, what the columns will be called, what relates to what. Document it in its own draw.io doc or google doc.

Marketing Plan

What’s the content strategy?

  1. Support answers as documentation
  2. How-To videos for all common paths
  3. List possible applications for the tool (one post each)
  4. Case studies. Investigate how a customer is using the tool and put a post together, so others in their vertical can discover the SaaS.
  5. What’s the pricing strategy?
    Is there a free tier, what is it? (at this point, I’ll always have a free tier to get the inbound marketing I need. May change that in the future).
  6. Internationalisation?
    I’m not sure how to do this yet, but I feel it could be a huge SEO win.

Onboarding Strategy

I push this high up the list because I strongly think a user should be able to discover you, sign up, and get up and running in the time it takes to drink a coffee.
We’re running on a shoestring and don’t have infinite ad budget and levers to pull – easy onboarding is a good one to focus on.

This ties in with marketing and content strategy as well – if the user gets stuck anywhere, they should be able to go and watch a video or read a doc about how to get up and running again.

Technical Decision Making

Pretty far down the list right. Ultimately for the success of the micro-saas to get it’s first 10 users, this SO doesn’t matter.

Marketing Site

What’s the content management stack? Skinned wordpress site, JAM Stack + headless CMS, fully custom. I try to imagine what I’m going to be able to use 2 years down the track, and what I’m happy to pay for and maintain in the meantime.
Currently using a nuxtjs site that pulls in a few contentful content types, and deploys on netlify. It’s a pain in the ass to set up the first time around, but I can grab the whole stack, plug in different contentful credentials, and stand up a new site quickly. I hate contentful with a passion, but I don’t have to maintain it and fix an SSL certificate randomly etc.
I miss yoast from wordpress, which makes SEO stupid easy.

The App

  1. What’s the auth stack? Firebase, auth0, okta, roll your own? Keep in mind this is a huge time sink. I’m using firebase auth, but
  2. What’s the app backend stack? I like serverless for the same reasons above – I’ll pay 28c/month for firebase to deal with node versions. For a bigger project I’d use Laravel, but that’s not a micro-saas IMO and comes with ongoing cost, maintenance, upgrades. Firebase cons – no REST API out of the box, clunky as shit to code against. Firebase pros – great local emulator, great local dev experience. Pro & Con – Firebase will scale ‘infinitely’, which is great, but need to watch for abuse – e.g. with an SMS service!
  3. What’s the app frontend stack? I like nuxtjs for micro-saas. It comes with simple state management, simple routing, quick builds and nice local developer experience. Something bigger or with a team might be React or React Native. Needs to be easy to dev locally, easy to push to test, easy to push to prod.

Build the micro-saas locally

Look how far we got before we started coding our micro-saas! It’s the total opposite of what everyone does. We’ve got a stack worked out, a marketing strategy decided, and clear fields to get this app built. Keep it locally to start, so you don’t get caught stuffing around pushing to production and refreshing for changes.

Breakdown

  1. Get the local environment up and running. Might involve emulators, backend setup, etc. Should be able to run a single yarn command and have the environment up and running.
    It’s ok for this to take some time, but don’t forget – whatever you use you want to use again, and it shouldn’t take a day to get going every time.
  2. Build the auth pages. So simple but so hard! Social providers are hard to get going locally, so it might work to skip those and revisit them once the site is deployed to a test environment.
    I prefer to build in the concept of a team from the get-go, because I think it’s a core requirement of a B2B offering.
    1. Sign In / Sign Out / Reset Password (incl. social providers)
    2. Create Account
  3. Build the app pages. Follow draw.io diagrams closely, if anything significant needs to change, update the diagrams and then the app. Keep security in mind at each step here, don’t put it aside as a ‘do it later’. Security is a nightmare to revisit.
    Do keep a to-do list of things you are skipping for now. Just not security.
  4. Don’t forget mobile. I always make this mistake, it’s a good one to make a line item of. Mobile is a first class citizen.

First pass branding for the micro-saas

You can create an account, sign in, use the app completely in your local environment. Time to do some fluffy stuff.

  1. Come up with about 10 names.
  2. Buy a domain. Use tools to find a short .io, .app, .net or a .com with a prefix or suffix. Across the 10 names hopefully there’s a good combination available.
  3. Create a quick logo using a free logo creator, using the name and a free vector logo.
  4. Choose a basic colour scheme.
  5. Slot the logo and name into the local app.

Deploy the app to TEST environment

It’s time to deploy the micro-saas to app-test.<yourdomain>

Do what you need to do to get this to deploy in one click, and it needs to be fully functional – including third party services such as email and payment processors. It all needs to work with no messing about.

Deploy the app to PRODUCTION environment

Now deploy to app.<yourdomain>. Again, needs to be one click. Set up deploy pipelines, hooks, a yarn command, whatever needs to be done to make this quick and easy

Build the marketing site

Everything up to this point I find pretty quick and easy. There’s a ton of content to add here, and it’s all super important to get ranking quickly.

Pages required:

  • Home
    • Navbar with logo and brand, drops to hamburger for mobile. Links to:
      • Blog
      • Pricing
      • Documentation
      • Getting Started
      • Sign In
      • Create Account
    • Nice hero page. For landing customer, incl tag line, image, one paragraph explaining the product
      • Displays last 3 blog posts on second fold
      • Displays some other content on next fold (e.g. “Where can I use X”, “Who uses X”
      • A “getting started” call to action block
      • Big footer link list. This took me forever, but is a huge signal of ‘professionalism’ to have this content all filled out.
        • Social – twitter / youtube / github
        • Product – features / customers / pricing
        • Docs – documentation / training / videos / system status
        • About – about / applications / blog
        • Talk to us – contact / support
    • Blog Index Page. /blog/ A page displaying all blog posts in an index format. Loads from contentful for me.
    • Blog Detail Page. /blog/_slug/ Page to show the full view for a blog post. From contentful. Has a generic call to action at the bottom.
    • Pricing Page. /pricing/ Displays a free tier, a small tier, and a pro tier. Don’t bother coding all the limits in, get users.
    • Documentation. /documentation/ Another signal that this site is all together. Make sure you’ve documented how to create an account, get set up, and make first use of the app.

Give the site a run through an SEO checker, run Lighthouse from Chrome debugging tools, get Google Analytics and Google Search Console set up.

Recustom Call to Action screenshot.

Add a handful of blog posts, make sure every page is filled out. That’s it, we’re done here for now!

What’s left for the micro-saas?

Set up emails – contact@, support@. Maybe add a chatbox and a cookie prompt.

Set up calendar entries to get regular blog posts in to keep /blog fresh.

Work out how to launch. The site is ready for SEO, but doesn’t appear anywhere. You’re going to need to identify places that the site can be linked from, including properties of your own if you have them. Think SaaS comparison sites, SaaS directories, local business directories, guest post opportunities. You need some seeds out there to give google a kick along.

Making stuff pt 2 – Recustom SMS app

There’s this tricky part to making a SaaS that making the SaaS is the tiniest part of it.

I made this simple service – after setting up an SMS template, you can queue SMS messages to send to people. It’s simple and powerful, and is intended to drive customers to re-engage your service provider in an intervals time.

Examples:

  • Ordering flowers the next year
  • Reminder to book car in for service after 3 months
  • Getting house pest sprayed
  • (A hundred things like that).

I think it might end up as a Xero plugin, just bolted up to outgoing invoices. I finished working on the app to a reasonable level probably a week ago, and have since been setting up the ancillary pieces an hour at a time. There’s so much.

Buy domain, deployments, set up email, create ~15 pages, create a blog & structure, create documentation infra, create a status page, create a contact form. It’s all fiddly shit that would just be plugins in WordPress.

The intention is that after creating these once, the SaaS can again be the focus later and I don’t have to work on all these junk pages, I can just fetch from the templates. So it’s a bit of pain now to hopefully get back to where we need to be later.

The app is hosted at https://www.getrecustom.com. It allows creating an account, defining templates, and creating scheduled SMS messages against those templates. Recustom should be useful for set and forget decrease of customer churn.

I’m slowly working through the pages to be added still. I’m not betting the farm that SMS notifications is the one way to go. It’s a minimum viable SaaS – some guy somewhere might pay for it. Once I’m finished working on this, I should be able to pay the annual domain renewal, throw up the odd blog post, and hopefully forget it exists. And.. Delete this post.

Remembering how to create stuff

In my 20’s, I always had a side project or two going. Most of them weren’t $10m businesses, but all of them would have customers now if I set them up and left them running.

Every single one of them was a sound idea in some sense.

Now that I’ve had 4 kids, reasonably happily employed as a contractor (working on stuff I enjoy), I just don’t have the kick to create anything now. Wondering if it’s actually a fear of failing, or a fear of not finishing, adding another thing to the pile.

So it’s probably been 3-4 years of not creating anything I’m not being paid to create. Every time I want to work on something, I shoot it down because it doesn’t have a business model or it’s like a google tool or it needs a front end or some other bullshit reason.

Pretty keen to jump in and work on some dumb ideas that don’t have a business model and won’t make me rich and just create and finish some projects again.

So, I’m gainfully employed, my family is happy, I want to spend some time creating stuff.

First up, I’m just looking at this local takeaway shop that has a nice online ordering stack down pat. What would it look like if I did it in WooCommerce? My first ever freelance client was building an online ordering system in WooCommerce, and it was a long and happy relationship.

Journal entry – May 28, 2020

I keep a personal journal sporadically. Last year I dropped off from ~March 2020 and picked it back up on May 28, 2020. It was the period that coronavirus was the worst it got in Sydney* (*Simpsons ref: worst it got in Sydney, so far.)

Every day I review the entry from a week ago, a month ago, and a year ago. I’m not 100% with journalling so pretty often there’s missing entries, but this one is my favourite so far. It’s from a year ago today.

I keep the journalling private to only myself. It’d be good to share somehow one day with my family/kids, but there’s already so much content that I guess it’d need a thorough review first.

It’s a point in time and only lightly edited. I remember the period very vividly and also it seems like forever ago. One day, I hope this post gets lost in a sea of hundreds of my daily posts (there’s currently 80).


Started at Thu May 28 13:20:51 UTC 2020


It’s been so long. I’m here just to try to start the habit.


In the meantime, Coronavirus hit, and Australia did really well. We as a family also did really well.


In USA, 100,000 people have died as at yesterday. 100 people here. All the countries in the world are handling it differently. My USA friends are a little bit pretty conservative so it’s interesting seeing it through their eyes (‘the people who are dying were going to die’, etc).


The kids had 2 weeks of home school and then school holidays. Then another 2 weeks of full home school, and then basically back full time. Krystal loved it. We all got a bit closer (e.g. we had lunch together every day, which was fantastic!). All the kids handled it differently though. Austin grew up very quickly having everyone around. Emmett didn’t miss real life at all. Hudson just wasn’t himself. A bit moody, a bit withdrawn. He thought he probably needed to see his friends and we thought so too.


We did a good job of isolating ourselves. I went out for a takeaway coffee most days and that was it. A few times we went out for takeaway and ate it in the car — the Kebab Van in the Mitre 10 carpark, or McDonalds in the shopping centre carpark. Restrictions are lifting slowly now. 10 people are allowed in restaurants and cafes. NRL started again tonight.


We didn’t see Rod & Bronwyn for the whole time. The family all stayed away. We finally got to have a catch up and had the nicest night. Tom and I pulled an old couch out to the fire and we chilled on it with Krystal.


Scarlett had her 4th birthday under the lockdown. Her friends from dancing decorated their cars and came for a drive down our street. It was at the absolute height of the lockdown. The neighbours all watched from their windows. The mums passed Scarlett’s presents out the windows and basically yelled out the windows in conversation. The whole thing probably lasted 15 minutes and then they were gone. It was so amazing, one of those things that won’t ever happen again.


The neighbours house caught fire last week. Krystal ran down and told me, and we ran out and helped with the efforts. I really do think we stopped the place from fully burning down, once I saw the photos. Poor buggers.. We don’t see much of them, but the more we have seen them over the xmas fires and stuff the more they seem alright.

Spatie QueryBuilder/Eloquent – filter based on child attribute

One of those ‘all the time’ patterns I can never quite remember that is hard to google for.

The piece of code:

QueryBuilder::for(Entity::class)->whereHas('entityType', function($q) {
            $q->where("entity_types.is_task", true);

Explanation:

QueryBuilder::for(<Parent Class>)->whereHas('<relationship name of child/relative>', function($q) {
            $q->where("<table name>.is_task", true);

In this case, the child/relative is defined like this:

    public function entityType()
    {
        return $this->belongsTo(EntityType::class);
    }

Copying small startups, test #1

It’s all going to take a while to work out.

I’ve got an old online campsite booking tool that I charge the original customer $1k/year to keep switched on. It looks, feels and quacks like a SaaS, so will be useful to get some re-exposure to a lot of the side pieces to running the micro-SaaS.

Things like:

  • Applied formula SEO
  • Support as Marketing
  • Awful youtube how-tos as Marketing
  • Science of screenshots / pricing / features / waiting list
  • Analytics
  • Getting a marketing site template sorted
  • Forgotten steps like buying a domain

There’s no dev required to do any of these on this particular product, so it’s now Copying Small Startup Test #0. Revenue goal is $0. They’re all pretty light tasks in and of themselves, and might take me a month of 1 hour a night to knock a few off.

There’s no startup being copied here, but I assume there’s 10 others out there that I can be inspired by later.

Swagger to Laravel Library

Given an OpenAPI API endpoint, if you can export the OpenAPI JSON specification, it can easily be turned into a client library for use in laravel.

Download the swagger.json file to the current folder.

Run:

docker run --rm -v ${PWD}:/local openapitools/openapi-generator-cli generate -i "/local/swagger.json" -g php -o /local/out/php

Under the ./out/ folder is now a client library to work against the API.

I made use of this post when working through: