Contenerized expressjs app can't access mongo container - node.js

Question

So, I have created an app using Express.js + Typescript + mongoose and this docker-compose for development:
version: "3.8"
services:
web:
container_name: selfapi
restart: unless-stopped
depends_on:
- db
build:
context: .
dockerfile: Dockerfile
target: development
ports:
- ${PORT}:${PORT}
environment:
MONGODB_URL: ${MONGODB_URL}
NODE_ENV: development
AUTH_TOKEN: ${AUTH_TOKEN}
volumes:
- ./src/:/home/node/app/src
- ./tests/:/home/node/app/tests
- web_nodemodules:/home/node/app/node_modules
db:
container_name: mongodb
image: mongo:5.0.4
restart: always
ports:
- 27017:27017
environment:
MONGO_INITDB_ROOT_USERNAME: ${MONGODB_ROOT_USERNAME}
MONGO_INITDB_ROOT_PASSWORD: ${MONGODB_ROOT_PASSWORD}
volumes:
- mongodb_data:/data/db/
- mongodb_configdb:/data/configdb/
mongo-express:
container_name: mongo-express
image: mongo-express:0.54.0
restart: always
depends_on:
- db
ports:
- 8081:8081
environment:
ME_CONFIG_MONGODB_ADMINUSERNAME: ${MONGODB_ROOT_USERNAME}
ME_CONFIG_MONGODB_ADMINPASSWORD: ${MONGODB_ROOT_PASSWORD}
ME_CONFIG_MONGODB_SERVER: db
ME_CONFIG_BASICAUTH_USERNAME: ${MONGO_EXPRESS_USERNAME}
ME_CONFIG_BASICAUTH_PASSWORD: ${MONGO_EXPRESS_PASSWORD}
volumes:
web_nodemodules:
mongodb_data:
mongodb_configdb:
Following that and assuming that both username and password for mongodb are root, we can get to the database url mongodb://root:root#db:27017 for any service within the compose, and mongodb://root:root#localhost:27017 for the host machine.
In my app, I connect to database this way:
import mongoose from 'mongoose';
export const connectMongoDb = async () => {
try {
return await mongoose.connect(process.env.MONGODB_URL as string);
} catch {
return process.exit(1);
}
};
But it only works if I don't add any database name to the url, so the url can't be something like mongodb://root:root#db:27017/myDatabase.
When I put only the raw mongodb url, and use the command ts-node-dev --poll --respawn --transpile-only --inspect -- ./src/index.ts, everything works fine as you will see below:
API:
But when I add something to my mongodb using the express app, it goes to a database called test, as you can see here in the mongo-express:
Now, let's say I don't want that to happen, intead, I want that the collection projects goes to a database calles MyApp, so I'd put it in the db url, becoming: mongodb://root:root#db:27017/MyApp. Following mongodb docs, if the database doesn't exist, it creates on first insertion, but this is what happens:
.env
API:
Apparently it is working, right? But no, take a look how it is on browser when I access the API:
"This page is not working"
"No data was sent by localhost"
That is happening just because I added the name I wanted that my database to have.
How can I fix that, changing the name, because it's REALLY annoying that all my data goes to a database calles TEST...
PS.: When my app is in a production environment, the url WITH the database name works, but the url is from mongodb Atlas, so it is something like this: mongodb+srv://test:test#db1.mongodb.net/GithubProjects?retryWrites=true&w=majority, as you can see, the database name is GithubProjects, and it works.