Introduction

In this guide we will instruct you how you can change the app name version and icons in best possible way we will be using some npm packages to do our work quickly and efficiently.

Key Tools/Packages:

Packages we will install :-

• react-native-rename: For renaming the project.

• react-native-version: For managing app versioning.

For Icon generation and re-factoring:

• Icon Generator : You can use any online Icon generator to generate a icon for example :- Easy Icon Generator .

• Android Studio :- You can also use Android studio to generate icons also if you have an image you can upload an image in Android studio and can fine tune the icon according to you .

Let's break down the steps involved:

1. Changing the App Name

1. Installreact-native-rename:

   Bash

    npm install react-native-rename -g
   

2. Execute the renaming:

   Bash

    npx react-native-rename "Your New App Name" -b "com.example.newappname"
   

   • Replace "Your New App Name" with your desired name.

   • Use the -b option to change the bundle identifier if needed.

   • Replace "com.example.newappname" with your desired bundle name.

2. Changing App Version

1. Installreact-native-version:

   Bash

    npm install react-native-version -g
   

2. Modify Version:

   Bash

    react-native-version --never-amend
   

   • This should automatically update version codes in necessary files based on the version it gets from the configuration file (package.json) .

     Note: In case you face error :- Sometimes because we change the name of app with react-native-rename (npm package) it cause error due to folder name mismatch in the path especially for ios. So you can manually fix that by renaming the folder name.

3. Changing App Icons

• Prepare Image Assets:

  • Ensure new icons adhere to Android and iOS size and format guidelines.

  • Consider an online icon generator -Easy Icon Generator . or Image Asset Studio (Android Studio) to help resize images.

• Replace Icons:

  • Android: Replace images in android/app/src/main/res/mipmap-* folders.

  • iOS: Open Xcode, navigate to the image assets catalog, and replace existing icons.

Important Notes:

• Clean and Rebuild: Always clean and rebuild your project after these changes.

Testing:

After any changes, always test your app on Android and iOS to catch any potential issues.

Build Apk

4. Generate the Release APK

   • Open a terminal in your project's root directory

   • Execute the build command:

     Bash or any terminal of your choice.

     • For MacOS & Linux :

         cd android && ./gradlew assembleRelease
       

     • For Windows :

         cd android; ./gradlew assembleRelease
       

   • Find your APK: The signed APK will be in android/app/build/outputs/apk/release/app-release.apk

Disclaimer: It's important to note that with best of my knowledge I provide the best possible ways to rename app, update version and change icon .

Please let me know if you'd like any of these steps explained in greater detail.