Sheffield | 26-ITP-jan | Richard Frimpong | Sprint 3 | quote generator#1058
Closed
Richiealx wants to merge 5 commits intoCodeYourFuture:mainfrom
Closed
Sheffield | 26-ITP-jan | Richard Frimpong | Sprint 3 | quote generator#1058Richiealx wants to merge 5 commits intoCodeYourFuture:mainfrom
Richiealx wants to merge 5 commits intoCodeYourFuture:mainfrom
Conversation
Richiealx
added
the
Needs Review
cjyuan
reviewed
Mar 27, 2026
| const selectedQuote = getNewRandomQuote(); | ||
|
|
||
| quoteElement.textContent = `"${selectedQuote.quote}"`; | ||
| authorElement.textContent = `— ${selectedQuote.author}`; |
Contributor
There was a problem hiding this comment.
The leading - appears to be for styling purposes. Keeping it in the CSS or in HTML could allow us to adjust the view without changing any JavaScript code.
Comment on lines
+38
to
+42
| // Show a random quote as soon as the page loads | ||
| displayRandomQuote(); | ||
|
|
||
| // Show a different random quote whenever the button is clicked | ||
| newQuoteButton.addEventListener("click", displayRandomQuote); |
Contributor
There was a problem hiding this comment.
Placing all the "run on load" code in one place is a good practice.
Would be even better to place the code
inside a function to make it clearer that "this is what runs when the page loads."
For examples,
function setup() {
// code to be executed on page load
}
window.addEventListener('load', setup);or
window.addEventListener('load', function() {
// code to be executed on page load
});
Author
There was a problem hiding this comment.
Thank you for the feedback.
I’ve now updated the quote generator based on your comments:
- I removed the leading dash from the JavaScript and moved it into CSS using a
::beforepseudo-element on the author. - I moved the page-load logic into a
setup()function and now run it withwindow.addEventListener("load", setup)to make it clearer what runs when the page loads. - I also updated the HTML so it now links the stylesheet and script file correctly and matches the final structure.
I tested the app again in the browser to confirm it still works correctly.
cjyuan
added
Reviewed
Richiealx
added
the
Needs Review
cjyuan
reviewed
Mar 28, 2026
| @@ -1,11 +1,12 @@ | |||
| cat > script.js << "EOF"; | |||
| newQuoteButton.addEventListener("click", displayRandomQuote); | ||
| // Run setup when the page has finished loading | ||
| window.addEventListener("load", setup); | ||
| EOF; |
Contributor
There was a problem hiding this comment.
What is this? (style.css also has this marker)
cjyuan
removed
the
Needs Review
Richiealx
added
the
Needs Review
Contributor
|
All good. |
cjyuan
added
Complete
Member
|
Closing PR because the January ITP run has finished. Feel free to re-open if you're still working on it. |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
3 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Learners, PR Template
Self checklist
Changelist
This PR implements the Sprint 3 Quote Generator app.
The application displays a random quote and its author when the page loads. It also includes a "New Quote" button that allows users to generate a different random quote each time it is clicked.
To meet the task requirements, I used the provided
quotes.jsfile and thepickFromArrayfunction to select quotes randomly. I implemented DOM manipulation inscript.jsto update both the quote and author dynamically on the page.I also added logic to ensure that the same quote is not displayed twice in a row when the button is clicked multiple times.
In addition, I structured the HTML for clarity, styled the application using CSS for a clean and accessible layout, and ensured all IDs and elements are correctly connected to the JavaScript functionality.
The application was tested in the browser to confirm:
I attempted to run
npm test, but Jest is not available in the current local setup (jest: not found). However, the application functions correctly and meets all acceptance criteria when tested manually in the browser.Questions
No questions at this time.