Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

All solutions

  • Submitted


    Description

    This was my first project using React. I recently completed Scrimba’s basic React course, and this was a great project to follow up with and practice everything I had learnt.

    As well as meeting the requirements for the challenge, I also added an additional feature that allow users to delete any result from the list.

    Questions

    • I’d love some feedback on the organisation of the project, its component split, state management etc. As this is the first time creating a project in React I was not sure if I was following best practices etc.
    • I found myself nesting a lot of flex containers, and wonder if this is an inefficient way of doing things.
    • For the url form validation, I only utilised shrcodes built in error handling, but this is not very robust, as it essentially accepts any entry which has some characters split with a period. I want to in the future implement some better form validation, and I am curious if anyone has any specific advice when it comes to URL’s.
    • I also added the svg’s directly in the JSX, to be able to work with them more easily, but find this to be very messy. I read that you can convert them to React components or even use a plugin such as Vite’s Plugin for SVGR. I’m wondering what people find to be the best way to work with SVG’s in React.

    Of course any feedback at all is much appreciated, thanks :)

  • Submitted


    First project here. Would love some feedback on code in general, if there are any major red flags in the way I am doing things, that I should cut out now before I get into any bad habits etc. Many thanks in advance :)

    One specific thing I was having a little issue with the mobile menu. After the menu has been opened and closed again, and then the screen size adjusted, crossing the breakpoints, the menu will flash on screen and slide out of view, due to the .mobile-menu-close class which contains the animation being present. I had looked at multiple ways of trying to fix this but ended up getting a bit lost. One was using js to remove the class once the screen passed a certain width, but I feel there is probably something very simple which I am overlooking... (I hope that makes sense...)