The art of solving problems using code, at its core, isn't about the code. A popular quote states that programming is "90% problem solving and 10% writing code".
Though most of us, especially when starting to learn how to code, don't really think of the problem solving aspect of it. I'll admit that for the longest time I too would just jump into a new project, with no pre-planning and the mindset of "we'll figure it out along the way." This, I believe, is born from excitement, the rush of starting something new, it's the fun bit.
I still do this from time to time, either when I'm really excited about a project, or when I'm writing something just to keep my basic knowledge sharp. The latter being the one that needs the pre-planning the most.
But when you take a step back, we are solving problems, no matter what you're making. You are both making the puzzle and solving it.
A concept that I've come to know and understand as a fundamental part of my process is the preplanning. However you may do it, it will make whatever you're doing far easier, whether it be scribbling down a drawing of your website layout before you begin creating the webpage or drawing up a complex flowchart detailing how each component of your app will interact with each other, it will give you some direction and allow you to account for future components that will be added. Now I'm not saying detail your entire solution here, though it's always good to keep a few ideas noted as inspiration.
How I go about this is, I have a notion.so document that contains everything my app will need to do. from here, whenever I create a new file, I will add all the components and functions needed for that file, like so:
// fetch user input from form and store in session
I use these like headers. Taking the examples above, creating a function that will add the user input information into session storage will go beneath that comment. It allows me to separate the code and focus on that one thing, its also handy for finding that piece of code when you need to fix it. You can also pseudocode here for added planning, its something that most of us have learned when we started out but rarely use. Next I determine what are my inputs, outputs and variables, as this lays down what I'll be working with. Then I hop in and start writing.
You're going to be problem solving whether you like it or not, if it's for a client, your job or just for yourself. So give yourself the best advantage: clear direction and a better understanding of where you're going with the code and what it needs to accomplish.
Unfortunately, in the real world, the problems you'll be tasked with solving won't be clearly laid out, so I hope what you've read here helps with the problem you're trying to solve.
Thanks for reading!
If you'd like to read more of my writing, you can check out some of my other articles on dev.to, if you'd like to read more of my ramblings and thoughts or just stay up to date you can follow me on twitter @khasmodan, I also stream myself solving different coding tasks over on twitch - here - every Tuesday and Thursday at 7pm (SAST).