Random Quote Generator- please some feedback

You’re right, I thought it looked a bit weird, I will change that!

1 Like

@stilljack True, I will, however, say that because of the use of rapidapi, which (i believe) uses a single API key for all your APIs from the marketplace, it might be a bit worse. If you at some point were to pay for some API on their site anyone with access to your key would be able to use it for free. It may also just be a breach of TOS to leak the key (maybe).

@luvly92 Using an API does not have to be any more complex than what you did already. There are just some potential issues to be aware of. Don’t let me discourage you from playing around with APIs. It is a vital skill to learn. Here is a list of public APIs, you can check the “Auth” column to know which API requires a key.

I will PM you something.

1 Like

@lasjorg just to be super clear: it’s absolutely a legit concern, and I don’t mean to draw attention away from that just wanted to make sure @ luvly92 knew it wasn’ t a failure, but instead a success with an asterisk.

Further, how have ya’all managed your keys in the past? In the last project I worked on that used an api that required a key (mapbox) we hid it within a config file that was .gitignored and passed between the team members, same way we handled our firebase.json (which is little more than a complicated config/api key) – are there better ways or do all the techniques kind of boil down to making sure at compile/deploy time they’re available and just not shard on the open web?

1 Like

@stilljack Absolutely, I agree @luvly92 should get good feedback and positive response. I did not at all mean to take anything away from the accomplishment. I should have given some positive feedback on the project. Hopefully, it is OK and she and others reading the thread can maybe learn a bit about the subject of using an API without it derailing the thread too much.

As for your question. If the client communicates directly with the API and the API requires the key in the query (header or query string) then it is always going to be sent by the client and anyone can look at the request header or request URL and see the key.

My point is, it does not matter that the key is in a config file and is not checked into source control if the client is sending the key when requesting data from the endpoint.

1 Like

I really love it.
I’m stuck in HTML & CSS, I just was quitting, when saw this it motivated me to keep on

I’m glad you liked it.
I was stuck too, JavaScript is waaay harder than HTML & CSS… I had to tell myself that I am not the problem , the problem is I need a better teacher so I looked for alternatives in trying to understand the language. The book Head First JavaScript helped a lot! I still have a lot to learn but I am at least more confident now than I was before.

1 Like

For anyone new reading this, the project is now using a new back-end (with a little help) and the API key is secure. :lock:

@luvly92 Did you think about the code refactor I suggested?

Having the page refresh on each button click isn’t a great solution. It also obscures the code a bit, I was personally a bit confused at first when I saw the code run again on button click because there is nothing in the code that actually makes that happen.

I did look, and you are right. I will change it in the future most likely. I got lucky with the refresh there and did not even know it. :rofl: At least it worked .

This might just be me, but after several minutes a quote has not loaded. Also, while loading, I think the loading symbol should be closer to the quotes. Currently, it looks like the quote will come in above the quotes, which wouldn’t be good.

Yes there were problems with the API, so that is why I decided not to use one in the end, as I am not there yet with my knowledge, so I did the old array with objects shtick.
I did use some free APIs but the connection was not secure(HTTP) so when I pushed it to GITHUB it stopped working. I kinda gave up for the moment.
I will try again using API’s in the future.

I like the design. I prefer to use SVG instead of clip-path because its supported better on all the browsers for the moment. Fontawesome is a big download for just a few icons. I prefer SVG sprites to make the site faster. The random number could have 2 of the same random numbers in a row which would look clumbsy. And the API issues discussed already.