Ce veți învăța
- Introducere în Progressive Web Apps
- Arhitectura aplicațiilor web moderne
- Web App Manifest - configurare și personalizare
- Service Workers - concepte fundamentale
- Strategii de caching cu Service Workers
- Funcționalitate offline
- Push Notifications
- Instalabilitate și experiența nativă
Despre curs
Curs PWA: Progressive Web Apps este ghidul complet pentru crearea aplicațiilor web progresive care combină avantajele web-ului cu experiența aplicațiilor native. Cursul acoperă Service Workers, Web App Manifest, strategii de caching, notificații push și toate tehnologiile care fac posibile PWA-urile moderne.
PWA-urile funcționează offline, se instalează pe dispozitivele utilizatorilor și oferă o experiență nativă fără a fi distribuite prin App Store sau Google Play.
Curs PWA: Progressive Web Apps
Progressive Web Apps reprezintă viitorul aplicațiilor web: combină accesibilitatea universală a web-ului cu funcționalitățile avansate ale aplicațiilor native. Marile companii (Twitter, Pinterest, Starbucks) au înregistrat creșteri semnificative ale conversiilor după trecerea la PWA.
Cursul vă ghidează de la înțelegerea conceptelor fundamentale până la implementarea unui PWA complet și funcțional.
Ce veți învăța
- Cei trei piloni ai PWA: Service Worker, Web App Manifest și HTTPS
- Service Workers: instalare, activare, fetch intercepting și lifecycle
- Strategii de caching: Cache First, Network First, Stale While Revalidate
- Funcționalitate offline: ce se întâmplă când utilizatorul nu are conexiune
- Web App Manifest: configurarea completă pentru instalabilitate
- Notificări Push: implementarea end-to-end cu Web Push Protocol
- Background Sync: sincronizarea datelor când conexiunea revine
- Performanță și Core Web Vitals pentru PWA
Structura cursului
Introducere și primul PWA
Cursul începe cu definirea PWA și comparația cu aplicațiile native și site-urile web clasice. Veți crea primul PWA funcțional cu structura minimă necesară: HTML principal, manifest și Service Worker de bază.
Arhitectura Application Shell
Modelul Application Shell separă infrastructura aplicației de conținut, permițând încărcarea instantanee la vizitele ulterioare. Veți implementa acest pattern și veți înțelege fluxul de încărcare optimizat.
Service Workers și caching
Service Worker-ul este inima unui PWA: rulează în fundal, interceptează requesturile de rețea și gestionează cache-ul. Veți implementa toate strategiile principale de caching și veți ști să alegeți strategia potrivită pentru fiecare tip de resursă.
Funcționalități avansate
Notificările Push, Background Sync, Web Share API și integrarea cu sistemul de operare completează tabloul unui PWA modern. Veți implementa notificări push end-to-end și sincronizarea datelor în fundal.
Cui se adresează acest curs
- Dezvoltatori web care doresc să adauge funcționalități native site-urilor lor
- Companii care vor să ofere o experiență mobilă mai bună fără a dezvolta o aplicație nativă
- Freelanceri care doresc să ofere servicii PWA clienților
- Oricine lucrează cu JavaScript și dorește să exploreze tehnologiile web moderne
De ce să alegeți acest curs
Cursul conține cod complet pentru fiecare strategie prezentată, un PWA de demo funcțional pe care îl puteți studia și modifica și ghiduri de testare cu Chrome DevTools (Application tab, Lighthouse).
La finalul cursului, veți crea PWA-uri complete cu funcționalitate offline, instalabilitate și notificări push, gata de deployment pe orice server web standard.
Pentru cine este cursul
Cursul este pentru dezvoltatori frontend care vor să transforme un site existent într-o aplicație instalabilă, pentru echipe care vor să ofere funcționalitate offline fără să construiască o aplicație nativă separată, și pentru administratori de magazine online care vor să reducă abandonul cauzat de conexiuni mobile instabile.
Pentru cine nu este
Nu este pentru cine nu are cunoștințe de JavaScript și de manipularea DOM-ului, aceștia trebuie să parcurgă întâi cursul de JavaScript de pe platformă. Nu este nici pentru cine caută o aplicație nativă pentru App Store sau Google Play, pentru care cursul de Flutter, dedicat aplicațiilor mobile, este alegerea potrivită.
Ce trebuie să știți înainte
Aveți nevoie de cunoștințe de JavaScript și HTML, plus un site existent sau un proiect de test pe care să aplicați exercițiile. Testarea Service Workers necesită HTTPS, deci este utilă găzduirea pe un domeniu cu certificat SSL, chiar și unul gratuit precum cel oferit de Let's Encrypt.
Ce veți putea face după curs
- Configurați un Web App Manifest pentru instalarea aplicației pe telefon.
- Scrieți un Service Worker cu strategie de caching pentru funcționare offline.
- Trimiteți notificări push către utilizatorii care au instalat aplicația.
- Stocați date local cu IndexedDB, fără conexiune la internet.
- Adăugați o PWA peste un site WordPress existent.
- Testați și depanați o PWA cu instrumentele din Chrome DevTools.
Cuprins
1. Introducere în Progressive Web Apps
- Introducere gratuit
- Ce este un PWA?3 min
- Cele trei piloni ai PWA3 min
- Caracteristici fundamentale ale PWA3 min
- PWA vs. aplicații native vs. site-uri web3 min
- Istoria și evoluția PWA3 min
- Primul dumneavoastră PWA - structura minimă3 min
2. Arhitectura aplicațiilor web moderne
- Introducere3 min
- Modelul Application Shell3 min
- Fluxul de încărcare App Shell3 min
- Modele de arhitectură pentru PWA3 min
- Exemplu practic: App Shell cu încărcare dinamică3 min
- Navigare client-side (Router)3 min
3. Web App Manifest - configurare și personalizare
- Introducere3 min
- Structura completă a manifestului3 min
- Proprietăți esențiale explicate3 min
- Moduri de afișare (display)3 min
- Icoane maskable vs. icoane standard3 min
4. Service Workers - concepte fundamentale
- Introducere3 min
- Ce este un Service Worker?3 min
- Ciclul de viață al unui Service Worker3 min
- Înregistrarea Service Worker-ului3 min
- Structura completă a unui Service Worker3 min
- Diferențe față de Web Workers3 min
- Comunicarea între SW și pagină3 min
5. Strategii de caching cu Service Workers
- Introducere3 min
- Cele cinci strategii fundamentale3 min
- Tabel comparativ al strategiilor3 min
- Implementare avansată - router de strategii3 min
- Gestionarea dimensiunii cache-ului3 min
6. Funcționalitate offline
- Introducere3 min
- Strategia offline - planificare3 min
- Pagina offline personalizată3 min
- Detectarea stării conexiunii3 min
- Salvarea conținutului pentru offline3 min
- Formulare offline cu coada de așteptare3 min
7. Push Notifications
- Introducere3 min
- Cum funcționează Push Notifications3 min
- Configurare VAPID (Voluntary Application Server Identification)3 min
- Abonare la Push Notifications (client-side)3 min
- Gestionarea notificărilor în Service Worker3 min
- Trimitere notificări de pe server (Node.js)3 min
- Compatibilitate push notifications3 min
8. Instalabilitate și experiența nativă
- Introducere3 min
- Criterii de instalabilitate3 min
- Controlul promptului de instalare3 min
- Banner personalizat de instalare3 min
- Detectarea modului de lansare3 min
- Instalare pe diferite platforme3 min
9. IndexedDB și stocarea datelor local
- Introducere3 min
- IndexedDB vs. alte opțiuni de stocare3 min
- Wrapper simplu pentru IndexedDB3 min
- Exemplu practic: aplicație de note offline3 min
- Sincronizare IndexedDB cu server-ul3 min
10. Design responsive și mobile-first
- Introducere3 min
- Principiile mobile-first3 min
- Meta tag viewport3 min
- Sistem de grid responsive pentru PWA3 min
- Imagini responsive3 min
- Design responsive - breakpoints recomandate3 min
11. Performanță și optimizare PWA
- Introducere3 min
- Core Web Vitals pentru PWA3 min
- Strategii de optimizare3 min
- Audit de performanță3 min
12. Securitate în PWA (HTTPS, CSP, Integritate)
- Introducere3 min
- HTTPS - cerință obligatorie3 min
- Content Security Policy (CSP)3 min
- Subresource Integrity (SRI)3 min
- Protecție împotriva atacurilor comune3 min
13. PWA în WordPress
- Introducere3 min
- Plugin-uri PWA pentru WordPress3 min
- Implementare manuală PWA în WordPress3 min
14. PWA cu framework-uri JavaScript
- Introducere3 min
- PWA cu React (Create React App / Vite)3 min
- PWA cu Vue.js3 min
- PWA cu Angular3 min
- Comparație framework-uri PWA3 min
15. Background Sync și Periodic Sync
- Introducere3 min
- Background Sync API3 min
- Periodic Background Sync3 min
- Comparație Sync vs Periodic Sync3 min
16. API-uri Web avansate
- Introducere3 min
- Web Share API3 min
- Payment Request API3 min
- Alte API-uri importante3 min
17. Testare și debugging PWA
- Introducere3 min
- Lighthouse PWA Audit3 min
- Chrome DevTools pentru PWA3 min
- Testare offline3 min
18. Publicare și distribuție PWA
- Introducere3 min
- Distribuție web (URL direct)3 min
- Publicare în Google Play Store3 min
- Publicare în Microsoft Store3 min
- Publicare pe iOS (App Store)3 min
- Comparație canale de distribuție3 min
19. Studii de caz și exemple reale
- Introducere3 min
- Studii de caz notabile3 min
- Lecții învățate3 min
- PWA vs Aplicație Nativă - când să alegeți ce3 min
20. Glosar PWA și checklist-uri de lansare
- Introducere3 min
- Glosar PWA (A-Z)3 min
- Checklist de lansare PWA3 min
Cine predă
Dorel Tănase, fondatorul agenției GOAI din Alba Iulia. În mediul online din 1997, în optimizare SEO din 2007. Cursul pornește de la situații întâlnite în lucrul cu clienți din România și este actualizat pe măsură ce uneltele se schimbă. Experiența autorului.
Dorel Tănase, fondatorul agenției GOAI din Alba Iulia. În mediul online din 1997, în optimizare SEO din 2007. Cursul pornește de la situații întâlnite în lucrul cu clienți din România și este actualizat pe măsură ce uneltele se schimbă. Experiența autorului.
Conținut actualizat la
22 august 2026
22 august 2026
Întrebări frecvente despre curs
Ce unelte trebuie să am pentru acest curs?
Aveți nevoie de un browser Chrome, folosit pentru fila Application din DevTools, unde se depanează Service Workers și manifestul, și de un site sau proiect local rulat pe HTTPS. Certificatul poate fi unul gratuit de la Let's Encrypt sau un tunel local precum ngrok pentru testare.
Cât durează parcurgerea cursului?
Cursul are 102 lecții și 306 de minute de conținut video, adică 5 ore și 6 minute, împărțite în 20 de capitole. Capitolul 13 arată integrarea unei PWA direct într-un site WordPress, fără să renunțați la platformă.
Cursul acoperă și versiunile recente de Service Workers?
Da, capitolele despre caching și Background Sync folosesc API-urile actuale, suportate de Chrome, Edge și Firefox în 2026. Safari pe iOS are suport parțial pentru notificări push, aspect explicat separat în capitolul despre instalabilitate.
Care este diferența față de cursul de Flutter?
Acest curs transformă un site web existent într-o aplicație instalabilă, folosind tehnologii web precum HTML, CSS și JavaScript. Flutter construiește aplicații native separate, cu cod Dart compilat pentru App Store și Google Play, tratat în cursul dedicat de Flutter.
Articole pe această temă
Cursuri din aceeași categorie
