Houari Aouinti
@aouintihouariAll comments
- @jenna1kSubmitted 3 months ago@aouintihouariPosted about 2 months ago
Great job; the app seems to work correctly. However, you could have added some transition effect to make the user experience smoother, but well done. Keep practicing.
1 - @kaoutar-ouadihSubmitted 3 months agoWhat are you most proud of, and what would you do differently next time?
I'm proud of completing this challenge!
What challenges did you encounter, and how did you overcome them?I struggled with making the filter and search work together, but in the end I figured it out.
What specific areas of your project would you like help with?Anything that can help me improve.
@aouintihouariPosted about 2 months agoCongratulations! You did an excellent job. But there is room for improvement. For example, it would be preferable to use the startwith to filter the countries rather than looking for those that contain a particular letter when using the search bar to filter the results. Additionally, since console.logs are typically used for debugging, remember to clean them up before deploying your application. In the border countries, the full name of the country should be displayed, not just its abbreviation, and clicking on it should take you to the country's details. Additionally, adding a SkeletonLoader while the user waits for the data to be fetched from the JSON file enhances the user experience. Although the json file only provides the abbreviations, you can use the alpha2Code or alpha3Code to find the full name. Additionally, try using memoization to avoid needless recalculations of values in React. I realize this is possibly one of the trickiest parts of the challenge.
1 - @Djamel1133Submitted 2 months agoWhat are you most proud of, and what would you do differently next time?
Mobile first approach ....
What specific areas of your project would you like help with?Any feedback is welcome
@aouintihouariPosted 2 months agoWell done! Keep practicing and improving.
However, I've noticed that you've used the @import in your CSS file rather than linking them directly in your HTML. For a very small and simple project like this one, it's not a problem, but you should know that it's not a best practice. You should link the fonts directly in your HTML for better performance.
Linking fonts directly in the HTML <head> is better for performance due to a few key reasons:
-
Early Loading: The browser can start loading the font as soon as it encounters the <link> tag, reducing the time it takes for the font to be available for rendering.
-
CSS Parsing: When using @import, the CSS file must be fully loaded and parsed before the font can be requested, adding an extra step that can delay font availability.
-
Parallel Requests: Linking directly allows the browser to initiate multiple requests simultaneously, which can improve overall loading speed compared to the sequential nature of @import.
-
Reduced Render Blocking: Using a direct link can help avoid blocking rendering, allowing the page to display content faster.
Overall, these factors contribute to a smoother user experience and better performance metrics for your site.
Marked as helpful0 -
- @danmlarsenSubmitted 2 months ago
Mortgage repayment calculator using React & Tailwind
#react#tailwind-css#typescript#vite#framer-motion@aouintihouariPosted 2 months agoGreat job, honestly, I love and I love how smooth the interaction and the result display are. The only thing I could say is maybe when there's a switch in the mortgage type, it could have been better if the result changes automatically without having to click on the calculate button again. Also, maybe you could have added a comma-separated format for the mortgage amount input. But great design and job overall.
Marked as helpful0 - @WillAsampongSubmitted 3 months ago@aouintihouariPosted 2 months ago
The images don't appear on the screen and the gallery takes more columns than it should, also there's no way to deselect an item by reducing it's value to zero, the only way to do that is using the remove icon in the cart, but once done the - and + icons are still apearing and the add to cart icon is removed, also even after removing the all the items from the cart, the cart doesn't show the empty cart icon as it should. I've just accomplished this challenge, you can take a look to my code if you need help to accomplish it.
0 - @AdamullaOsasSubmitted 3 months agoWhat are you most proud of, and what would you do differently next time?
I know I missed a few hover effect ;))
@aouintihouariPosted 2 months agoWell done, This is a great job, I'm not going to talk about the hover effect, as you're already aware about them, but maybe you should have increased the z-index of the switch mode component so that it's not partially covered with the timer's box-shadow. Good luck, and keep practicing.
0 - @thusmileySubmitted over 1 year ago
My method for this project is quite manual. Will switch to react later.
@aouintihouariPosted 2 months agoGreat job, congratulations, especially that you made it only using vanilla JS and Sass; the only functionality lacking is the slideshow; images should slide automatically when it's clicked. Also, it could be better if there were some smooth animations and if the content was injected automatically rather than having many pages.
0 - @chrisaidan96Submitted 2 months ago
- @dimitrisdrSubmitted 3 months agoWhat are you most proud of, and what would you do differently next time?
I am very proud from bringing this project as close as the original one! Scrimbas course and Kevin Powel helped me understand a lot of things that wasn't clear to me before!
What challenges did you encounter, and how did you overcome them?Organizing my code was something that i got struggled with. The lesson that I followed gave me inspiration and new ways of organizing css html and js.
What specific areas of your project would you like help with?Accesibility is something that I need to study. I also think that asynchronous functions is something that I don't fully understand
@aouintihouariPosted 2 months agoWell done, only improvement maybe changing some font family for some parts in the content to adapt the original design, also the explore button should be clickale and lead to the destination page
Marked as helpful0 - @35degreesSubmitted 3 months agoWhat are you most proud of, and what would you do differently next time?
I wasn't that excited about using Tailwind but I'm so glad I did. It's a clean, efficient and sometimes fun way to write code. It makes container sizes so easy.
What challenges did you encounter, and how did you overcome them?Getting animations right was challenging but I like a few that I came up with, like the FAQ dropdown.
What specific areas of your project would you like help with?Any feedback is welcome to improve my skills.
@aouintihouariPosted 2 months agoGood job, but there are some room for improvements, For example, on mobile screen size, the text overlaps in the feature section, the email validation isn't implemented, some button background and border colors don't correspond to the the design you were asked to implement, and the hamburger navbar needs to cover everything, including the logo. But it is a good job. My comment is not meant to discourage you, but to push forward and make you take more things into consideration next time.
Marked as helpful0 - @kadiryildiriSubmitted 3 months ago@aouintihouariPosted 3 months ago
Good job; however, the left image should take more space than the right section, and the text and the title should also change when there is a click on the arrows. Not only the image, but you should also add some more animations and make it run more smoothly. Take a look at my implementation; maybe it can inspire you. I also personally think that there's no need to use a framework like Tailwind for such a small project.
Marked as helpful0 - @ajervin900Submitted 3 months agoWhat are you most proud of, and what would you do differently next time?
sdfsdf
What challenges did you encounter, and how did you overcome them?sdfsd
What specific areas of your project would you like help with?sdfsdf
@aouintihouariPosted 3 months agoThis is not the same project; this is not serious at all, you'll never get a good job as a programmer if you're not serious and professional.
0