How are we expected to solve this? I intuitively came up with the first approach when I first tried to solve this, but Cristian says to only use the state in the App component for this, which took me a lot more effort to figure out cuz in the first one, it's very easy to update the each counter individually without touching others and needing an id, but in the second one all the counters re-render everytime just one of them is clicked. But which is better? React Challenge - 4 (Approach-1) React Challenge - 4 (Approach-2)
@Cristian Florea Thanks! I'm using Typescript just to get used to it from now on. Regarding id, I knew it's an overkill for this challenge but just tried to be less repetitive so if there were 40 counters, I wouldn't have to write an id for each one.
https://codesandbox.io/p/devbox/react-challenge-2-with-tests-forked-wpqqzp?workspaceId=ws_FAponGQPTomjUQNKWLDyvX Playing around with it in Typescript too, but I'm not there yet. Let me know if you guys have any feedback.
@Joshua Tillman Yeah, keep going brother! I agree that it'd feel annoying to work on a single screen, especially when the project grows bigger, but don't let that stop you from making progress.
@Adelin Rosca Okay bro, I fixed them all except that toogle thing. How is it mutating the state directly when it's using "map" to create a new list by copying from the state? And I don't understand how you meant to use "return {...element, completed: !element.completed}".
DevTinder is a full-stack MERN application for developer networking and real-time chat, built using React, Redux, Node.js, Express, MongoDB, Socket.IO, and deployed on AWS with a custom domain. https://www.devtinders.ca/login https://github.com/Shaeranw01/devTinder-frontend https://github.com/Shaeranw01/devTinder
Good job Sharan! There are a couple of suggestions. Add some content on the first page besides login options that anyone can see and learn about your app as soon as soon as they visit your site Use input validation methods to prevent user from entering invalid data and maybe use confirmation for that along with forgot password option. For the errors like in the image attached (after entering an email that's already taken), show the errors simple and concise so people like me can understand :D
This one took a bit longer than expected 😅 I was working on it on and off because motivation hasn’t been great lately along with other things going on. There is definitely more I could add but I think it covers all the required extras. https://codepen.io/EAmbrozas/pen/LENYWoM