Url Shortener Microservice Feedback and Suggestions

Developer Showcase
1

Hello!

So I’ve finally finished my url Shortener and I’d really appreciate some feedback. I also have some questions since I’ve just started to get familiar with coding the backend.

Do I need the nodemon.js file for anything? As far as I can tell I shouldn’t need it but without it, my last 2 tests would fail.

How should I have known that the post request would be a JSON object with this structure:

{
    "url":"https://www.goodreads.com/"
}

Initially, when I tested things in postman I just sent plain text in the body so I didn’t understand why I was failing the tests.

That’s why I also changed the input id and name of the input form so that I would receive the same key and be able to destructure it.

In the urlNumber.js I have these 2 :

router.post('/:urlIndex', redirectToAdress);
router.get('/:urlIndex', redirectToAdress);

That’s because I didn’t know how to make the form action work with the get method. The get would add the ? separator and my query after that. Even though I needed the /api/shorturl/:[data-from-get-input] structure it would give me the /api/shorturl?[data-from-get-input] structure. That’s why I’ve used the post method. Then I realized that the browser defaults to the get method when you type the adress directly so I’ve also added the 2cnd router.

Live link: https://boilerplate-project-urlshortener-1.flaxi-cj.repl.co
Replit: https://replit.com/@flaxi-cj/boilerplate-project-urlshortener-1#.replit
GitHub:GitHub - flaxi-cj/boilerplate-project-urlshortener: A boilerplate for a freeCodeCamp project.

2

One last thing I forgot. How would integration with React Work? Instead of having all the HTML in a file?

I guess I could spin up a new live server for the frontend and fetch data from the backend but I don’t know how this would work in replit.com.

Also, I’m still trying to figure out how the folder structure should be. One folder for public/frontend and one for the API? and should the gitignore and json packages be different for each folder?

3

Hey!

  1. Regarding the get endpoint and getting some extra params , you may want to take a look at the Route Parameters section in here

  2. Regarding react - if you think about it it’s just a library. You can even pull it from an online version if you want. Do take a look here → Embed React into an HTML web page - imho there is no point in complicating the tool chain. How you do it normally is you host a server separately from the client, so you end up having 3 different applications. If you want to keep it easier for now I would advise to keeping it down to one only.

  3. You shouldn’t need a nodemon - from what I see it is used only when you run the npm run dev command. Granted it’s not running like this on replit it is required only for local development.