Fall In Love With PWA

Hi

HabibaGadalla.com

History

“(...) you can write amazing Web 2.0 and Ajax apps that look exactly and behave exactly like apps on the iPhone. And these apps can integrate perfectly with iPhone services. And guess what?
There’s no SDK that you need! You’ve got everything you need if you know how to write apps using the most modern web standards to write amazing apps for the iPhone today.
So developers, we think we’ve got a very sweet story for you. You can begin building your iPhone apps today"

- Steve Jobs, Apple 2007

"It happens on the web from time to time that powerful technologies come to exist without the benefit of marketing departments or slick packaging. They linger and grow at the peripheries, becoming old-hat to a tiny group while remaining nearly invisible to everyone else. Until someone names them."

- Alex Russell, Senior Staff Software Engineer at Google

2015

What's PWA?

A progressive web application is a website turned into an application

These apps aren’t packaged and deployed through stores, they’re just websites that took all the right vitamins… They progressively become ‘apps’.

- Alex Russell, Senior Staff Software Engineer at Google

Baseline PWA Checklist

  • Site is served over HTTPS
  • Pages are responsive on tablets & mobile devices
  • All app URLs load while offline
  • Metadata provided for Add to Home screen
  • First load fast even on 3G
  • Site works cross-browser
  • Page transitions don’t feel like they block on the network
  • Each page has a URL

The Difference Between PWA and Native Apps 

- Operate and live in a browser

- Progressive and work on all devices

- Connectivity-independent

- Some limitations when accessing native features

- Live in the device

- Only works on the platform it was made for

- Have access to all its platform features

PWA

Native Apps

Let's Create Something!

npx create-react-app egyptjs-pwa

cd egyptjs-pwa

Fall In Love With PWA

By Habiba Gadalla

Fall In Love With PWA

  • 49