Architecture help - How can I architect a web app with a custom subdomain and it's own configuration for each customer?

If I were doing this, I would take the easiest approach which would be to have a r53 CNAME pointing to an application load balancer:

// ...
 const tenantName = new cdk.CfnParameter(this, "TenantName", {
      type: "String"
    })
    const webAlb = new elb.ApplicationLoadBalancer(this, 'alb', { 
      ...
    })
    const apiAlb = new elb.ApplicationLoadBalancer(this, 'alb', { 
      ...
    })
    const zone = new r53.HostedZone(this, 'zone', { 
      zoneName: 'example.com' 
    })
    new r53.CnameRecord(this, 'webcname', {
      domainName: webAlb.loadBalancerDnsName, 
      zone: zone, 
      recordName: `${tenantName.valueAsString}.example.com`
    })
    new r53.CnameRecord(this, 'apicname', {
      domainName: apiAlb.loadBalancerDnsName, 
      zone: zone, 
      recordName: `api.${tenantName.valueAsString}.example.com`
    })
// ...

then you can also have a Cognito user pool per tenant per the documentation here.

Alternatively, and slightly more complicated would be to use CloudFront to provide CDN capability with R53 in front, also with CNAME entries. With this, you can also provide tenant-specific behavior rules in CloudFront to provide custom branding per tenant for example.

// ...
 const tenantName = new cdk.CfnParameter(this, "TenantName", {
      type: "String"
    })
    
    const webAlb = new elb.ApplicationLoadBalancer(this, 'alb', { 
      ...
    })
    const apiAlb = new elb.ApplicationLoadBalancer(this, 'alb', { 
      ...
    })

    const distro = new cf.Distribution(this, 'distro', {
      defaultBehavior: {origin: new cfo.LoadBalancerV2Origin(webAlb)},
      ...
    })
    const zone = new r53.HostedZone(this, 'zone', { 
      zoneName: 'example.com' 
    })
    new r53.CnameRecord(this, 'webcname', {
      domainName: distro.distributionDomainName, 
      zone: zone, 
      recordName: `${tenantName.valueAsString}.example.com`
    })
    new r53.CnameRecord(this, 'apicname', {
      domainName: apiAlb.loadBalancerDnsName, 
      zone: zone, 
      recordName: `api.${tenantName.valueAsString}.example.com`
    })
// ...

You can read the details of the CDK apis I used here:

https://docs.aws.amazon.com/cdk/api/v1/docs/aws-cloudfront-origins-readme.html https://docs.aws.amazon.com/cdk/api/v1/docs/aws-cloudfront-origins-readme.html https://docs.aws.amazon.com/cdk/api/v1/docs/aws-route53-readme.html