Problem Solving
We are now just over 4 weeks into Dev Academy, Wellington and it is becoming increasingly obvious that the secret to web development is being able to effectively solve problems.
At the moment I get stuck on coding problems on a daily, if not hourly basis. When it happens it can be quite frustrating, but once you find a solution, the sense of satisfaction is well worth it.
An important concept to understand as early as possible when learning web dev, is there are multiple solutions to any one problem. Always do your best with the skillset you have at the time and although it may be a bit 'hack-ey' at first, it will get better over time.
When you do get stuck, it is ok to look at other code in search of a solution; this is not cheating and any research you do will help you solve problems faster in the future. For example, a couple of weeks ago we had a responsive web design task and although my site responded well when adjusting the browser on my desktop, on my mobile everything was far too small. I had a vague idea what could be causing this, so I did some research and discovered that the line of code which works to recognise mobile devices had an error in it. After correcting this mistake, it still it didn't work...what the heck??? I was confused. So I found some of my fellow cohortee's blog pages and emailed the links to myself and then opened their sites on my mobile browser. I then found one that worked well and compared the responsive elements of their site with mine and learned that I had positioned the responsive code in the wrong place. After repositioning this very important piece of code, lo and behold, I finally had an actual responsive website.
There are a number of different techniques web developers can use to help solve problems, some of which are listed below.
| Method | Description | My Comfort Level |
|---|---|---|
| Pseudocode | Breaking a coding problem down into steps using plain old English. | 8/10 |
| Trying Something | Make an educated guess and see what happens. | 7/10 |
| Rubber Ducky Method | Debugging code by explaining it, line-by-line, to a hypothetical rubber duck. | 8/10 |
| Reading Error Messages | Trying to understand the un-understandable. | 4/10 |
| Console.logging | Using developer tools to pinpoint the problem. | 5/10 |
| Googling | Everyone knows what Googling is! I am a master Googlerer! | 10/10 |
| Asking peers for help | I am a big fan of working with people smarter than me; #BestWayToLearn. | 10/10 |
| Asking coaches for help | Asking coaches is even better than asking peers for help! | 11/10 |
| Improving your process with reflection | After solving the problem, review how you well you solved it and what you could do better next time. | 7/10 |
Finally I would like to finish by explaining a few JavaScript functionalities to you in as basic a way as I can. This is good practice for learning to work well in teams and explain concepts to fellow cohortees.
- .map() - Builds a new list when a list is processed using a function. E.g. if you took a list with the numbers 1-10 and put them through a x2 function, .map() would record the results on a new list (2, 4, 6, 8 - 20)
- .filter() - Builds a new list when a list is processed using a filter. E.g. Take the same list, 1-10, and process it using a 'find even numbers' filter. .filter() would record the results on a new list (2, 4, 6, 8, 10)
- .reduce() - Uses an accumulator function to add all the values in a list together and return the total sum. E.g. Same list again, 1-10, put through a reduce() function will return the value 55.
That's just a little taster of the diversity and extensiveness of JavaScript functionalities. Be sure to keep checking in to find out how much more advanced the learning gets.
Thanks as always,
