Responsive Job Listing Page using React

Community feedback

• 

  P

  markus•2,160

  @markuslewinPosted over 2 years ago

  This comment was deleted about 2 years ago

  1

  ---

  

  Isaiah•770

  @Isaiah-BPosted over 2 years ago

  @markuslewin Thank you! I spent forever trying to figure out how this should have been done, but this makes a lot of sense.

  1
• 

  Bryan Sanchez•590

  @0-BSCodePosted over 2 years ago

  Awesome work! Besides the background color of the filter buttons (nothing a little CSS can't fix🤣), I don't find any noticeable difference between the design and your solution. With regards to your usage of useEffect, I don't see much wrong with it. I would recommend that you load in the data in App.js since that's where most of your components will be called. This way, if you need to send the data to multiple components, you can just get the data in App.js and then send it to your components through there.

  I would also suggest that you place your components in their own separate folders instead of saving them as files directly under the components directory. For example, for your Filter component, in the components directory, you can create a sub-directory called Filter and, within that directory, save your file as index.jsx. So, when you want to import it, you only need to specify up to the Filter directory because react will automatically use any index file in that directory as the component. You can read more about it here.

  Another thing I like about this approach is you can place any other file related to this component in the same directory. Going back to the example, in the Filter directory, you'll be able to have an index.jsx file for the component itself and a style.css file for the styling of the component. Of course, using this approach comes down to personal preference but I use this so that all the files I need regarding a specific component are all in one place. This would work really well if you plan to use CSS Modules down the line😃

  Keep it up! Cheers🎉

  Marked as helpful

  1

  ---

  

  Isaiah•770

  @Isaiah-BPosted over 2 years ago

  @0-BSCode Wow thanks! The way my React projects are organized is another thing I try to keep in mind and improve. I will definitely look into this approach.

  0