My Hooking Adventure
Lately I’ve been working on trying to make a copy of an existing website. It has been quite the challenge for my CSS skills. But of course that wasn’t enough for me, I had to try and use more hooks as well. I’ve been hearing that people really liked using them and thought it was time to take a closer look at them.
When I think of the times I used hooks before this project, I remember that I would use them for some Bootstrap modals and possibly when I used the useHistory function in my projects. I knew I could be using hooks more, so when the time came that I wanted to keep state, It was time to try some hooks.
In this particular component I was looking to start off with an array, so I set that as my useState. I needed state because what I wanted to do with this component is show the most recent/upcoming vacation by itself, and put all the other vacations together. That was going well, I was able to write one function to handle all that, and then I put in a delete button and everything broke.
Well not everything, it was the recent vacation interaction with the delete function I wrote. Remember how I said I used one function to sort them out? In the case of the array with the recent vacation, it only had the recent vacation in it so when that got deleted, it was hard to set the recent vacation to the last of the array. That little setback made me think a little bit more about what props I’m sending to the delete button.
I know when I used state I would write conditionals to render other components, like if someone was signed in I wouldn’t want the register or sign in buttons to show. So I tried a similar thing with a hook I made for the login component. I wanted a button press to determine the contents of this component. The user is supposed to be able to choose whether they are registering or logging in and I was able to account for that with this hook.
Like I said still working on that CSS but this was to show how it looked when the create profile button was pressed in the jank login box. I should have put placeholders instead of naming them there as well, but that isn’t the discussion for today. Right now I think it helps to illustrate the change. It looks like hooks will be in my future, glad I’m not a fish.