In diesem PWA-Tutorial werfen wir einen kurzen Blick auf einige zusätzliche Dinge, die wir für die iOS-Unterstützung unserer App hinzufügen müssen (die Symbole und die Farbe der Statusleiste). —————————————- 🐱‍💻 🐱‍💻 Kurslinks: + Kursdateien – + Modernes JavaScript-Tutorial – 🐱‍💻 Andere verwandte Kurse: + Firebase Firestore-Wiedergabeliste – Firebase-Authentifizierungs-Tutorial – .

Kommentare (21)

  • Chuck Milliken Antworten

    Master, lead me out of React Native hell.

    9. Mai 2019 um 3:58
  • Abdul Shakur Antworten

    i had a problem with my sdk component on andriod studio

    Nothing to do!

    Android SDK is up to date.

    SDK tools directory is missing

    9. Mai 2019 um 13:41
  • Luc Huet Antworten

    Thank you for the tutorial ! It is exactly what I was looking for !

    When will be the following videos !

    9. Mai 2019 um 14:12
  • Łukasz ;p Antworten


    9. Mai 2019 um 17:41
  • Marito Mesquita Antworten

    R.I.P Flutter ,
    thank you Ninja for saving us.

    9. Mai 2019 um 19:40
  • Chon Hee Cho Antworten

    Thanks a lot!

    10. Mai 2019 um 13:06
  • James Collins Antworten

    Shouldn't the href path be "/img/icons/icon-96×96.png" ?

    10. Mai 2019 um 17:27
  • Adel Lassag Antworten

    I think we should set the complete path icon source in the line 15

    10. Mai 2019 um 22:32
  • Rubin Bajracharya Antworten

    To Run the PWA hosted locally in Android go to{PORT} in Chrome and for IOS localhost:{PORT} in Safari.

    11. Mai 2019 um 5:48
  • Senang Coding Antworten


    26. Mai 2019 um 5:24
  • Ramon Sanchez Antworten

    This is great, but one thing I noticed when I tried to use this page on my iPhone 6 is that the menu gadget didn't work. I tried this on other iPhones at an Apple Store and it didn't work there either (that was after I hosted a copy of this page on my GoDaddy account). I found that I had to wrap the i-tag with the materialize icon in it with an anchor tag. I also had to put the style "btn-flat" in the i-tag and change the padding in the nav to 0.

    21. Juni 2019 um 22:22
  • Ramon Sanchez Antworten

    The real location of the icon is "/img/icons/icon-96×96.png".

    8. Juli 2019 um 23:09
  • Thomas Riegl Antworten

    Thank you very much, i've learned a LOT!
    A question to the "top nav":
    The line "<i class="material-icons sidenav-trigger" data-target="side-menu">menu</i>" is doing nothing on my iOS devices (iPhone, iPad 12.4.1)
    On Android and Windows (Firefox, Chrome) the sidenav is opening.

    Any hints for me?

    Thanks again!

    19. September 2019 um 18:22
  • lardosian Antworten

    Are these steps for ios still needed today, thanks!

    13. März 2020 um 17:28
  • kr333 Antworten

    When I add my pwa from my hosted website to the homescreen, and than enter it the css doesn’t works.

    14. Mai 2020 um 0:15
  • English Rain Antworten

    Another thing people need to keep in mind is that transparent icons are not allowed in iOS.

    19. September 2020 um 16:28
  • English Rain Antworten

    To test your PWAs on iOS devices (& different Android, Windows, etc devices), simply publish your PWA on netlify & then head over to and use their services to test your PWA. The latter provides an year worth of free subscription if your project is open source so that is a much faster way to test your PWA rather than messing around with emulators!

    20. September 2020 um 9:21
  • Stech Antworten

    thank you , you are the best

    23. September 2020 um 22:05
  • Andy Liberopoulos Antworten

    correct me if i am wrong, but the meta tag for the status bar should be "<meta name="apple-mobile-web-app-status-bar-style" content="default">" and sadly, there are only three choices for content: default – black – black-translucent. Sad days you guys

    30. Dezember 2020 um 11:34
  • Sahil Malhotra Antworten

    I am building a pwa in reactjs, that will be then submitted to apple store. I want to include an in app purchase functionality in that. Can you please let me the best way to publish pwa to apple store and what to use for in app purchase functionality.

    20. März 2021 um 12:49
  • Pablo Sierra Antworten

    Your are simple amazing :') thanks Shaun!

    29. Juni 2021 um 5:06

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.