PWAH
“Dad, I want to make a game on your phone!” my 9 year old exclaimed with that special childhood excitement that only springs forth from the well of authenticity not yet drained dry by taxes and “grown up” life. We talked about his concept, it would be a fish game where you get bigger as you eat smaller fish. We went to a public large language model (A.I.) and asked it to generate the code for his idea as a “mobile friendly web game.”
After just just a few clarifications and requests for bug fixes, we had a brand new, custom, game, just for us.
Ok… it’s working, but now how do I run this code on my phone?
Hosting our new game publicly or trying to publish it through an app store would take longer than making it.
Wouldn’t it be great if we could just… pwah! Put the app on the phone?
That’s when I had the idea for pwah.io.
How to Make a PWAH App
Write some code or use your favorite LLM to create your idea as a “single page web app” that’s “mobile friendly” and copy the code.
In your mobile device’s browser type in “your-app.pwah.io” (where “your-app” is any name that’s url friendly for your app) and visit the address.*
From there, add PWAH to your phone’s home screen and close your browser.
Open your newly created PWAH app from your device’s home screen.
Paste your code in the appropriate place and hit “Launch App” to start your custom app.
* Note: This doesn’t make your app public or reserve this url for you, this just gives you something called an “origin” on your device that’s unique to this app to keep it’s data seperate from other apps you may make, someone else could use the same URL origin for their app on their device.
How to Share a PWAH App
To make an app that’s sharable takes an extra step. You’ll need to have a GitHub account and create a GitHub gist. Once you’re satisfied with your app, paste your single page of HTML code into a GitHub gist and use the “share” feature for the gist to get the shareable gist url for your gist containing your app code. Your code is now hosted on GitHub and can be used in pwah.io and shared with other people.
First, get the share link from the GitHub Gist.
Then, use PWAH to get a shareable link:
In your mobile device’s browser type in “any-app-name.pwah.io”
Add that PWAH page to your phone’s home screen and close your browser.
Open your newly created PWAH app from your device’s home screen.
Paste your Gist’s URL and click “Share App” to copy a shareable pwah.io link.
Example Sharable Apps
This is the app my 9 year old and I were working on when I had the idea for pwah.io.
Created with Claude 3.7 in a single paragraph of text explaining what I wanted.
My 7 year old currently loves using “orange juice” as the punchline to any joke, so I made this one with her help.
Space themed infinite runner. I made this as a proof of concept 3d app using an external Three.js script reference for the 3d features.
Frustratingly hard knockoff of the famous bird version. Created with Claude 3.7 as I waited for my dinner at a restaurant after coincidentally bumping into my friend Wil who suggested it.
Gritty Details
PWAH is mostly vibe coded, mostly tested on my personal iOS device, and is open source (MIT License). For security reasons, I’ve intentionally made it without any backend or database. In other words, it’s a static site. It’s essentially a generic PWA wrapper for people’s custom code. There’s pros and cons to the way I’m handling things, if you want to know more or review the code, check out the github project. One big con to my current method is that you can’t make a custom app icon for your app. I have some thoughts on how to provide this feature but it will take some more time, require a backend, and I want to make sure it’s reasonably secure before launching anything like that publicly.
Permalink: https://danieljonce.com/blog/pwah
