Add App Favicons

#1

From @jayair on Mon Apr 10 2017 01:01:17 GMT+0000 (UTC)

Link to chapter - http://serverless-stack.com/chapters/add-app-favicons.html

Copied from original issue: https://github.com/AnomalyInnovations/serverless-stack-com/issues/30

0 Likes

#2

From @lepirlouit on Thu Mar 15 2018 13:15:28 GMT+0000 (UTC)

When users install your app to the homescreen of their device the default configuration will make a shortcut to /index.html. This may not work for client-side routers which expect the app to be served from /. Edit the web app manifest at public/manifest.json and change start_url to match the required URL scheme, for example:

"start_url": ".",

see : https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md#serving-apps-with-client-side-routing

0 Likes

#3

From @jayair on Thu Mar 15 2018 17:42:49 GMT+0000 (UTC)

@lepirlouit Can you verify that this change works on Android? If it does I’ll update the tutorial.

0 Likes

#4

From @lepirlouit on Fri Mar 16 2018 09:31:56 GMT+0000 (UTC)

I confirm, I tested this and this works on android lollipop.

0 Likes

#5

From @jayair on Fri Mar 16 2018 18:10:36 GMT+0000 (UTC)

@lepirlouit Awesome thanks. I’ll update it.

0 Likes

#6

Great! It useful! Thank U

1 Like

#7

Hi folks - I was wondering if you had a recommendation for someone building their app with yarn & webpack.

0 Likes

#8

What do you mean? Not using Create React App?

0 Likes

#9

At the end of this chapter, Firefox may not immediately display the favicon.

I observed it requesting apple-touch-icon.png and favicon-16x16.png, getting HTTP 200 for both of them, and then using neither of them in the browser tab (pinned or unpinned).

After a considerable amount of refreshing, restarting Firefox and restarting the node process, Firefox started displaying the favicon as expected. Although by that time, the result was quite unexpected. It started working while I was typing this. :rofl:

0 Likes

#10

Yeah I’ve noticed something similar in other browsers too. They don’t seem to pick up the favicon right away. Even though the change is clearly made.

0 Likes