16

How to get better at problem solving as a Frontend Developer?

Profile picture
Software Engineer Apprentice at Series B Startup2 years ago

I'm a React developer and for the most part am able to accomplish tickets assigned to me; however, what I struggle with is when I have a particular ticket that is heavily logic focused.

For example, recently I had to implement a multi date picker for a booking engine and between the many different cases for user interactions and date comparisons, I feel it took me way longer than it should have.

In order to optimize improvement in this area, would it be worth it to grind leet code style questions? or maybe codewars?

1.4K
1

Discussion

(1 comment)
  • 18
    Profile picture
    Tech Lead @ Robinhood, Meta, Course Hero
    2 years ago

    This is a really interesting question, and what I will say is that this is a natural part of software engineering growth. I went through a similar experience on Android - Basic rendering is easy, but things get tricky when there's a lot of different user flows and edge cases. I hope you're able to look back and feel proud of yourself once you're able to get these types of features able to work šŸ˜Š

    That being said, here are my tips to improve here:

    • I really don't think LeetCode helps - Those problems are too isolated and not connected to actual products, especially on front-end where there's pixels on screen. Remember: Data structures and algorithms (DSA) are NOT real software engineering. Optimistically grinding DSA is one of the easiest ways to waste time as a software engineer.
    • Take some time to think through the problem before coding - Tactically, you can write some pseudo-code after you figure out the overall logic flow. The common failure mode I see with more junior engineers is they'll jump straight into coding, write a bunch of code, hit a wall, and get frustrated trying to morph their broken code into something that works.
      • If you have a mentor or just a good relationship with a more senior engineer, you can run it by them and get feedback. Ask them if there's any edge cases your proposed logic doesn't account for.
    • Leverage code review - As an apprentice, don't hold yourself to the bar of nailing it perfectly on the first try with a solution that covers all cases and is elegantly written - If you can get something primitive working, even if it takes a ton of if statements or something, just get it out there in a pull request and ask for feedback on how the approach can be improved.
    • Be the user that pushes products to their limits - This is the cool thing about working on front-end: It's very visual, and you can play around with things yourself, which is much harder to do if you work on back-end or ML infra or something. What I mean by "pushing to the limit" is to deliberately hit error and edge cases. Observe how websites and apps react when you do this, and you can learn from them. By having this frame of mind, it also helps you see these cases proactively when you take up any task. Here's some examples:
      • Put in an invalid email when logging into a website
      • On a content app like Pinterest, create a collection of items that's extremely large (100+ items)
      • Click every button you can possibly find, especially those that are a bit hidden

    Lastly, this isn't completely related to the question, but I recommend reading this Q&A on how to write great code faster as well: "How can I write great code faster?"