Using two container listening on the same url one with https and one without

Hello everyone I need some help.

I have two docker compose, one with traefik and one with both backend and frontend.

The backend and the frontend listen on the same url, like myapp.mydomain, but on two different path.

The frontend is available on myapp.mydomain and the backend on myapp.mydomain/api

Basically what I want to do is something simple

  1. When a request, generally a person, goes to http://myapp.mydomain it redirects to https

1.a) Requests on the front-end go on the frontend container

  1. When a request goes to http://myapp.mydomain/api goes on the back-end container.

Now I already do this with nginx, but I would like to use Traefik instead.

Below my docker composes.

Thanks for your help.

version: '3.3'

networks:
  default:
    external:
      name: gateway

services:

  traefik:
    image: "traefik:v2.2"
    container_name: "traefik"
    command:
      - "--log.level=DEBUG"
      - "--api.insecure=true"
      - "--providers.docker=true"
      - "--providers.docker.exposedbydefault=false"
      - "--entrypoints.web.address=:80"
      - "--entrypoints.websecure.address=:443"
      - "--certificatesresolvers.myresolver.acme.httpchallenge=true"
      - "--certificatesresolvers.myresolver.acme.httpchallenge.entrypoint=web"
      - "--certificatesresolvers.myresolver.acme.email=email@mydomain.org"
      - "--certificatesresolvers.myresolver.acme.storage=/letsencrypt/acme.json"
    ports:
      - "80:80"
      - "443:443"
    volumes:
      - "./letsencrypt:/letsencrypt"
      - "/var/run/docker.sock:/var/run/docker.sock:ro"
    networks:
      - default
version: '3.3'

networks:
  default:
    external:
      name: gateway
  myapp-net:
    driver: bridge

services:
  my-backend:
    # image: api listening on port 8080
    container_name: my-backend
    restart: always
    labels:
      - "traefik.enable=true"
      - "traefik.http.routers.my-backend.rule=Host(`myapp.mydomain`) && PathPrefix(`/api`)"
      - "traefik.http.routers.my-backend.entrypoints=web"
      #- "traefik.http.routers.my-backend.service=my-backend"
      #- "traefik.http.services.my-backend.loadbalancer.server.port=80"
      #- "traefik.http.services.my-backend.loadbalancer.server.port=8080"
    networks:
      - myapp-net
      - default

  my-frontend:
    # image: app listening on port 80
    container_name: my-frontend
    restart: always
    depends_on:
      - my-backend
    environment:
      - OPI_ENV=production
    labels:
      - "traefik.enable=true"
      - "traefik.http.routers.my-frontend.rule=Host(`myapp.mydomain`)"
      - "traefik.http.routers.my-frontend.entrypoints=websecure"
      - "traefik.http.routers.my-frontend.tls=true"
      - "traefik.http.routers.my-frontend.tls.certresolver=myresolver"
    networks:
      - default
      - myapp-net