Improve your frontend development skills through learning backend

I start building web apps about three years ago, playing the role of frontend developer most of time. However, I sometimes designed myself, so I tried to be someone who created beautiful things instead merely being an engineer or hacker. Even though I built a twitter-like app using Ruby on Rails all by myself, I was still not that confident in matters related to engineering like modularity, testing, and scaleability.

In the early 2014, I decided to put all of my focus into programming because I found I love it much more than doing design. As a pure frontend developer in the team, I usually deal with HTML, CSS. and Javascript. I learned how to code in React just last year during our work on the election in Myanmar.

With how much our code volume has increased, I’ve found it’s really hard to reuse some of my previous code and some small issues always arise when I do. For example, I’ll fix a bug and, after a short while, a very similar bug will appear in some other place in the code. Without unit and end-to-end testing, I could never ensure the quality of my code; I’d have to click here and there for quite some time to make sure everthing is working, which is really unsustainable. Although we finish our work on time, I really hate feeling like I don’t have enough control or organization in the project. That’s why our testing methods are so useful.

In my spare time, I learned a lot about backend development and, fortunately, I found a chance to do some backend work on one of our projects last November. The parts of the project I was responsible for weren’t very challenging, but it was my first time doing anything with backend on a real project, and it was with a bunch of smart backend developers. I made a lot of mistakes, but, thanks to reviewing and chatting with the other developers, I learned a great deal about programming and built up some serious skills.

Now when I go back to developing frontend, I implement these newfound backend skills, finding they’re also suited well for my frontend work. Some of these skills may be pretty commonplace in programming, but they’re often neglected by frontend developers. So, I’ll share the most important stuff I learned from developing backend with the team:

Modularity

We have emphasized modularity in frontend for a long time. Some frameworks like React and Angular can help you understand and implement modularity better, but they won’t give you a very clear picture of it. But on the backend, there are already a ton of best practices for modularity. For example, we usually have an error handler when using Express, which is a module responsibile for dealing with errors. In other parts of the code, we just need to execute next(error) to pass the error to the error handler. Modularity isn’t only about splitting your code into different parts and reuse some of it; all components should have their own duties, which gives a rather clear structure to your codebase.

Unit Testing

I have to admit that I’ve never done unit testing in frontend; maybe we’ve taken too much time focusing on “click-testing.” Unit testing can not only improve the quality of your code, but it can also make your life a whole lot easier. Through these means, we can quickly ensure the functionality is working after changing the code for some new requirements and we don’t need to worry about the potential bugs that caused by the modifications. Also, keep in mind that unit testing will pretty much force you to build a better structure in your codebase.

Developing Skills

I don’t mean to say that backend developers are necessarily more skillful than frontend developers, because frontend and backend are typically solving different problems in different situactions. Thus, they both have their respective best practices, but they can learn much from each other. For example, when dealing with requests in backend, a good practice involves writing something like function (req, res) { return function (params) {} }, which will make the function cleaner and clearer by separating the params. You may already have these kinds of skills before reading this article, but with an implementation of these principles, you can certainly devleop a better understanding of when and why to use them.

Many people have suggested frontend developers to learn some backend skills so the frontend guys can have a better view of the overall project. Of course, anyone can benefit from such an exercise. I recommend you try participating in a project as a member of the backend team. In addition to obtaining a better understanding of the project’s development side, your frontend career will get a big boost.

What do you think about learning frontend through backend? I found it really useful for building my skills, so let me know what your experience has been like. Tweet at me or at Wiredcraft and share your story!