Where Am I?

Mental note: never piss off Tiger’s ex

Ok its been a while… a long while in fact, but blogging is hard!

I also ran into a brick wall with free code camp right at one of the final hurdles with tic tac toe, the idea of programming an AI algorithm really spooked me and caused my anxiety to shoot for the moon.

So I took a little time off the site to take a couple of Udemy courses, Andrew Mead’s Complete React Web Developer Course, Complete NodeJS Developer Course and Stephen Grider’s Javascript ES6: The Compete Developers Guide.

All three were fantastic albeit very extensive (both of Andrew Mead’s courses were around 36 hours of video a piece) and really cheap at AU$13 each, so for a small investment I got to really dig into Node and React whilst getting a quick update on the Javascript update ES6.

ES6 is really interesting and I would either recommend this or Andrew Mead’s new course on JS. You will find some new things on there that can be pretty helpful and some stuff I have aalready started implementing! It can also be really helpful when looking at Codewars as solutions people give on there are generally chokkers with ES6 and might cause confusion if you dont have a decent base of knowledge.

As for when I will actually start using react and node, Im not sure… its definitely something that I need to follow up as it is fast becoming an important tool with developers and as the saying goes “use it or lose it”, I know that if i havent done anything with react in 3 months time, all the work I did will become gobbledegook.

So after about 4 months of slogging through these I came out a little refreshed and ready to take another look at the tic tac toe excersise, which I have finally managed to complete and will blog about soon hopefully.

Thats it for now!


ConfUser Experience

The user manual didn’t inspire confidence

So after spending the larger part of the last 3 weeks putting together the code for my latest fCC project I finally have it performing to a standard that could be classified as “functioning”. But there still remains a problem, it looks like a dog’s breakfast. Picasso would have had more luck understanding the functionality of my project than any normal end user would.

When I first started free Code Camp I would generally by this point be so over the project that I would just tick it off and move on to the next. These days I have come to realise that having a Ferrari engine can be sexy as hell, but if its under the hood of a Toyota Yaris, people probably aren’t going to take much notice.

I want my work to look as good as I feel about it, I know just how much effort went into it and I want people who see that. Simply spending a little bit of time thinking about the design of your project and coming up with some concepts of how you would like it to look can go a long way.

Usually I use Adobe Illustrator to create these concepts (as can be seen below), but there are a heap of decent free programs out there that can be used just as easily, baring that, a pencil and a piece of paper is your best friend. I usually try and create different ideas for desktop, tablet and mobile and then try and implement them using basic media queries.

When you spend so much time and effort on building and creating a project on free Code Camp, its worth spending just a little bit more on making it look as good as it performs.


Blogging Purgatory

this episode got a bit too real when Charlie Brown had to drink his own piss to survive.

So yeah it turns out that in the process of juggling a full time job, studying web development and giving my gf enough attention so she doesn’t leave my ungrateful ass, finding that spare 5 minutes to blog about my progress can be surprisingly hard!

Im thinking about maybe changing the format of this blog to give more micro updates, not in the twitter size, but maybe more talk about experiences and such rather than talking about actual javascript or web design elements. Ive just finished building the fcc pomodoro project so ill chuck that up soon with a few comments about what i was trying to do.

“Even if you fall on your face, you’re still moving forward”. – Victor Kiam

So guess Im killing it?


Object.defineProperty() – There’s More Than One Way to Skin a Cat

private property sign

definition: sketchy

I thought Id try and do something different for this blog and post some code that runs through how a specific piece of JavaScript Works

The Object.defineProperty() is a method that can create or modify a property of an object with a couple of special caveats added. Using this method you have the ability to make the property and the method read-only (writable and configurable) or invisible (enumearble).  For a more in depth explanation the Mozilla page can be found here and another very helpful blog on the method can be found here.

But this page is the copy of a JSFiddle post that I have been playing around with in an attempt to strengthen my understanding of it, you should give it a shot too. The link to the actually JSFiddle page can be found here.


Slow and Steady Wins the Race to Learn JavaScript

the new trailer for Fast and Furious 8 was surprisingly underwhelming

Like any good skill set, if you want to be successful at web development and JavaScript, you need to put in the time.

Along with learning JavaScript, for the past 3 years I’ve also been studying Japanese (the Human Japanese App is a great way to learn if you’re interested). Nearly every day I sit down for at least 30 minutes and go through the Japanese language with flash cards in order to reinforce my knowledge of the subject.

With my JavaScript studies this wasn’t the case though, instead of putting in the time, all I had been doing was running though the exercises as fast as I could in order to get to the next. I never really revised and only times I ever bothered looking back was when I needed to re-learn how a function performed… because I had already forgotten it. This was a problem, my understandings of the concepts of the JavaScript language were weak at best and my confidence in my abilities nosedived.

I recently started trying to introducing some of the study techniques (along with a couple of new ones) I utilise whilst studying Japanese, into my JavaScript studies, the results have been very encouraging and I have included them below:

  • Write what you are learning down in a text book, make sure to put it in your own words so you aren’t just copying and pasting
  • When coding, write down in the window what the code is about to perform and why (see below)
coding explanations

adding explanations to your coding helps reinforce what you have learned and also helps you if you need to come back to the code later


  • Make sure you 100% understand what you are attempting to learn before moving forward, if you don’t, go back and keep at it until you do
  • Spend 5 minutes at the end going over what you have learned, try and summarise
  • Spend the first 10 minutes of the new study period going through what you went through the last
  • If you have trouble remembering something specific, make up some flashcards and test yourself in your spare time
  • Break up your study periods into blocks, the Pomodoro Technique can be great for this
  • Remove distractions, this is a killer for me, out of an hour of study I can lose nearly 60% of that time just wondering what people are tweeting about or what delicious foods my girlfriend is instagramming atm, you will be much more effective if your phone is off and you are focused on the task at hand.
  • Take it slow, take it slow, take it slow, this isn’t a race, the more time you take to reinforce your understanding, the stronger you will be

So after recognising my mistake (and after I had stopped crying) I decided to go back to the start, but I didn’t go back to free code camp, I picked up the book Eloquent JavaScript by Marijn Haverbeke.

Now the book Eloquent JavaScript, in my small amount of experience, is about as intimidating as JavaScript books get; by about the third or fourth chapter the dial is turned up to 11 and you are thrown into the deep end without any floaties. This book can be so scary that there is a significant chance you may just end up throwing the thing in the fire and calling the whole thing off (something that can be especially expensive if you’re reading it from a kindle).

But please, please, please trust me, this book is fantastic and I couldn’t recommend it more, there are mountains of information to gain here, if you feel overwhelmed, just trust the process and take it slow, if you fail to understand something read it again and write it out, and if you still don’t understand by then, then go and jump on stack overflow, google the problem or even send me an email, there are heaps of resources out there to help. This book takes you on a very smart path to learning JS and I’ve really enjoyed slogging through it. Also as a bonus the book is available free in electronic format from his website so you don’t have to spend a dime (or ten cents if you live in Australia like me).

Good luck and keep moving (slowly) forward!


toFixed or not toFixed, that is the question.. to rounding a number in Javascript


“I could put a cactus on the top of this and sell it to hipsters”

freeCodeCamp has made me ask a grand number of questions about javascript and one of the more recent ones was “so how the %^@$ do I reduce the number of
^#$%ing decimal places in a this $@#$ing number?!?!” (this question came about just after realising that js thinks that 0.1 + 0.2 equals 0.3000000000000004.)

And as we are talking about Javascript, one question can only ever lead to another, this time being “so do you want a string or a number in response?”

“I want a string response!” (the toFixed() method)

Ok then, this is probably the easiest way of reducing a number to a fixed number of decimal places. You simply add the toFixed() method to your variable with the desired amount of decimal places as the parameter and bob is your uncle.

  • //create a variable ‘x’ with 3 decimal places
  • var x = 3.146;
  • //create a new variable ‘y’ with the toFixed() method with 2 as a parameter to reduce the number to 2 decimal places
  • var y = x.toFixed(2);
  • //call the y variable
  • console.log(y);
  • ‘3.15’

“I want a number response!” (the Math.round function)

Then let’s get to it, this is a simple and easy way of rounding a number with decimals to the nearest whole number. You just need to call the Math.round() function with your desired number/variable as the parameter.

  • //create a variable ‘x’ with 3 decimal places
  • var x = 3.146;
  • //create a new variable ‘y’ with the Math.round() function and the variable ’x’ as the parameter
  • var y = Math.round(x);
  • //call the y variable
  • console.log(y);
  • 3

“But I need to create a number with 2 decimal places” I hear myself saying time and time again whilst chewing my entire fingernail off. Fear not! There is back way to countering Math.round’s rather depraved need to cut the number’s entire tail off, and it involves just a simple bit of math.

  • //create a variable ‘x’ with 3 decimal places
  • var x = 3.146;
  • //create a new variable ‘y’ with the Math.round() function and the variable ’x’  times 100  then divided by 100 as the parameter, shifting the decimal place back a couple of spots.
  • var y = Math.round(x * 100) / 100;
  • //call the y variable
  • console.log(y);
  • 3.15

So there you have it, a couple of ways to round a number down and a great way to solve the Javascript issue with binary and floating point numbers. If there are any errors in this post, apologies, I’m still learning and I find that writing about this stuff as I go helps reinforce it. Any questions about the subject are more than welcome but will most likely be reposted as a question on the StackOverflow website by yours truly.


Extra Time!

If you want to use the toFixed method and still have the result as a number, then just convert it via the parseInt() function post toFixed() conversion as seen below.

  • //create a variable ‘x’ with 3 decimal places
  • var x = 3.146;
  • //create a new variable ‘y’ with the toFixed() method with 2 as a parameter to reduce the number to 2 decimal places
  • var y = x.toFixed(2);
  • //query the type of y variable
  • console.log(typeof y);
  • string
  • //create a new variable ‘z’ with the parseInt() function and the variable ’z’ as the parameter
  • y = parseInt(y);
  • //query the type of z variable
  • console.log(typeof y);
  • number

JavaScript and Decimal Places, A Shortcut to Insanity

Uhhhh, who invited Gottfried to the Party?

Uhhhh, who invited Gottfried to the Party?


So after spending a couple of days trying to work through the freeCodeCamp algorithm script Exact Change I came across a rather unexpected issue.

In JavaScript (0.1 + 0.2 === 0.3) is false.

After running around in circles crying foul and threatening my laptop with a number of things that would break the Geneva Convention I had a look around the internet to see if anyone else had experienced the same problem.

It turns out that my anger was misdirected at my laptop (apologies); in fact it should have been aimed at a young man by the name of Gottfried Lebiniz, the inventor of binary.

The problem is that computers speak in the language called binary (a sequence of Zeros and Ones) meaning that numbers have to be stored in a format called “binary floating point”. This format is designed in such a way that it is unable to actually represent the true value of some decimal places.

In JavaScript 0.1 + 0.2 actually equals 0.3000000000000004.

Confused? Yeah me too, until I chanced across this video, it’s about 30 mins long but if you can get through it, you’ll no longer be preparing to hang your computer’s toes over some burning coals, but quickly googling good old Gottfried in order to put a curse upon him (he died in 1716 just fyi, I guess someone else got to him first). Also you might just learn a thing or two about how binary floating point works.



If you’d like some more information on the floating point format I’d recommend the website http://floating-point-gui.de.

As for the freeCodeCamp’s Exact Change … move over Ben Affleck, Math.round() has just become my new best friend.


I Built This!


See the Pen Free Code Camp Weather App by Luke (@escrew7) on CodePen.

This is my version of the Free Code Camp Weather App written up on Codepen. I’m pretty happy with how it has turned out. A couple of things I am particularly stoked about are the toggle on the degrees <div> where you can click to change from Farenheight to Celsius; and the minimal design of the app, which I think is suited to its purpose.

Free Code Camp along with Khan Academy have, to me, been two of the better free web development learning platforms. Both boast strong challenges along with great support networks for when you run into coding problems. Free Code Camp has really pushed me to my limits with JavaScript and on more than one occasion I’ve stormed off complaining about how the site is cheating me, only to realise that I’ve spelt “function” wrong.

One feature I’ve really enjoyed about Free Code Camp is that you can enter into a “contract” with the Camp, where each month you donate a sum of money to a choice of charities until you finish your selected certificate. It’s really rewarding knowing that you are achieving your goals of learning code whilst also giving others less fortunate a leg up in achieving their own dreams. I decided to donate monthly to the http://www.blackgirlscode.com/ school and have been 9 months.

freeCodeCamp is no walk in the park by any means, but if you really push yourself, the rewards that come from completing algorithms and projects is legit.


Give it a shot.