How to write a bitbucket-pipelines.yml for react and django application to deploy on heroku

On the bitbucket, my all build scripts are running perfectly but

when I am deploying the app on heroku then

I am getting this build error:

-----> Building on the Heroku-20 stack
-----> App not compatible with buildpack: https://buildpack-registry.s3.amazonaws.com/buildpacks/heroku/nodejs.tgz
    
!     ERROR: Application not supported by 'heroku/nodejs' buildpack
!     
!     The 'heroku/nodejs' buildpack is set on this application, but was
!     unable to detect a Node.js codebase.
!         
!     A Node.js app on Heroku requires a 'package.json' at the root of
!     the directory structure.
!     
!     If you are trying to deploy a Node.js application, ensure that this
!     file is present at the top level directory. This directory has the
!     following files:
!     
!     backend/
!     myapp/
!     db.sqlite3
!     manage.py
!     media/
!         
!     If you are trying to deploy an application written in another
!     language, you need to change the list of buildpacks set on your
!     Heroku app using the 'heroku buildpacks' command.
!         
!     For more information, refer to the following documentation:
!     https://devcenter.heroku.com/articles/buildpacks
!     https://devcenter.heroku.com/articles/nodejs-support#activation
    More info: https://devcenter.heroku.com/articles/buildpacks#detection-failure
!     Push failed

My project file format is this :

/backend

  /backend

  /myapp

  /media

  -manage.py

  -db.sqlite3

  -runtime.txt

  -requirements.txt


/frontend

  /src

  /node_modules

  -index.html

  -package.json

  -package-lock.json


-Procfile

-bitbucket-pipelines.yml

My Procfile is :

  release: python3 backend/manage.py migrate
  web: gunicorn --chdir backend backend.wsgi --log-file -

My bitbucket-pipelines.yml is:

pipelines:
default:
    - step:
        name: Backend Build
        image: python:3.8.5
        script:
        - cd backend
        - pip install -r requirements.txt
        - git archive --format=tar.gz master -o sample-app.tar.gz
        artifacts:
        - backend/sample-app.tar.gz            
    - step:
        name: Build and Test for react
        image: node:10.19.0
        trigger: manual
        caches:
        - node
        script:
        - export TRAMPOLINE_CI=true         
        - cd frontend
        - rm -rf package-lock.json
        - rm -rf node_modules
        - npm install
        - npm run build
    - step:
        name: Deploy to production
        deployment: production
        trigger: manual
        caches:
        - pip
        - node
        script:
        - pipe: atlassian/heroku-deploy:1.2.1
            variables:
            HEROKU_API_KEY: $HEROKU_API_KEY
            HEROKU_APP_NAME: $HEROKU_APP_NAME
            ZIP_FILE: backend/sample-app.tar.gz
    

How can I solve this error? I am understanding that my build application has not react files. But I don't know that how to add them. So please help me.

What is wrong in this pipeline code?

I mean how to deploy react and django application to heroku ?