How I am supposed to Deploy an app that has dinamic generated url´s?

1

Hi there. This is my first full stack app I´m trying to deploy.
Until now I have only deployed to the web Front End applications.

This time I have several doubts for this:

  1. First Doubt Do I have to change the API requests urls? For example “http://localhost/3000/api/list” and so on.
    I imagine I have to change the localhost/3000 part, right?

  2. Biggest doubt/ Problem My app generates “dinamically” new urls:
    For example, my front page is this: localhost/3000
    But when an user creates a list, it generates an specific ID for that list, and it makes an specific url for that list. So anyone with that url can see it. For example:
    www.todolist.com/list/abd031010as
    (i´m already substituing the local host for my supposed domain)

will this work? One big doubt is that if for example I want to deploy it in netlify or heroku, when i deploy i need to know the domain that netlify/heroku will give me in order to put it correctly in my app. But until i deploy it i wont know the domain name LOL So how could i sort this out?

2

In response to the first question - and I guess the second - an easy way to store these as constants. One common way is in a .env file. That’s often used for secret information but you can use it for non secret information.

For example, in the my local .env file I could have a constant like:

SERVER_URL=http://localhost/3000

And then when I set up heroku, I can set up the environment variables. I don’t know about netify, but I’ve done it on heroku and I assume it’s pretty standard.

Then in my code, I just prepend all my urls with that.

3

But yes, this is all confusing and taking that leap from the hypothetical to the concrete is scary. Everyone goes through this. Just stick with it and ask questions. You’ll get the hang of it.

1 Like
4

I see! Well i think i sorted out that problem! But now I have one issue more…

First when i deployed yesterday I got a CORS ERROR and I had to change all of my requests (http://localhost:4000) to https (https://localhost:4000) I hope that´s all right So far that error stop appearing.

But then another error is that my API requests still don´t work. Do you think it could be because i hardcoded the local port in my api requests, and then in my backend i have this:

app.listen(process.env.PORT || 4000,

Could it be that Heroku is serving the backend in another port and that´s why my api requests are not working? If you think it could be that how can i put the correct port in the front end? This didn´t work:

 axios.post(`https://localhost:${process.env.PORT}/api/list`

I imagine it is the frontend can´t access environmental node variables that easily?

Thanks :slight_smile:

5

I would console.log process.env.PORT to see what you’re getting. You may have to dig through the heroku logs.

1 Like
6

It says undefined. However I learned that I just should put relative paths in the api calls , and the error doesn´t appear anymore :slight_smile:

However, now I get again another error (request failed 503), I did “heroku logs --tail” in the console to see output errors, and I catched:

 MongoTimeoutError: Server selection timed out after 30000 ms
reason: Error: connect ECONNREFUSED 127.0.0.1:27017

I think it could be something related to my database. Honestly I don´t know I am supposed to have the database on the cloud and that is why it´s not working? I developed the app using mondodb locally

7

Well, I would guess that you aren’t connecting to it properly. Make sure you have the right url, username, password, etc.