Getting Refactored
In the last week, I've been working really hard on getting my aunt's website rewritten. I know I've talked about it in my last few blogs, but in case you didn't read those, I was given the task of fixing up their website for their business. The page that's up right now is written with Wordpress, and since I don't know the first thing about Wordpress, I chose to do the project using React. It was slow going at first, but now I'm really cooking. In fact, I'm now down to the last 10 to 20 percent of the site, besides the work I'll put in to get it fully deployed, which is going to have a whole series of challenges involved with it. I started out with some of the easier stuff, including the navigation bar, the contact page, and their about page. I then moved on to the home page, portfolio page, and latest news page. Yesterday and earlier today, I finished up the individual news articles and some of the features involved with them. This left me with just a few things to clean up and fix, such as a couple buttons on the home page that were out of place, and the navigation bar being responsive. The navigation bar is now responsive, but it doesn't look like I want it to in mobile view, so I'm going to have to get back at this at some point. My biggest issue is still unresolved. On their homepage, they have a scrolling hero image with a header in the middle, but I can't seem to figure out how to get this to work quite yet. I know I'll figure it out, but I suspect this will take a day or two on its own, and I'm not ready to tackle it yet.
I committed my code to React a couple of days ago, and unless I was reading it wrong, I was at about 15,000 lines of code. This might sound impressive, and I guess it is in a way. It definitely shows how much work I've put into this so far, but if you were to look at the code, you might puke. I'm repeating things all over the place. The portfolio page alone was nearly 700 lines long. This, to me, was unacceptable. I could have left it just as it was; it wouldn't have affected the way the site works in any way at all, but it was too ugly to leave as it was. I would be ashamed to put my name on it. I'm only about halfway through the refactor job, but as an example I got the portfolio page down to about 150 lines of code. Dropping 550 lines of code is impressive, but it should also tell you how WET that code was. The majority of my refactoring is coming down to just breaking it up into smaller components, but I'm seriously considering adding some arrays full of objects so I can map over them in a few spots. This would take the code down to a minimum and make it much more manageable to maintain. As I said, I could have left it as it was and it would make no difference to my aunt or her business, but it was eating me alive. I should sleep much better tonight. Not to mention, I will be the one maintaining their website in the future, so my future self will definitely thank me.
I'm having a hard time devoting all of my study time to this project, so I've decided to add Stephen Grider's Modern React with Redux course from Udemy to my regimen. When I get burned out from working on the website, I switch over and work through some of the lessons in this course. So far, the material has been very basic, and I probably could have skipped it and been just as well off. However, if I stop to think about it, some of these concepts would have been like reading a foreign language just a few months ago. Passing props between components was a real struggle for me to grasp, and now it's something that's nearly natural for me. I'm certainly not overly confident about React; some of the more advanced concepts are still really difficult for me to grasp, and Redux still boggles my mind. That's the reason I'm taking this course. I really like the way Stephen teaches, and I think he's just as good as Colt Steele. I definitely wouldn't compare him to my favorite instructor, Will Sentance, but Will sits on a lofty perch. I believe this course ramps up pretty quickly, so it won't be long before we get into some stuff that will challenge, and I'm hoping to feel like I do about the concepts we've covered so far with some of these concepts I still struggle with. I think I've put as much work into the website as I can today, I'll be spending the next 3 or so hours working on this course, and hopefully getting past the basic stuff in the process.
Until tomorrow!