What are some popular PWAs built using Ionic?

Ionic Framework ionic-v3
1

Just out of curiosity, does anyone know some good PWAs built using Ionic 2/3?

Are any major companies/brands building PWA using Ionic?

2

I donā€™t think there are any yet. Iā€™d love to be wrong about this, but I think so far there are just some interesting projects. The app scene is a lot different, with some very commercially successful apps written in Ionic. But the desktop world is not well served yet. Hereā€™s hoping Ionic 4 solves a lot of those issues. Moving to Angular routing is huge for desktop programming.

3

So what is actually the difference between react pwa and ionic pwa. I guess ionic pwa can be used for mobile app natively because of capacitor. What about react pwa? Can it be used with react native? I need more info on whatā€™s the benefit of going with ionic pwa vs react pwa. Any comments would be appreciated

4

I think the biggest challenge for PWAā€™s is iOS support: https://medium.com/@firt/pwas-are-coming-to-ios-11-3-cupertino-we-have-a-problem-2ff49fd7d6ea

Ionic 3 PWA -> Brew - The Craft Beer App: https://craftbeer.org.au/

location-tab
location-tab.png750Ɨ1334 268 KB

search-tab
search-tab.png750Ɨ1334 81.9 KB

venue-page
venue-page.jpg750Ɨ1334 193 KB

craft-beer-page
craft-beer-page.jpg750Ɨ1334 207 KB

1 Like
5

So it appears Ionic PWAs are not yet there for real PWA workings.

But, can I deploy the Ionic app (the www folder, guess it will still be called PWA) and use it as a regular website? Of course, I will probably need to have altogether a new set of CSS to give it a website look and feel. At least, I will not need to write completely new code for my website UI. That is, use the HTML, TypeScript, Angular code.

Correct? Can I do that?

Thanks.

6

You can build PWAs using Ionic 3 right now, you just need to follow a few simple steps.

See:

Yes you can, I use Google Hosting and FIrestore (angularfire2/firestore):

npm run build --prod
firebase deploy
1 Like
7

@robinyo, thanks!

Awesome!!

By any chance, do you know of such websites that are being used as hybrid apps on mobile devices as well regular/pure websites?

It would be great to have such a list.

I am great fan of Ionic (donā€™t have the whole knowledge though :slight_smile: ). Itā€™s sometimes hard to convenience people to go with Ionic for mobile apps (hybrid) and use the codebase for regular website usage even if PWA is not matured yet. This way at least 75-80% of the code can be reused.

Thanks again for inputs, appreciated!

8

Do you happen to know if Google hosting handles angular routing well? AWS does not which is a dealbreaker for me. Iā€™m looking to host elsewhere

9

@gauz09

See: https://ionicframework.com/startups

10

You might also like (Hacker News readers as Progressive Web Apps): https://hnpwa.com/

11

it canā€™t? Are you sure? I dodge a bullet there using Heroku lol

12

Nope. Thereā€™s an option to set up Routing Links or something of the sort but itā€™s obscure and unintuitive. Angular Routing is essentailly useless.

1 Like
13

wow. Ionic works great on Azure though.

14

@jaydz - Sorry to repeat the question @bandito asked , but are you sure? Can you elaborate a bit on what exactly happens when you deploy Angular project (with routes) on AWS EC2 or EB? Can you point to some specific discussion on this?

I got interested because at my current client we are planning to develop a website in Angular and deploy on EC2 or EB. Thanks.

15

@robinyo - this is cool! Thanks for providing those links!

16

Hey @gauz09. I used AWS but didnā€™t end up using EC2 or EB. I was using S3 and Route 53 if I remember correctly. It may be that other options are compatible with Angular Routing, but I Googled the subject pretty extensively and had no luck finding anything other than ā€˜Youā€™re out of luckā€™.

Anytime I opened my website, whatever ā€˜routeā€™ it tried to open to failed, and a warning was all I got. Something along the line of ā€œthe key ā€˜/my_routeā€™ is not definedā€ etcā€¦

Hereā€™s an example of AWSā€™ routing configuration that is meant to replace / compliment angular routing, e.g make it work

Edit Redirection Rules section of the S3 Console for your domain, add the following rules:

<RoutingRules>
  <RoutingRule>
    <Condition>
      <HttpErrorCodeReturnedEquals>404</HttpErrorCodeReturnedEquals>
    </Condition>
    <Redirect>
      <HostName>domain.com</HostName>
      <ReplaceKeyPrefixWith>#/</ReplaceKeyPrefixWith>
    </Redirect>
  </RoutingRule>
</RoutingRules>

Thatā€™s just something I found with a quick google search.
Google AWS Angular Routing and stuff will pop up

1 Like
17

Azure is Microsoft .net / IIS based, is that correct?
And Heroku is on top of my list. AWS also didnā€™t seem to have a simple solution for implementing a MEAN stack, and I hear Heroku is good for that sort of thing

1 Like
18

http://app.wieneschrijft.nl

19

According https://ionicframework.com/pwa

Starbucks, Pinterest, Uber, Twitter, Forbes

1 Like
20

If you look carefully those are companies that are using PWAs and having positive results, but it never explicitly states that Ionic is used for the PWA. I doubt that any of those companies are using Ionic, but they still prove the usefulness of the technology.