DEV Community

ojach
ojach

Posted on

I built a 1-line script to make ANY web page a standalone PWA using dynamic Data URL Manifests (1P1A)

I wanted a simpler way to convert single-page tools into standalone home screen apps without messing with global PWA scopes or complex backend setups—so I built a lightweight concept called 1P1A (One Page One App).

Instead of managing static ⁠manifest.json⁠ files for your entire domain, you just drop a single-line script into your page. It dynamically constructs a custom Web App Manifest on the fly using a Data URL (⁠data:application/json...⁠), allowing users to save individual pages directly to their home screen with custom icons and titles.

How to use it (Totally free, pure client-side, no registration required):
Just drop this in your ⁠⁠:

<script src="https://ojapp.app/js/ojapp_1p1a.js"></script>
Enter fullscreen mode Exit fullscreen mode

You can also override the title or icon using simple meta tags:

<meta name="ojapp:title" content="My Cool Tool">
<meta name="ojapp:icon" content="/icon.png">
Enter fullscreen mode Exit fullscreen mode

Why I built this:
Zero backend/build step required (works on static hosts like GitHub Pages or Cloudflare Pages)
Eliminates ⁠manifest.json⁠ routing/scoping headaches
Perfect for modular tools, calculators, or landing pages that deserve their own home screen real estate
Would love to hear your thoughts, feedback, or any edge cases you might run into!

If you're not sure where to start, just paste this at the very top of your HTML:

<script src="https://ojapp.app/js/ojapp_1p1a.js"></script>
Enter fullscreen mode Exit fullscreen mode

That's literally it. Your site is now an app.

Top comments (0)