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


  • P
    Jenβ€’ 1,230

    @En-Jen

    Submitted


    Hey FM community! I don't have any specific questions but I'd love any/all feedback on this solution. I've only been learning React the last few months so any feedback on anything related to React, Redux, or Styled Components would be much appreciated.

    I wasn't able to figure out how to style the arrows that the user clicks to increase or decrease the value in the inputs of type="number" in a way that it would work on all browsers so I just scrapped styling the arrows but I think that's something I can live with.

    If you're curious to read more about this project, feel free to read the detailed README. Just to summarize, this project includes sound effects, Redux Toolkit for state management, and a few little animations 😊


  • P
    Jenβ€’ 1,230

    @En-Jen

    Submitted


    I would love feedback on this challenge! This is my first multi-page challenge and I am still fairly new to React, therefore any React-related feedback would be highly appreciated. What do you think of the file structure and the way the code is organized? Am I splitting up my components appropriately? How is my use of styled-components? This is also my first challenge where I tried to focus a lot on best accessibility practices. Please let me know about accessibility areas I could improve on.

    I wrote a detailed README for this project so feel free to check that out, but I'll just summarize a few of the things I implemented:

    • a skip link
    • smooth scroll animation
    • a sticky Sidebar in the plan page (only on laptop breakpoint and up)
    • a responsive Spacer component to add whitespace between components instead of using margins

  • P
    Jenβ€’ 1,230

    @En-Jen

    Submitted


    Hey everyone, I'd really appreciate some feedback on this one. This was a really big project for me since I'm still pretty new to React and it's my biggest React project I've developed. It was also my first time styling a React project with styled-components. I really enjoyed the sass-like experience of using styled-components and being able to conditionally style elements with JS (very useful for the different colors with the two themes).

    The main thing that still needs fixing is that when the user drops a todo item after dragging it (which is implemented with the react-beautiful-dnd library), sometimes there is a brief flicker on the items. Has anyone encountered this before in your projects and have you been able to fix it?

    Another thing I'd love feedback on is the structure of my project. Should I be splitting my elements up into even more components? Some of the components I created are strictly css (with styled-components) and don't involve any React. I did this for things that are repeated a few times throughout the project, like for buttons with images in them and for elements wrapped in a box with the same border-radius, box-shadow, width, padding, etc. Is that an appropriate use of a component?

    Any other feedback you have is totally welcome!


  • P
    Jenβ€’ 1,230

    @En-Jen

    Submitted


    This was my first solo project using React. Honestly the JS part of this challenge wasn't bad, but positioning the images was the trickiest part. Any feedback on my use of React, CSS, or the way I've structured my files would be appreciated!!


  • P
    Jenβ€’ 1,230

    @En-Jen

    Submitted


    This is my first solo project just testing out my skills with HTML and CSS (using flexbox). Any feedback about class naming, using margins vs padding or media queries would be helpful as I am still learning about the conventions for all of these things. I'm also not sure if it's ok to just use the <a> tag for the call-to-action button vs. the <button> tag. Thanks!


  • P
    Jenβ€’ 1,230

    @En-Jen

    Submitted


    Decided to make a custom hamburger that transitions into an X when clicked instead of using the provided images for the mobile navigation toggle. Any feedback is welcome on my solution!


  • P
    Jenβ€’ 1,230

    @En-Jen

    Submitted


    Tried out a few new things on this project like using min(), clamp(), and calc() functions for fewer media queries and a Sass placeholder. Any feedback on my use of these would be appreciated or anything else in the code/design that you think could be helpful. Thanks!


  • P
    Jenβ€’ 1,230

    @En-Jen

    Submitted


    I wasn't able to figure out how to position the mobile background image in the intro section where it is shown in the design (about halfway down the intro section and with the darker blue background color immediately below it). If anyone has any advice on how to do that, let me know. Otherwise any feedback is more than welcome. Thanks :)


  • P
    Jenβ€’ 1,230

    @En-Jen

    Submitted


    Just wondering if anyone has any tips for creating perfectly circular borders around icons and centering the icon in the middle of the border while still being able to click on the space between the icon and the border and have it act as a button. The way I coded it results in perfect circular borders with the icon perfectly centered, but the space between the icon and the border isn't clickable. Any other feedback on my code would also be greatly appreciated!