Northcoders Bootcamp: Week 11… the one where front-end meets back-end
In the week of the much anticipated Friends reunion and after a crazy two weeks of the Front-End phase ( including a very thorough immersion in the world of React hooks), the third and final week of the Front-End block had arrived.
This was a week in which we would work entirely independently from any pairs to essentially build a front end to accompany the back-end project we’d built at the end of our back-end phase roughly one month earlier. I was so excited to see what I could achieve. Having complete creative control and everything now being linked together and coming full circle was really cool to see!
I’d really enjoyed pair programming before this week but honestly the idea of having an entire week on our own to basically build our own little project was great! I like to think of myself as a preferred solo learner just because I really appreciate being able to get down and dirty in the code to continue to learn and build those mental connections as to what each element does, how each function works and do this without having to always explain every decision or thought to someone. I do enjoy pair programming, but this week had me excited!
After some thorough planning which consisted of about 6 pieces of paper and various scribbles and poorly labeled boxes, I was ready to start with setting up the React app bare bones and slowly but surely construct my components and enact various states along the way. For our back-end projects which we were now building the front-end for, we had been given the choice of a news website or a games website, complete with articles and reviews respectively, commenting features, users and voting options. Soon into my planning stage, I soon realised I had planned to build a lot into the front-end that my API didn’t actually have the functionality to support yet. I’d forgotten just how many post, patch and delete requests I’d yet to complete on the back-end which meant a little extra work for me.
Luckily, having now witnessed the front-end I now felt much more comfortable with the back-end strangely. Having not touched the server side of things for approximately a month, seeing my code again was like meeting an old friend; familiar and reassuring. It was really grounding to witness how far I’d come since week 7 of the bootcamp.
As the week went on, I was slowly but surely building functionality and with a little help from the tutors was able to quite quickly complete my back-end functionality so that I could then start setting state in virtually every component to allow users to do a variety of actions: get, patch and post topics, articles, comments, users, along with deleting comments and articles. As the week went on, my list of functionalities I wished to add was actually growing, “wouldn’t it be cool if a user could update their avatar? Let’s add that in!”, this was something not initially in our brief but I liked the idea of the functionality and realised the inner workings would be fairly similar to voting for an article, so I did it. Realising I was holding the ability to change my project however I wanted was a really exciting idea.
The one place I did come slightly unstuck was with my styling. CSS is a whole beast on its own and it’s one I’m still learning to battle with. Luckily, 90% of my planned functionality was working and ready for review from a tutor by Thursday afternoon and so whilst I pushed that to Git for review, I began working on the visual (and arguably most important?) aspect of a website? This is where I’ll admit I may have benefitted from using a framework such as Bootstrap or Bulma, but due to the slight time constraints I wanted to tackle some original recipe CSS and see what I could learn. Thankfully with a lot of tinkering I managed to construct something I was fairly happy with overall, but I have made it a top priority for myself to teach myself some Bootstrap in the very near future so I can improve the visual side of my projects going forward.
Thankfully the feedback from my tutor was really positive. He appreciated my added features I’d gone above and beyond to incorporate to enhance the user experience which was a great feeling to know! He also picked up on all the bits I still had to complete (adding a sort by query to my topics which was on my to-do list thankfully) which was reassuring too. The positive and constructive feedback was really appreciated and gave me a great morale boost overall. That feeling of “what if i’m not good enough?” was hushed.
As the Friday came to a close, I sat back and basked in the realisation that I had a fully functioning app on my screen that I had single-handedly coded from nothing! How cool is it to be able to say that?!? As a pretty optimistic person I tend to have an unrelenting view that everything will work out alright in the end. 11 weeks after starting the bootcamp and constantly questioning “can I keep up? am I learning fast enough? what if I can’t do this on my own?” I can now say that as we approach the home-stretch of the bootcamp with the impending Group Project phase, I can do this, I will do this!
Oh and if you actually wanted to check out my app so far (please be kind, this is a long way from finished! But we took to hosting something whilst we added finishing touches. If I could only show you the list of improvements and features I still have to add this week!…) you can find it at https://jasneastwd-nc-news.netlify.app. First on my list, learn Bootstrap, I definitely need to fix te hideous look of it, and get the responsive layout working!
