how to 301 redirect website with .app domain for beginners

I need to redirect my website from an .app domain to another domain
This tutorial also applies when Namecheap forwarding does not work
an example is : yourdomain.app and you need to redirect it

you can read about 301 domain redirect here.

The Easy Way and why it does not work

The usual way is to use your domain provider’s redirect record.
I used Namecheap for most of my domains. But for some reason, the namecheap redirect record will not work.
After asking for support, it turns out the TLD for the .app domain requires https:// connection.
Namecheap’s redirect service does not offer https protocol.

Using Cloudflare’s Page Rule

Then I need to switch to Cloudflare as per my friend’s suggestion. Here are the steps

a proper Cloudflare page rule set up for .app domain

Part1: Switching to Cloudflare

  1. You sign up for a Cloudflare account, then add your domain to the Cloudflare Account.
  2. To do that, you need to switch your domain’s DNS server
  3. Select a plan on Cloudflare, for most beginners, the free plan will do
  4. Then your domain’s DNS management will be transferred to Cloudflare

Part2: Setting up page rules (and its gotchas)

  1. Then you need to navigate to your domain
  2. Go to rule -> page rules -> create page rule
  3. In the redirect domain use: yourdomain.app/*
    this part is extremely important and most AI model’s answer misses it
    when you type the domain, DO NOT add https:// before the domain OR IT WONT WORK
  4. Then on the forwarding domain, you type: https://yourdestinationdomain.com/
    this part is also ommitedd by most AI
    TYPE HTTPS:// ON THE FORWARDING DOMAIN. If you miss the https:// IT WONT WORK
  5. you can then type the https://yourdestinationdomain.com/$1 if you want the URL of the new domain to match that of the old domain

The Italic part is what most tutorials miss

I hope this information is helpful to the online community.