Design comparison
Solution retrospective
What did you find difficult while building the project?
My first approach was to create two HTML's, index and thanks...
I was not able to cross the rating's result from index.html to thanks.html.
Finally I created both cards in the index.html file and using JS I controled the visibility with the obj.classList.toggle( ), and got the result.
Which areas of your code are you unsure of? My second approach, described above is correct? Is is possible manipulate DOM crossing files?
Do you have any questions about best practices? Above described.
Community feedback
- @danielmrz-devPosted 10 months ago
Hello @Alex-Gamarano!
Your solution looks excellent!
I have just one suggestion:
- Use
<main>to wrap the main content instead of<section>.
š The tag
<section>would make more sense if the card was part of a bigger website (in certainly would in real world), but here it is all we have on the screen.This tag change does not impact your project visually and makes your HTML code more semantic, improving SEO optimization as well as the accessibility of your project.
I hope it helps!
Other than that, great job!
Marked as helpful0@Alex-GamaranoPosted 10 months ago@danielmrz-dev
Thank you Daniel, I'll use your suggestions to optimize the project.
Cheers!
1 - Use
- @IamparvesPosted 10 months ago
Your approach is good. This is also how single-page applications, such as React.js, work. React projects contain only one index.html file. Additionally, the content/DOM is altered with Javascript.
However, if you absolutely want to accomplish it with different html files, you can pass the rating using URL parameters.
For more information, see this article: How to Pass Value From One HTML Page To Another Using JavaScript
Marked as helpful0@Alex-GamaranoPosted 10 months ago@Iamparves , thank you very much for your answer and for the link. I'll check that out.
Cheers mate!
0
Please log in to post a comment
Log in with GitHub
Join our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord