@christopher-adolphe
Posted
Hi @MuriWolf 👋
You did a great job on this challenge. 👍 The markup, styling and component composition are well done. 👌
One easy fix to get rid of these accessibility report errors/warnings is to set a value to the lang attribute of the <html> tag like so <html lang="en"> in your public directory.
I have been trying to do various actions in the application and I have noticed that when I reply to a comment, my reply is not added right away. I had to add another reply then both of them appeared. I'm not sure if it's because your REST API is hosted on Heroku and it is responding slowly but you might want to double check that as it hinders the user experience.
In case it's your REST API which is responding slowly, there is a way you could give a faster feedback to the users. Right now, you've written the CRUD operations of your component in a pessimistic update style, meaning; you are making the calls to the REST API and then you are updating the UI.
You may give the user the impression that application is faster by doing the opposite, i.e; you will update the UI first and then make the calls to REST API. This is an optimistic update. 😉 However, when doing so, you will need to keep a reference of the previous state so that if ever an error occurs while doing the update, you can safely revert to that previous state. Below is an example of what an optimistic update looks like in code:
// 1)Keeping a reference of previous state
const previousComments = [ ...this.comments ];
// 2) Updating the UI
this.comments = [ ...this.comments, this.newComment ];
try {
// 3) Calling the endpoint to post the new comment
const response = await fetch('some-endpoint-url', this.newComment);
} catch (error) {
// 4) Reverting to the previous state if an error occurs
this.comments = [ ...previousComments ];
// 5) Giving a feedback that an error occurred
alert(`Sorry, an error occurred while adding new comment: ${errror}`);
}
The above code snippet is not Vue.js specific but I think you'll be able to implement it somehow.
I hope this helps.
Keep it up.
Marked as helpful
@MuriWolf
Posted
Hi @christopher-adolphe! Thank you for your time testing my application and giving me feedbacks!! I really appreciate this. What you said will be very useful to me, mainly the "optimistic update", i had a hard time updating the data on the site. And i will update the lang attribute too 😅. Again, thank you and have a nice day!!!
@christopher-adolphe
Posted
@MuriWolf you are welcome.
I'm happy to help and glad to see this was helpful to you. 🙂
See you on the next one.
Best regards.
