DEV Community

Cover image for Becoming a better frontend developer in 3 steps
Alexandru-Dan Pop
Alexandru-Dan Pop

Posted on • Edited on • Originally published at blog.alexandrudanpop.dev

22 3

Becoming a better frontend developer in 3 steps

Hello developers

While this is not an exhaustive list, I tend to think that following this advice will help you greatly 🚀. So let's see what you can do:

Step 1- Invest a bit in knowing how backends work

Most of the time, you will work in a team and interact with backend engineers. In order to communicate effectively with them, you need to have a common language.

So it helps a lot if you already have at least some basic knowledge of how backends work. Things like setting up a Web API, communicating with databases, versioning, caching, etc.

When new features are developed, I think you should be involved in designing how a new REST API or a GraphQL schema should look like. Take part in deciding the communication model or the DTO between your backend API and the client application you are building.

It's important to have some basic understanding of different styles of architectural patterns like layered architecture, onion, CQRS, microservices.

Step 2 - Invest in fundamentals instead of learning shiny new things

Having a very vibrant frontend ecosystem, it's easy to spend all day long finding out new cools ways of doing various things. The problem is that this will stand in your way of becoming a great engineer.

Learn Javascript, HTML & CSS before you learn React, Vue or Svelte. Learn interacting with HTTP API's before you learn GraphQL. When you pick a web framework stick to it, don't needlessly jump from one to another, become very skilled in one of them.

You can follow this diagram to see where you stand and decide what you should learn next:
Alt Text
Image stolen from here

While this list can look cumbersome, don't get discouraged... Good developers know fundamentals very well and add a few things on top of that.

Step 3 - Learn clean coding principles

This will help you thrive in any project ✔️. Clean coding principles apply to any code you write - so it's not language-specific. Some clean coding techniques:

  • KISS (keep it simple stupid)
  • DRY (don't repeat yourself)
  • YAGNI (You Aren't Gonna Need It)
  • Readability & consistency
  • Favoring Composition over inheritance

And there are some more language-specific ones, like for Javascript favoring:

  • pure functions
  • immutability
  • declarative programming
  • avoiding globals
  • use toolings like type-checkers and linters
  • write automated tests
  • build on the shoulders of giants - use open source libraries or frameworks instead of building or re-inventing things that are already out there

In the end

Let me know what you think in the comments section!

If you like this post follow me on Twitter where I post more cool stuff about React and other awesome technologies. 🔥🔥🔥

Hostinger image

Get n8n VPS hosting 3x cheaper than a cloud solution

Get fast, easy, secure n8n VPS hosting from $4.99/mo at Hostinger. Automate any workflow using a pre-installed n8n application and no-code customization.

Start now

Top comments (0)

The Most Contextual AI Development Assistant

Pieces.app image

Our centralized storage agent works on-device, unifying various developer tools to proactively capture and enrich useful materials, streamline collaboration, and solve complex problems through a contextual understanding of your unique workflow.

👥 Ideal for solo developers, teams, and cross-company projects

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay