Uko ndani ya app. Fungua kwenye browser kwa muonekano na downloads bora.
FAUSTINE MWOYA March 3, 2026 6 min read APPS

APP CODE 1

Sehemu A: Hakikisha PWA iko tayari (kabla ya PWABuilder)
A1) PWA lazima iwe kwenye HTTPS

https://faulink.com ✅

localhost pia inakubali wakati wa dev.

A2) Hakikisha una hizi files 3

manifest.json (au manifest.webmanifest)

sw.js (service worker)

offline.html (ukurasa wa offline)

Sehemu B: Code za msingi za PWA (weka/rekebisha)
B1) manifest.json (toleo la PRO kwa Faulink)

Weka kwenye root: /manifest.json

{
"name": "Faulink Systems",
"short_name": "Faulink",
"id": "/",
"start_url": "/index.php?source=pwa",
"scope": "/",
"display": "standalone",
"orientation": "portrait",
"background_color": "#0b1220",
"theme_color": "#0066cc",
"lang": "sw",
"description": "Faulink ni mfumo wa kisasa wa kidigitali kwa shule na biashara: usimamizi wa taarifa, malipo, ripoti na ufuatiliaji kwa urahisi na usalama.",
"icons": [
{ "src": "/assets/icons/icon-192.png", "sizes": "192x192", "type": "image/png" },
{ "src": "/assets/icons/icon-512.png", "sizes": "512x512", "type": "image/png" },
{ "src": "/assets/icons/maskable-512.png", "sizes": "512x512", "type": "image/png", "purpose": "maskable" }
]
}

✅ Muhimu:

id iwe simple path (mf. "/"). Usiiweke kama string yenye JSON ndani.

start_url weka na ?source=pwa (optional) ili ujue watumiaji wa PWA.

icons: angalau 192 na 512.

B2) sw.js (service worker ya production)

Weka kwenye root: /sw.js

'use strict';

const SW_VERSION = 'v1.0.0';
const CACHE_STATIC = `static-${SW_VERSION}`;
const CACHE_PAGES = `pages-${SW_VERSION}`;
const CACHE_ASSETS = `assets-${SW_VERSION}`;

const OFFLINE_URL = '/offline.html';

const STATIC_ASSETS = [
OFFLINE_URL,
'/manifest.json'
];

self.addEventListener('install', (event) => {
event.waitUntil((async () => {
const cache = await caches.open(CACHE_STATIC);
await cache.addAll(STATIC_ASSETS);
self.skipWaiting();
})());
});

self.addEventListener('activate', (event) => {
event.waitUntil((async () => {
const keys = await caches.keys();
await Promise.all(
keys
.filter((k) => ![CACHE_STATIC, CACHE_PAGES, CACHE_ASSETS].includes(k))
.map((k) => caches.delete(k))
);
await self.clients.claim();
})());
});

const isNavigationRequest = (req) =>
req.mode === 'navigate' ||
(req.method === 'GET' && (req.headers.get('accept') || '').includes('text/html'));

async function cacheFirst(req) {
const cache = await caches.open(CACHE_ASSETS);
const cached = await cache.match(req);
if (cached) return cached;

const res = await fetch(req);
if (res && res.ok) cache.put(req, res.clone());
return res;
}

async function networkFirst(req) {
const cache = await caches.open(CACHE_PAGES);
try {
const res = await fetch(req);
if (res && res.ok) cache.put(req, res.clone());
return res;
} catch {
const cached = await cache.match(req);
return cached || caches.match(OFFLINE_URL);
}
}

self.addEventListener('fetch', (event) => {
const req = event.request;
if (req.method !== 'GET') return;

const url = new URL(req.url);
if (url.origin !== self.location.origin) return;

if (isNavigationRequest(req)) {
event.respondWith(networkFirst(req));
return;
}

const isAsset =
url.pathname.startsWith('/assets/') ||
['.css', '.js', '.png', '.jpg', '.jpeg', '.webp', '.svg', '.ico', '.woff', '.woff2', '.ttf']
.some(ext => url.pathname.endsWith(ext));

if (isAsset) {
event.respondWith(cacheFirst(req));
return;
}

event.respondWith((async () => {
const cached = await caches.match(req);
try {
return await fetch(req);
} catch {
return cached || caches.match(OFFLINE_URL);
}
})());
});

self.addEventListener('message', (event) => {
if (event.data && event.data.type === 'SKIP_WAITING') self.skipWaiting();
});

✅ Ukitoa update baadaye, badilisha SW_VERSION (mf. v1.0.1) ili cache ibadilike.

B3) offline.html

Weka: /offline.html

Upo Offline

Upo Offline

Hakuna intaneti kwa sasa. Rudia tena baada ya mtandao kurudi.

B4) Code ya kuweka kwenye index.php (head + register SW)

Ndani ya

weka: Kabla ya weka SW registration: Sehemu C: Ku-test kabla ya PWABuilder Fungua hizi kwenye browser: https://faulink.com/manifest.json lazima ionyeshe JSON, isiwe 404 https://faulink.com/sw.js https://faulink.com/offline.html https://faulink.com/assets/icons/icon-512.png Kama moja inakataa, PWABuilder atakwama. Sehemu D: PWABuilder → kupata Android App Bundle (AAB) D1) Ingia PWABuilder Nenda PWABuilder Weka URL ya site yako (au direct manifest URL) Inafanya “analysis” D2) Rekebisha Action Items Kama kuna warnings, hakikisha: description ipo id ipo na ni sahihi (mf. "/") orientation ipo D3) Store ready Ukiona “Awesome! Your PWA is store ready!” Bonyeza Android → Generate Package D4) Jaza details za Android package Itakuuliza: Application Id / Package name (mf. com.faulink.systems) App name Version Kisha itatengeneza package na utapata Download .aab. ✅ File muhimu kwa Play Store ni .aab. Sehemu E: Google Play Console (ku-upload AAB mpaka live) E1) Fungua Play Console Unda account (kuna fee ya mara moja) Create app Chagua: App type: App Free or Paid: chagua unavyotaka Default language: Swahili/English E2) Upload AAB Nenda: Release → Production → Create new release Upload .aab Save E3) Store Listing (lazima) Andaa: App name Short description Full description App icon 512×512 Feature graphic 1024×500 Screenshots (2–8 recommended; 1080×1920 ni standard) E4) Privacy Policy (lazima) Unda page kwenye site yako mfano: https://faulink.com/privacy-policy Kisha uweke link hiyo Play Console. E5) App Content / Data Safety (lazima) Utaulizwa: App inakusanya data gani (mf. email, name, etc.) Inatumika vipi Kama data inasharekwa Jibu kweli kulingana na mfumo wako. E6) Submit for review Ukishajaza kila kitu, “Submit” — kisha subiri review. Sehemu F: Model yako ya biashara (2 days trial + manual activation) iwe SAFE kwa Play Store Wewe unafanya: Trial → lock → user anakulipa nje → wewe unamactivate kupitia website ✅ Ili isiwe issue kwenye review: Usionyeshe “Lipia hapa M-Pesa” ndani ya app kama “digital unlock button” Badala yake, onyesha message ya support: Message ya kuonyesha trial ikisha (mfano) “Trial imeisha. Tafadhali wasiliana na Faulink kwa ajili ya ku-activate huduma.” Hii ni clean. Sehemu G: “Kitu kinachowachanganya watu” (common mistakes) Manifest link kwenye head haifanani na file uliyoupdate hakikisha: Cache ya browser/service worker badilisha SW_VERSION kila update + Ctrl+F5 Icon 512 haipatikani (404) start_url inaredirect loop Sehemu H: Vitu utakavyohitaji kwa Play Store (quick checklist) ✅ .aab kutoka PWABuilder ✅ Privacy Policy URL ✅ Screenshots ✅ Feature graphic 1024×500 ✅ Description ✅ App category (Education/Business) ✅ Data safety answers Ukiwa tayari, niambie vitu 2 tu:

🚀 Unahitaji mfumo au website ya biashara?

Chagua huduma hapa chini kisha mteja bofya moja kwa moja kwenda kwenye ukurasa wa huduma au kuwasiliana nasi kwa WhatsApp.

Share this post

Comments

0
No comments yet. Be the first to comment.

Continue Reading

March 2, 2026 6 min

APP CODE

1) Folder structure (pendekezo) Weka hivi kwenye root ya project yako: /assets/icons/ icon-72.png icon-96.png icon-128.p...

Subscribe

Get new updates

Jiunge upokee posts mpya, tutorials, na updates za mifumo moja kwa moja kwenye email yako.

Quick Actions