How to level up your frontend skills

In 2017, I was struggling to build any frontend project.

I'd follow tutorials feeling confident, only to hit a wall when trying to build something independently.

Fast forward to today: I'm a Senior Frontend Engineer at Palantir.

In this post, I share the 7 best tips for junior frontend developers who want to level up.

Tip 1: Build strong fundamentals

You'll never become a senior frontend developer without a solid understanding of HTML, CSS, and JavaScript.

Every frontend technology builds on these basics.

Without them, it's harder to:

• Understand the problems that frameworks and libraries solve

• Debug your code effectively

Building these fundamentals isn't as hard as it sounds. Here are some resources to get started:

• MDN Curriculum: Strong foundation in web basics

• FrontendMasters Free Bootcamp: Great starting point with hands-on practice

• JavaScript Info: Essential to build strong JavaScript skills required for learning libraries like React

Tip 2: Practice extensively

You can watch all the tutorials and buy all the programming books in the world, but you won't build mastery until you start practicing with real projects.

Building projects has several benefits:

• You remember things better after working through struggles

• You test your skills in real-world scenarios

• You start seeing common patterns and solutions

• You confirm your understanding by actually solving problems

I recommend these resources for practice:

• Frontend Mentor: Project practice at all levels

• Frontend Practice: Recreate real websites from real companies

• Frontend Projects: Project practice at all levels

• JavaScript Mastery: YouTube channel to master web development with a project-based approach

Tip 3: Get code reviews

It's easy to write code that "works".

But, writing maintainable code is the real challenge.

So try to get code reviews as soon as possible (i.e., have someone look at your code and point out mistakes).

Here's how to get code reviews depending on your situation:

• Situation 1: You have teammates

  Keep your code concise, then ask for a review. Avoid massive pull requests, which can overwhelm reviewers.

• Situation 2: You don’t have teammates

  Reviewing your own code can be surprisingly effective. Leave it for a few weeks, then return to it with fresh eyes.

• Situation 3: You're unemployed

  Ask for feedback on Reddit or similar communities, or feel free to contact me for a free review.

💡 Reply to this email for a free code review.

Tip 4: Read and review other people's code

Reviewing others' code has been one of the best ways I've improved.

When you review someone else's code, you:

• Learn new tricks and tips

• Realize how some patterns can be complex to read

• Develop empathy towards those reading your code

Is it weird to give code reviews as a junior dev?

Not at all!

Even as a beginner, you can ask yourself, "Is this code clear?" If not, the author might need to add comments or simplify.

How to find code to review:

• Situation 1: You are employed

  Review code when possible. If formal reviews aren't part of your team, look at the code anyway and make mental notes.

• Situation 2: You are unemployed

  Reddit and GitHub are great places to find code to review.

💡 Check out these examples of large, production-grade React apps.

Tip 5: Learn about best practices

Never stop learning.

Understanding best practices helps you write code that is easier to maintain and scale.

Here are my top recommendations:

• Websites:

  • CSS: Josh Comeau (CSS & React), Ahmad Shadeed (CSS), Kevin Powell (CSS)
  • React: Epic React
  • TypeScript: Total TypeScript
  • Design Patterns: Refactoring Guru, Patterns.dev

• Books:

  • Programming: The Pragmatic Programmer, Clean Code (check the JS version here → Clean Code JavaScript)
  • React: Advanced React
  • TypeScript: Effective TypeScript, Programming TypeScript

Tip 6: Master 1-2 tools before diversifying

Don't bounce from React one week to Vue the next and then Node.js after that.

This path leads to failure and a lack of mastery.

Without deep knowledge, you're at risk of being replaced by AI tools.

Here's what I recommend:

1. Choose a focus (Frontend or Backend)

2. Pick one framework (React, Vue, Svelte, etc.)

3. Stick with it until you can confidently build projects

Only then, start exploring other tools.

Tip 7: Mentor junior devs

Mentoring junior devs can take your skills to the next level.

In fact, mentorship helped me:

• Solidify my understanding by explaining it

• Build confidence as I realized I knew more than I thought

How to find junior frontend devs to mentor

Look for someone who's where you were six months ago and help them out.

Reddit communities like r/FreeCodeCamp, r/learnjavascript, and r/learnreact are great places to start.

Summary

Becoming an excellent frontend dev doesn't require innate talent or decades of practice.

All you need to do is:

1. Build strong fundamentals

2. Practice what you learn

3. Get code reviews whenever you can

4. Read and review other people's code

5. Continuously learn best practices

6. Master 1-2 technologies first, then diversify

7. Mentor those more junior than you

That's it.

And if you need any advice, DM me on X.

💡 My tip of the week

🐞 Spot the issue in this code

That's a wrap 🎉.

Leave a comment 📩 to share your favourite tip (or add one).

And don't forget to drop a "💖🦄🔥".

If you're learning React, download my 101 React Tips & Tricks book for FREE.

If you like articles like this, join my FREE newsletter, FrontendJoy.

If you want daily tips, find me on X/Twitter.

Comments

[Muskan Dodmani]

Your blogs are really helpful
I've been waiting to apply these tips from your blog
Tips from senior frontend dev
but I haven't got a job yet, lol

Please drop your email, I've been wanting someone to do a code review from a long time but didn't find anyone.

[Ndeye Fatou Diop]

I'm super glad you like it, Muskan!
Can you join here => frontendjoy.com/p/how-to-level-up-... and reply to the welcome email.
I don't want to share email in public 😅 to avoid spams

[Muskan Dodmani]

Sure, I get it!

[sebkolind]

Great read!

Also, if you don’t have anyone to review your code, you could always use one of the many AI options. 🙌🏻

[Ndeye Fatou Diop]

Oh nice suggestion 🙌
I didn’t think about that (too old school 😅)

[Trideep Barik]

AI options like?

[sebkolind]

Github Copilot just released some reviewing functionality, which looks really promising! Also, CodiumAI is a thing, but I haven't tried it.

[Ryan VerWey]

Awesome read! Going to dig deeper into those sites you mentioned.

[Ndeye Fatou Diop]

Super glad you like it Ryan 🙌

[kelsey-d]

What is the issue with the css?

[Ndeye Fatou Diop]

If we assume this is the only style applied to the a, this won’t work since width and height don’t have an effect on inline elements.
The way to fix is to use something like display: inline-block;

[kelsey-d]

Oh right believe it or not I just read about this here: stackoverflow.com/questions/154249... and already forgot 😅

[Ndeye Fatou Diop]

😅😅😅

[kontactmaneesh]

Nice

[Ndeye Fatou Diop]

Thanks 🙏

[Fazly Fathhy]

Thankyou for sharing this

[Ndeye Fatou Diop]

Happy to help Fazly 🙌

[Anatoly]

All that tips are applied not to frontend only, but to everything else :)

[Ndeye Fatou Diop]

Ahah true 😅

[Viktorija Nađ]

Read a book and be in trend

1. "HTML & CSS: Design and Build Web Sites" - Jon Duckett
2. "Eloquent JavaScript: A Modern Introduction to Programming" - Marijn Haverbeke
3. "Learning React: A Hands-On Guide to Building Web Applications" - Alex Banks i Eve Porcello
4. "You Don't Know JS" serija - Kyle Simpson
5. "JavaScript: The Good Parts" - Douglas Crockford
6. "CSS: The Definitive Guide" - Eric Meyer, Estelle Weyl, and Shane Spaulding
7. "The Road to React" - Robin Wieruch
8. "Designing with Web Standards" - Jeffrey Zeldman
9. "Front-End Web Development: The Missing Manual" - David Sawyer McFarland
10. "JavaScript Design Patterns" - Addy Osmani