Hey FCC forum! I’ve finished my random quote machine project:
And I would love any and all feedback on it. Whether it be on the design, the code, the scripting, how it looks at various resolutions, all that good stuff.
Just a few of things I wanted mention.
1.) I didn’t use a API but rather my own object of quotes, which was a challenge in itself But I wanted to keep it simple and focus on what I know. In the future though I’d like to revisit this project and rework it using JSON.
2.) The machine itself runs on a random number generator which produces a number from a range of 1 to the max number of keys in the object (I wanted to make it so I could add or delete quotes without having to update the generator function itself every time). It then finds that the key corresponding to that number and then retrieves the values stored there.
3.) I also wanted add a check that prevented the same quote from being pulled up two to three times in a row. It doesn’t happen too often since I’m working with a large amount of quotes, but it was just something that bugged me enough to try and find a way to fix it.
4.) I have no idea if I did the tweet button right. It does work, I’ve tested it with a dummy account and my tweet did post. I think in the future I’d like to add some sort of link back to the generator within the tweet, but I ran into issues with the longer quotes and hitting the character limit. So that might just come down to only using shorter quotes.
I like it, it’s a little bit better than mine if you look like it on the markup!
Part 3. You could store an array with your last 3 quote numbers and push a new one at the beginning of the array and dump the one on place 4 at the array. But before doing that you could check the new quote if it exists in the array. Something along those lines I guess.
Part 4. You could use and modify the code out of truncate-a-string in one of the tutorials, to truncate the string then a max charachters of 140 or so.
Thank you! Honestly I spent a lot of time (maybe too much haha) just looking over fonts, colors, going through different background images. Then making sure that all looked good on different mobile views before I even started working on the functionality part. I think it still needs work but I’m satisfied with it for now so I can move on to the next project.
3.) Interesting! Right now I’m just checking the last number verses the new number coming in from the generator, which does solve the problem I had. But, I do like the idea of checking maybe the last three or even five quotes so you don’t get duplicates of those shortly after seeing one. I’ll definitely have to mess around with the array idea!
4.) Yeah I did consider truncating the strings that went over, but I also wanted the entire quote displayed in the tweet. Good thing twitter upped the character limit for tweets, otherwise I don’t think I could get away with a few of the larger quotes I have
I wonder if I can do something where the quote gets truncated and posted to twitter along with a link back to that specific quote. Then when the user clicks on the link in that tweet, they’re taken to the site and there’s the quote in its entirety. They can then of course generate a new quote with the button or by refreshing the page. I’ll have to brainstorm on that one.
HTM is simple and clear. In css you don’t need to use selectors like #quotebox #quote{......} as just #quote is enough. Js is logical and well organized and documented. Good job. Happy coding
Thank you for the great feedback, I appreciate it!
Oh that I know. It’s just a bit of a old habit of mine I got into when dealing with much larger css files and/or when targeted selectors are necessary
I will say, one plus side to it is I can tell exactly where a targeted element is in the html just by looking at the call in the css. “Where is that quote div? Ah right, it’s inside quotebox”. Really the only downside is I just have to remember to use the same selector when it comes to media queries.
Ah I see what you’re saying, the nested id target is kinda redundant. Which is very true. Again, it’s an old habit of mine (probably worth revising eh? ). Thanks again for the input!
But I wanted to keep it simple and focus on what I know. In the future though I’d like to revisit this project and rework it using JSON.
Happy coding
). Thanks again for the input!