What to do before deploying a React App for Absolute Beginners - Part 1

Table of contents

No heading

No headings in the article.

Let's look at how to change the default Favicon Icons, Title, and Description text before we deploy the React App.

1/3 THE ICON

  1. Use the Graphic software of your choice to design an icon.
  2. Export the icon in 4 files with the following details.
  3. logo.svg
  4. favicon.ico → 64px by 64px
  5. logo192.png → 192px by 192px
  6. logo512.png → 512px by 512px
  7. Replace the logo.svg in the src directory of your React Project with the one you've just made and exported.
  8. Navigate to the public directory of your React project and replace the respective files with the favicon, logo192, and the logo512 you've just designed and exported.

2/3 THE TITLE TEXT

  1. Open the index.html file found in the public directory
  2. Edit the text in the Title tag.
  3. Edit the text in the content attribute of the meta tag which has a description attribute.

3/3 THE DESCRIPTION TEXT

  1. Open the manifest.json file
  2. Edit the text in the short_name and name keys

The End

Found this helpful? Share, Like, and comment. Take a minute to follow me on Twitter @davidofug