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

Submitted

Job Listing (React)

Axelβ€’ 250

@AxlMrt

Desktop design screenshot for the Job listings with filtering coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
3intermediate
View challenge

Design comparison


SolutionDesign

Solution retrospective


I've used React to work on this challenge.

It didn't took me as long as I was thinking, only a few hours (i think around 5h in total). This was a good challenge, it helped me to work on my JS / React skills, even if it's far from perfect.

I've tried to be as close as possible to the design but i couldn't figured out why my tags aren't centered.. (New! & Featured)

Well, if someone has something to help me improve, or has any advices, i'll be glad ! Thank you !

Edit : I don't know why the report on FrontEnd signal that i've didn't put any alt text to the img but there is alt text. I don't know.. Meh.

Community feedback

AC πŸ€β€’ 340

@alleycaaat

Posted

Great job on your project! I took a look at your code based on your comment about the alt failing. You're right, you did put it in the code <img src={post.logo} alt={post.title} />, but when you look at data.json, there isn't a title key. Swap that out, and I think you'll be golden :) Gotta love coding where simple, small goof-ups can be so annoying.

Marked as helpful

1

Axelβ€’ 250

@AxlMrt

Posted

@alleycaaat I am feeling so stupid right now.. thank you a lot for reviewing it. Ill ne more focus next time 😭

0
AC πŸ€β€’ 340

@alleycaaat

Posted

@ADotBit oh don't feel stupid!! It happens to all of us! Sometimes taking a short break or a second set of eyes is all we need to sort things out. I've definitely felt sheepish more than once as a result of silly mistakes πŸ˜…

0
Muhammad Abdullahβ€’ 2,650

@0xabdul

Posted

Hello Axel I Check out the Job listings with filtering project some error ! but the project is so Awesome ❀️ and responsive also great πŸ˜ƒ

0
Muhammad Abdullahβ€’ 2,650

@0xabdul

Posted

Hey there well congrats on completing the Job listings with filtering🀩

  • A Some recommendation for improve your code πŸ“
  • In Html 🏷️ :
  • IMGπŸ“Έ
  • whenever using the img tag put the alt attribute
  • Ensure all informative <img> elements have short, descriptive alternate text and all decorative <img> elements have empty alt attributes (e.g. alt="").
  • There are three main ways to add alternate text to an image: Using an alt attribute i.e. <img alt="drawing of a cat" src="..."> Using an aria-label i.e. <img aria-label="drawing of a cat" src="..."> Using an aria-labelledby attribute i.e. <img arialabelledby="someID" src="...">
  • Or
  • Alt Must be included in IMG TAG
<img src="icon.png" alt="icon"></img>
  • I Hope you find the solution and it's useful for you πŸ˜€
  • Happy CodingAxel🀩
0

Axelβ€’ 250

@AxlMrt

Posted

@0xAbdul Hi mate ! As I said in my comment, I already put the alt text. Someone took the time to review my code and told me where the problem came from 😊

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join 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