update README with PWA documentation

This commit is contained in:
2025-07-17 20:14:14 +04:00
parent 54d7a2b573
commit 8d37e1a398
+49 -4
View File
@@ -14,6 +14,9 @@ kaubuntu.re est une interface web responsive qui permet de consulter et recherch
- Recherche de contenu
- Interface responsive (mobile et desktop)
- Intégration avec une instance PeerTube
- **Progressive Web App (PWA)** avec installation native
- Mode hors ligne avec cache intelligent
- Détection automatique d'état de connexion
## Technologies utilisées
@@ -21,6 +24,8 @@ kaubuntu.re est une interface web responsive qui permet de consulter et recherch
- CSS3 avec Media Queries pour le responsive design
- PHP pour le backend
- JavaScript pour les interactions côté client
- **Service Worker** pour le cache offline et PWA
- **Web App Manifest** pour l'installation native
- Bibliothèques externes via CDN:
- Font Awesome (icônes)
- jQuery
@@ -45,11 +50,15 @@ kaubuntu.re est une interface web responsive qui permet de consulter et recherch
│ ├── mobile-menu.php
│ ├── featured-videos.php
│ ├── recent-videos.php
── categories.php
── categories.php
│ └── pwa-init.php
├── index.php
├── video.php
├── categories.php
├── search.php
├── sw.js # Service Worker pour PWA
├── site.webmanifest # Manifest PWA
├── browserconfig.xml # Configuration Windows
└── README.md
```
@@ -57,6 +66,7 @@ kaubuntu.re est une interface web responsive qui permet de consulter et recherch
1. Clonez ce dépôt
2. Configurez votre serveur web (Apache, Nginx, etc.) pour pointer vers le répertoire racine
3. **Important :** Assurez-vous que votre serveur supporte HTTPS (requis pour PWA)
## Configuration
@@ -120,14 +130,49 @@ Les fichiers `sitemap.xml`, `robots.txt` et `site.webmanifest` contiennent le no
Ces fichiers sont listés dans le `.gitignore` afin que vos modifications ne soient pas suivies par Git, ce qui vous permet de personnaliser votre instance sans affecter le code source principal.
## Progressive Web App (PWA)
Cette plateforme est une PWA complète offrant :
### Fonctionnalités PWA
- **Installation native** : Bouton d'installation automatique dans l'interface
- **Mode hors ligne** : Cache intelligent des pages et ressources visitées
- **Détection d'état** : Indicateur visuel en cas de perte de connexion
- **Performance** : Chargement instantané des ressources en cache
- **Responsive** : Interface adaptée pour l'utilisation en application mobile
### Comment installer l'application
1. **Automatique** : Un bouton "Installer" apparaît dans le header lors de la première visite
2. **Manuel** :
- **Chrome/Edge** : Menu → "Installer kaubuntu.re"
- **Safari iOS** : Partager → "Ajouter à l'écran d'accueil"
- **Firefox Android** : Menu → "Installer"
### Compatibilité PWA
- ✅ Chrome/Edge (Android/Desktop)
- ✅ Safari (iOS 11.3+)
- ✅ Firefox (Android)
- ✅ Samsung Internet
### Fichiers PWA
- `sw.js` : Service Worker gérant le cache et mode offline
- `site.webmanifest` : Configuration de l'application (nom, icônes, etc.)
- `browserconfig.xml` : Support des tuiles Windows
## Déploiement
Pour déployer sur un serveur mutualisé:
1. Assurez-vous que votre hébergeur supporte PHP (version 7.0 minimum recommandée)
2. Transférez tous les fichiers via FTP dans le répertoire racine de votre site
3. Vérifiez que les permissions des fichiers sont correctement définies (644 pour les fichiers, 755 pour les dossiers)
4. Configurez votre domaine pour pointer vers le dossier où vous avez installé l'application
2. **Configurez HTTPS** (obligatoire pour les fonctionnalités PWA)
3. Transférez tous les fichiers via FTP dans le répertoire racine de votre site
4. Vérifiez que les permissions des fichiers sont correctement définies (644 pour les fichiers, 755 pour les dossiers)
5. Configurez votre domaine pour pointer vers le dossier où vous avez installé l'application
6. Testez l'installation PWA via les outils de développement du navigateur
## Développement