11 Tips to Become a Better Front-end Developer

Borrow your designer’s eyes, don’t be a monkey, and blame yourself … what the heck? Check out my tips how to become a better front-end developer.


1. Borrow your designer’s eyes

Not literally … but you cannot become a good front-end developer if you do not appreciate good design.

Designs rarely translate 1:1 in browsers. Sometimes you even don’t have designs, especially responsive versions.

As a front-end developer you will be making a lot of small design decisions for your designer. Learn what makes good design so your designer can approve them with a smile.

2. Clean your desk … code comes next

Clean coding style starts with a clean desk. A messy working environment often reflects one’s mindset and can translate back to your code. Clean your desk first, then work on your coding style.

There are many code guides out there, so you don’t have to reinvent the wheel completely.

3. Don’t be a monkey

Don’t be like one of those monkeys covering their eyes, ears or mouth. Do not cover your eyes in front of problems, hoping that clients won’t notice them. They will. If not them, then their customers.

Anticipate problems — if your experience or your intuition tells you that something requires more care to work properly, discuss it with the client or do it right away. Clients will be impressed with your expertise and pleased with the extra mile you went for them.

(Of course, distinguish between quick win adjustments and out-of-scope work.)

4. Overcome the endless boredom of QA

Quality Assurance isn’t the most exciting part of a developer’s work, but you cannot become great developer if you neglect it.

Have some empathy for the poor QA boy or girl waiting somewhere down the road, and remember that quality isn’t created during the QA process, but rather during the development itself. Ease your job with tools like BrowserStack and Browsersync.

As developers mostly work on Macs, a common issue is not checking their work on Windows. You cannot avoid this, though, as whatever platform you prefer for development, your users will be using both major platforms.

5. Subscribe to the Lifelong Learning University

Imagine a jungle of tech terms, a new exciting framework popping out every month and people arguing about the proper technologies with religious fervor.

Welcome to the world of web development — a lifelong commitment to learning new stuff. If you are not comfortable with that, maybe think about a career change.

6. Go out with KISS and DRY

Grasp the meaning behind programming principles such as Keep it short and simple (or Keep it simple stupid, if you will) or Don’t repeat yourself.

That is — how to make your development more effective and robust.

Effective means how to simplify and shorten development time by reusing existing code and knowledge.

Robust means prone to error, extensible and easy to collaborate on.

7. Avoid bad plugins like the plague

You don’t want your carefully built software to get infected by bad code. Neither literally (through a plugin’s security issues) nor metaphorically (by other types of issues or overall poor code quality).

How do you determine what is a bad plugin or library? Look at the GitHub or WordPress plugins repository. Check its popularity and rating, last release date, number of issues, the issue’s severity and how quickly they are solved.

Next, you can check the plugin’s code. Even if you are less experienced, you can tell a lot from the author’s coding style. Is it a mess or not? This is also a great way to learn a few things from those smarter than us.

8. Be a proud parent of your code

Surprisingly, many developers who apply for a job with us are not able to provide clean samples of their code. They often refer to their HTML, CSS or JavaScript code samples at live sites.

Presenting your code on live sites is like sending your child to the school for the very first day wearing a paper bag. Your child and your code deserves better.

Extract your best code samples and place them on GitHub for easy access and review.

That all your work is under NDA? That’s a poor excuse and you know it. Time to code your own unique piece.

9. Buy a smartwatch … just kidding, become a smartwatch

Measure your time spent on particular tasks so you learn to estimate how much time similar tasks will take in the future.

This will help you with 2 things — to create estimates for projects and to deliver your work on time.

Compare the project status with the original estimation every day to foresee potential problems. If you are using to-dos or issues, complete them as you go to let others know about your progress.

10. Blame yourself

Does it sometimes seem like the whole world is trying to trick you? You won’t go far with this attitude when working with clients and other developers.

See failures as opportunities to improve — your skills, processes or communication.

Was the failure the client’s fault? Maybe you haven’t done enough to prevent them from failing.

11. improve yOur messges

hey,

i don’t had time to look on isue today but hopefully look on it tmr. cheers

How does this sound and look like? Now, compare it with:

Hey John,

Thanks for reporting that issue! I’m looking into it now, and will inform you about the progress today.

Thanks,

Tom

Writing properly makes you look more professional since a huge amount of our communication nowadays is in written form. In fact, it not only makes you appear as such, you will also become a better professional.

Be proactive and polite, check spelling and grammar, and format it properly. Practice proper writing everywhere — in the emails, issues description, comments — so it becomes second nature.

Good news is that if it becomes a habit, it doesn’t take more time than writing poorly. But it makes a big difference in how your clients (colleagues, future boss, …) perceive you.

Finally, your coding will benefit from your improved writing too. After all, coding is writing.


This article was originally published at the Xfive.co blog. If you are looking for dev buddies who care visit Xfive.co.