26/365: Click Events

 With the Meta course still broken, I went out independently in search of something to learn. I found a video on the Web Dev Junkie youtube channel describing a interview challenge app for a junior React developer. The problem statement is as follows: a user can click anywhere on the page to create a circle, and there is an Undo button to remove the newest circle, as well as a Redo button to return that circle once removed. I went ahead and built my solution, pushing commits to GitHub and deploying it to Vercel once finished. Sidenote: having Vercel in your terminal is awesome. It is deployed here: https://click-event-jaydav9.vercel.app/

Making this app required the use of click events and state. The entire App div is listening for clicks, and once the user clicks the page the onClick method extracts the x and y coordinates of the click from the event object. These coordinates are added as an object to an array in state. This array is mapped in the return statement to render all the circles. Whenever the Undo button is clicked, the last object in the array is popped, and added to a second array in state. The Redo button then makes use of this array to access the coorindates of all the removed circles.