Design comparison
SolutionDesign
Solution retrospective
What are you most proud of, and what would you do differently next time?
I am proud of getting work on Typescript although i am very beginner and also i am proud to use React for this project.
i am open for suggestion. Thank you
What challenges did you encounter, and how did you overcome them?i always struggle on typescript , but i will learn a lot .
Community feedback
- @alex931dPosted 7 months ago
Great solution but i notice some major flaws :)
- Search doesn’t work properly - when i search for example ‘ant’ all countries containing ‘ant’ no matter the order comes up usally when making an search bar you will want to check the position too
- React.FC is outdated and you should not use it
- Lack of error handling and datacontext - what i mean by that is you have no contexts where you load data from for example you chould have made an theme context and country context where you load the theme and set the theme and load the countries data from and set it you can use React’s context hook
- Instead of doing the loading of fetched data manually you should use something called react query since i notice you don’t take care of all edge cases, react query will do the work for you and even prioritize the fetch before the site is loaded
Hope all of it helps :)
Marked as helpful0 - @C3SC0-V4113Posted 7 months ago
Hi! Im seeing your project and is looking cool! However there are some flaws:
- There is a scroll in the x-axis in any size of the screen, you can solve this with the css property 'overflow'
- Your toggle theme button only works in the logo, i think is better if the letters also are clickable
- And the search overwrites the region decision, so you have only name search or only region search, but not both combined, i solved this by doing the region by API and the name using the filter option of javascript
1
Please log in to post a comment
Log in with GitHubJoin 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