In this episode of Syntax, Scott and Wes talk about how to get better at problem solving — one of the most important skills to build as a developer.
Netlify - Sponsor
Netlify is the best way to deploy and host a front-end website. All the features developers need right out of the box: Global CDN, Continuous Deployment, one click HTTPS and more. Hit up netlify.com/syntax for more info.
Prismic - Sponsor
Prismic is a Headless CMS for your next front end project. Create complex content type, relate data, and have your clients edit it all with the Prismic UI. Then pull the data into your project with their JSON or GraphQL API. Try it out with your next project - Gatsby, React + Apollo, or any other language. Check out their examples to get you started at Prismic.io/syntax.
The most experienced people in any field know how to ask the right questions.
Some of this will come with experience and nothing else. If you’ve seen a problem before, it’s easier to solve.
10:00 - Look at the end game
What are you really trying to do here? Don’t focus so much on the tech that you miss the bigger picture.
13:17 - Read Again
Error logs provide the best clues. Read them closely.
Actually read your code — don’t skim it.
Write comments while reading it, or follow existing comments — good for documenting, but also for structuring your thoughts.
18:08 - Make it simple (break it into smaller parts)
Limit the number of inputs and outputs
Get it working in a limited capacity (e.g. safe mode, Codepen, etc.)
Comment out major sections of code until you have a working example
Does this problem exist outside of the framework?
Does this work in a clean environment?
25:35 - Take yourself out of your environment
You should be able to take a look at the problem at all zoom levels
Does it work locally but not on the server?
Does it work in other browsers?
27:32 - Stay calm
It’s easy to get nervous or worked up when the stakes are high
It won’t serve you to panic. If you are panicking, take a 10 min walk to deep breath
Take a shower, lift weights (seriously)
30:14 - Talk it over
Getting the perspective of another developer can be invaluable
32:28 - Make things obvious
Use debugger or label logs — don’t let it be ambiguous
For CSS bugs, use primary colors to make things stand out
Use the right tool to make the problem stand out
Layers for CSS issues
Network for network issues
Performance tab (etc.)
35:12 - Use Git correctly to free up your techniques
If you’re code commits are up to date, you can heavily modify code without fear of deleting things — just revert to a previous commit once you find the issue and fix.
36:10 - Don’t jump at solutions
Take the time to fully dissect the problem
Question you assumptions
It can’t possibly be a problem with ____. Well maybe it is.
Wes once spent hours trying to diagnose a check engine light when the gas cap was lose.
Podden och tillhörande omslagsbild på den här sidan tillhör
Wes Bos & Scott Tolinski - Full Stack JavaScript Web Developers. Innehållet i podden är skapat av Wes Bos & Scott Tolinski - Full Stack JavaScript Web Developers och inte av,
eller tillsammans med, Poddtoppen.