DEV Community

😊Feedback, please

Yuri Alves on November 19, 2020

I have made this within 24 hours.
https://thesheddev.netlify.app/
I have even added a system for the admin(me), to create posts (let me know if I should do a tutorial on that).

Alex Janke • Nov 24 '20

Looks neat, pretty minimalistic which is nice.

Noticed one minor UX thing though:
When you hover over the "Ready! Set! Go!"-card, the whole card gets "focused" and the cursor changes to a pointer.. but I can't click the card. Only the button "Read more" is actually a link. For a more clear user navigation you'd need to remove the cursor pointer on the card and only make it available on the button - or make the whole card a link.
Apart from that you could also improve some of the load by minimizing your .css and .js files.

I know it's nothing huge but you can also improve some readability in your .js file by using template literals.

With string concatenation

$(".posts")
.prepend("<div data-id='"+id + "' class=\"post\"><strong>" + Title + "</strong><p>"+ ShortDesc + "</p><button onclick=\"viewPost(" + id +")\">Read more</button></div>");

With template literals (string interpolation)

$(".posts")
.prepend(`
<div data-id="${id}" class="post">
  <strong>${Title}</strong>
  <p>${ShortDesc}</p>
  <button onclick="viewPost(${id})">Read more</button>
</div>`);

Yuri Alves • Nov 24 '20

Thank you 😊. That was some really useful feedback. I will start working on Thorne points. 😱 you looked at my terrible code. Haha thank you for that. I don’t know why I didn’t do it that way to be honest, but thank you for the reminder.

Alex Janke • Nov 24 '20

You're welcome. None of these points are actually super important but it's the little things that add up over time :)

you looked at my terrible code

To be honest I didn't really read it.. 😉 Just opened the .js and saw the really long string concatenation. Though I do wonder if you really need jQuery for a site like this

Yuri Alves • Nov 24 '20

That’s very true.
Oh thank god haha.
To be honest no. I’ve just been using it for so long I have gotten lazy to write proper JavaScript haha. I should probably remove it