Errol Hassall

View Original

Think about the whole stack

Software engineers are usually divided into two groups, backend and frontend. Sometimes you will have people that are full-stack but for the most part, they are either one or the other. When I first started I would constantly build the API for this startup in a certain way, I would build it how I envisioned it should work based on the requirements. I would code away for a few days and at the end of it all, there would be the feature. It would be reviewed and put into staging where the frontend would then take the development branch and add the necessary frontend changes to complete the feature. Every single time, 5 minutes in there would be “Hey Errol, how do I get X data?”, I would respond with “well call this existing query”. This was never the right option. When you have a feature that requires a bit of information on the backend but it also requires some information that exists in another query it's pretty easy to disregard that old data and only think of the new data. It makes sense, for as far as your concerned it's already been completed, just call that other bit of data. Well not all the time, for example, if you had a Posts and you also needed to get the comments on that post. In GraphQL you would call something like this

See this content in the original post

This would allow the frontend to call one query which would return all the comments on a post. What I would tend to do is think, well we already have the comments query ill just add a post query, thus splitting the two off and making it two separate calls. In my mind this makes sense, and overall you will need this, you will have examples where you need to call one or the other so yes you do need both. However, for this feature, it specifically required that you return the comments associated with a specific post. I’m thinking well they now both exist so go nuts. However, that's not great design as the frontend has to make two calls to the backend at the very least and now has to play around with getting the ids for a post and then grabbing only the comments for that posts id. It kind of becomes a mess, so instead with GraphQL, you can just add a resolver which will go okay so you want the post and then all the comments of that post. This is a very simple example but when it got more complicated I would fail to see what the frontend really needed. I would constantly build the API as though I was using it when in reality it was the frontend as well. I needed to think about the whole stack, how the new code implements both the frontend and the backend, when I didn’t it would mean me going back and redoing a whole bunch of code.



Thinking about a feature more than just your side is important. I've done it plenty of times, where I create all this code and then forget to add a few fields in the return of a query, which made sense to me at the time but when you think about it from the frontend’s perspective they really need to be in there. When they're not you either have to make other calls or you just don't get the right information. On the other hand, when I did think about what the frontend needs it meant that I didn't have to go back over it, I could essentially write it once and the frontend developers would be happy.  thinking about the whole stack is more about slowing down and planning than anything else. When I rushed through my code to get a ticket completed I was always left with more work to be done. I would forget to add things or the frontend wouldn't have everything they need. The more I slowed down and thought about how others will use the system, the less work I would have to do in the long run. Furthermore, the other developers were happier with me when they didn't have to keep coming to me asking “how do I get this bit of data?” or “where is this data field?”. It made others lives around me easier and the more you can make their lives easier, the easier they will make yours.




I’m always learning something new and with Pluralsight I can have unlimited access to all things programming. But hold on, it’s not just programming. There’s photoshop, visual communication, manufacturing and design. There's a whole bunch! Sign up today and get a free 10-day trial!