Progressive Web Applications
Download as PPTX, PDF
1 like434 views
GDG Sivas 2016 - Progressive Web Applications
![7
Progressive Web Application
G端venli - Herhangi g端venlik problemine izin vermemek i巽in HTTPS to
端zerinden 巽al脹脹r.
Bulunabilir - Are identifiable as applications thanks to W3C
manifests[6] and service worker registration scope allowing search engines
to find them.
Re-engageable - Push notification gibi altyap脹lar sayesinde sadakat ve
etkileim yarat脹r.
Y端klenebilir - App Storeda beklemeye ihtiya巽 olmaks脹z脹n ana ekrana
k脹sayol olarak yerleebilir
Balant脹lanabilir - URL arac脹l脹脹yla kolayl脹kla payla脹labilir.](https://image.slidesharecdn.com/gdg2016sunum-161209211309/85/Progressive-Web-Applications-7-320.jpg)
![22
PWA vs Native
22
Doru kar脹lama asl脹nda
PWA vs. native deil belki de PWA vs. [web + native + native] .
Kimin hakl脹 olduunu yine ancak zaman g旦sterecek...](https://image.slidesharecdn.com/gdg2016sunum-161209211309/85/Progressive-Web-Applications-22-320.jpg)
Progressive Web Applications
- 1. 1 Progressive Web Applications Uur Aydodu GDG Sivas, Aral脹k 2016
- 2. 2 Dijital Pazarlama Sosyal Medya E-Ticaret Mobil Uygulamalar Epigrada Neler Yap脹yoruz? Tasar脹m Web Uygulamalar脹
- 3. 3 2015 y脹l脹nda Google m端hendislerinden birisi olan Alex Russell taraf脹ndan ortaya at脹lm脹t脹r. (Escaping Tabs Without Losing Our Soul) Uygulama benzeri bir deneyimi, modern yetenekler ile ortaya koyan uygulamalara progressive web uygulamas脹 denir. -Google Progressive Web Application Nedir?
- 4. 4 Biz neler g旦rd端k? Dial Up, Table, Div, CSS, Ajax, Responsive, Native, Hybrid .
- 5. 5 Adobe AIR Applications Windows Store Apps Chrome Packaged Applications, Chromium Embedded Framework Firefox OS Packaged Applications Cordova/PhoneGap ve Crosswalk Uygulamala脹r BlackBerry WebWorks Apps W3C Widgets WebOS Apps Electron Gelecei erken g旦renler
- 6. 6 Progressive Web Application Progressive - Devaml脹 olarak gelitirilerek t端m kullan脹c脹lara, platform ba脹ms脹z hizmet edebilmek 端zere gelitirilir Responsive - Masa端st端, mobil, tablet b端t端n ortamlarda 巽al脹脹r Balant脹dan ba脹ms脹z - Service workers sayesinde offline veya balant脹n脹n k旦t端 olduu durumlarda 巽al脹abilir. Uygulama gibi - Etkileim ve navigasyonel balant脹lar arac脹l脹脹yla uygulama hissiyat脹 verir. G端ncel - Her zaman son s端r端md端r,ekstra g端ncellemeye gerek kalmaz.
- 7. 7 Progressive Web Application G端venli - Herhangi g端venlik problemine izin vermemek i巽in HTTPS to 端zerinden 巽al脹脹r. Bulunabilir - Are identifiable as applications thanks to W3C manifests[6] and service worker registration scope allowing search engines to find them. Re-engageable - Push notification gibi altyap脹lar sayesinde sadakat ve etkileim yarat脹r. Y端klenebilir - App Storeda beklemeye ihtiya巽 olmaks脹z脹n ana ekrana k脹sayol olarak yerleebilir Balant脹lanabilir - URL arac脹l脹脹yla kolayl脹kla payla脹labilir.
- 8. 8 Ne Zaman PWA? Yapmal脹 m脹y脹z? Yapmamal脹 m脹y脹z? Acaba Hybrid mi yazsak? Native yazmay脹nca da i巽ime hi巽 sinmiyor da neyse G端ncel Veri Ger巽ek Zamanl脹 Etkileimler (Chat, Notification vs) Offline 聴htiya巽lar Kullan脹c脹 Al脹kanl脹klar脹 Deneysellik
- 9. 9 Arat脹rmalar neler diyor? Ortalama olarak bir uygulama her ad脹mda ona ulaan kullan脹c脹lar脹n 20%sini kaybediyor. 20%
- 10. 10 Yani.. 1000 kii olduumuzu varsayarsak Source: https://youtu.be/qmE_jpnYXFo?t=96
- 11. 11 Amerikadaki ak脹ll脹 telefon kullan脹c脹lar脹n脹n 65.5%i bir ay s端resince yeni bir uygulama indirmiyor. App Storeda uygulaman脹z脹 ziyaret edenlerin yaln脹zca 26.4%端 uygulaman脹z脹 indiriyor. En y端ksek ziyaret巽i alan 1000 mobil web sitesi, en iyi 1000 native uygulamaya g旦re 270% daha 巽ok ziyaret ediliyor. Dahas脹
- 12. 12 Native uygulamalar daha fazla etkileim al脹yor fakat web siteleri hala daha fazla kiiye eriiyor.
- 13. 13 Konvansiyonel web siteleri daha 巽ok insana erimenizi salarken, uygulamalar kullan脹c脹lar ile daha fazla etkilesim kurman脹z脹 sal脹yor. O zaman neden hem 巽ok insana eriip hem de daha 巽ok etkileim kurmayal脹m ki?
- 14. 14 Gartnerin 2016 Hype Cycle for Web Computing (http://www.gartner.com/document/3398518) endeksine g旦re, PWAlar hen端z embriyo aamas脹nda ve %1 penetrasyon oran脹yla b端y端yor. Bu nedenle hen端z s脹k s脹k kar脹m脹za 巽脹kmasa da gelecek vaadettiini s旦ylemek zor deil. PWA Hen端z b端y端yen bir 巽ocuk
- 15. 15 Progressive Web App Showcase https://pwa.rocks Google Progressive Web App https://developers.google.com/web/progressive-web-apps/ Pokedex https://www.pokedex.org/ Flipkart https://www.flipkart.com/ Air Berlin https://flights.airberlin.com/en-DE/progressive- web-app Baz脹 PWA rnekleri
- 16. 16 APP SHELL SERVICE WORKER
- 17. 17聴stediiniz Javascript Framework端n端 Kullanabilirsiniz
- 18. 18
- 19. 19 Avantajlar 19 Veri Tasarrufu : Baz脹 端lkelerdeki altyap脹 problemleri nedeniyle y端ksek bant genilii gerektiren durumlarda ciddi eriim problemleri yaanabiliyor. Native olarak 10 MB olan bir uygulama PWA olarak 500 KB boyutuna kadar inebiliyor. G端ncellemeye Gerek Olmamas脹: imdi veya sonras脹 i巽in g端ncellemeye gerek olmad脹脹 gibi ciddi hatalarda app storeda onay beklemek durumunda kalmay脹p anl脹k g端ncellemeler yap脹labiliyor. Kullanmak i巽in y端klemeye gerek yok, dorudan kullanmaya balayabiliyorsunuz. Kolayl脹kla payla脹labiliyor
- 20. 20 Dezavantajlar 20 Pek 巽ok irket kendi uygulamas脹n脹n i巽erisinde taray脹c脹 ilevini koymaya balad脹脹 i巽in yay脹lmas脹 zorla脹yor App Store Yok: Uygulama arayan insanlara dorudan eriim salamak i巽in arama motorlar脹na bal脹y脹z. Sign in with Facebook, Google gibi buttonlar; iletim sistemi 端zerinde kurulu uygulamalara eriemediinden; web 端zerinden giri yapmak zorunda kal脹yorsunuz Son teknoloji donan脹mlar hala kullan脹lam脹yor (parmakizi sens旦r端 vs) u an i巽in anahtar 巽ou 旦zellik yaln脹zca Android taraf脹ndan destekleniyor. Pinch zoom gibi baz脹 旦zelliklerin kapat脹lmas脹, ya da uygulaman脹n browser deil de standalone veya fullscreen modunda olmas脹 alg脹y脹 y旦nlendirip sald脹r脹 olarak kullan脹labilir mi? sorular脹 hala d端端nd端r端yor
- 21. 21 Cordova tabanl脹 hibrid uygulamalar React Native NativeScript Electron and NW.js HTML uygulamalar脹 apk, exe veya dier formatlarda 巽al脹t脹ran ve/ya native e d旦n端t端ren altyap脹lar PWA deildir. PWAlar脹n y端klenmesi gerekmez, indirmek i巽in ise yaln脹zca siteyi ziyaret ederek ana ekrana k脹sayol olarak eklemeniz yeterlidir. Bu nedenle farkl脹 iOS ve Android uygulamalar脹 gelitirmesi zorunluluu ortadan kalkar. (taray脹c脹 destei sorun oluturmad脹脹 s端rece) Kar脹t脹r脹lmamas脹 Gerekenler
- 22. 22 PWA vs Native 22 Doru kar脹lama asl脹nda PWA vs. native deil belki de PWA vs. [web + native + native] . Kimin hakl脹 olduunu yine ancak zaman g旦sterecek...
- 25. 25 Kaynak巽a 25 https://developers.google.com/web/progressive-web-apps/?hl=en https://developers.google.com/web/updates/2015/12/getting-started- pwa?hl=en#add_to_home_screen_banner https://developers.google.com/web/fundamentals/getting-started/codelabs/your-first- pwapp/?hl=en https://developers.google.com/web/updates/2015/11/app-shell?hl=en https://arc.applause.com/2015/11/30/application-shell-architecture/ https://github.com/TalAter/awesome-progressive-web-apps https://www.sitepoint.com/progressive-web-apps-bridging-the-gap-between-web-and- mobile/ https://medium.com/@slightlylate/progressive-apps-escaping-tabs-without-losing-our- soul-3b93a8561955#.k44b6zwc9 https://medium.com/@owencm/the-surprising-tradeoff-at-the-center-of-question- whether-to-build-an-native-or-web-app-d2ad00c40fb2#.4em0oy14m
- 26. 26 Kaynak巽a 26 https://medium.com/dev-channel/why-progressive-web-apps-vs-native-is-the-wrong- question-to-ask-fb8555addcbb#.bv9s7xcjd https://www.smashingmagazine.com/2016/08/a-beginners-guide-to-progressive-web- apps/ https://www.smashingmagazine.com/2015/04/creating-web-app-in-foundation-for-apps/ https://www.smashingmagazine.com/2016/02/building-first-class-app-leverages-website- case-study/ https://www.smashingmagazine.com/2016/09/the-building-blocks-of-progressive-web- apps/