I did it.

too tired to come up with a joke right now.

I completed my first exercise in fcc on 15 December 2015 with the intention of completing the front end development certificate, and ticked it off on 25 June 2018. Probably took a little longer than expected but slow and steady wins the race right?

Honestly I’m not exactly sure what to feel right now, if i had to take a stab at it, my feelings could be described as 50% elation, 50% pride and 50% exhaustion (hey Ive been studying coding for the last 3 years not maths). This has been a journey that has really tried and tested me, there have been multiple times that Ive wanted to walk away, multiple times that Ive yelled hard at my laptop and multiple times that Ive just felt empty.

Its hard doing this course or any course when you work full time, you have commitments that you need to keep on top of, along with coding, I have to find time to practice drums, study Japanese, keep on top of my eBay side business and give my girlfriend enough attention so she doesn’t dump my ungrateful butt. Ive probably stretched myself a little thin from all this but I think im happiest when Im busy and not just sitting around watching some crappy show on netflix.

I found the best way to get through to the end was to set a routine up for myself, each morning I get up at 5.30, stretch, have a cold shower, walk my dog with my partner and then sit down for 40 mins and plug away at whatever problem I am working on at the time. Once you find that routine then it becomes hard to find excuses for yourself to not keep going, it may even feel wrong if you decide to skip a day!

Im not sure whats next, my original hope was for employment but Im not really sure how realistic that is. I might move on to the next certificate and keep pushing for the last 3 certificates, this wasnt my initial intention, but Im halfway up the mountain so Im might as well keep going. I might also try to come up with my own react projects or convert my older projects from the original course into the react format, this seems to be the big thing at the moment so it couldn’t hurt to get even better at it, but for the life of me i cant think of an something to create right now.

Anywayyyy

I did it, im proud of myself and now its time to enjoy that.

Cheers

this doesn’t look right

“who needs google maps? paper maps are making a comeback!” words that would quickly come back to haunt the hipster.

Okayyyyyy, so after taking a couple of months off from free code camp I came back to finish up my course and finally claim my certification after 3 years of toiling away.

But something was amiss, where had all these new lessons and projects come from? Why does free code camp now have 6 certificates instead of 3 and now I have to learn about React, Redux and Sass? huh?

It turns that during my small sabbatical, free code camp had decided pull a blindside on me and release its new curriculum to the public, unfair!

With only one project left to complete I had returned to a new curriculum and even worse, some of the projects that I had spent weeks grinding on had now been moved to interview questions and didnt count to new certificates, madness!

So after crying in the shower for a few hours and having an all around general meltdown I had a bit of a dig around and found that they still awarded a legacy certificate if you managed to finish the fcc old course. So I hunkered down and ground out solutions to the tic tac toe and simon projects.

Both projects were definitely worth my time as it really managed to reinforce previous  lessons learned during my time, the feeling of finally grinding out a solution to tic tac toe after all the worry and stress it put me through was better than sex! (but not really). Plus its two more projects that are quite complex, as far as the curriculum in fcc goes, that I can now add to my portfolio. Plus plus I now have five projects that have been ticked off on the new ffc curriculum section “Take Home Projects”!

Once that was done I also decided that it was definitely in my best interests to plow ahead and go for the new course certificates, I alreadty had 85% of the 3 new courses Responsive Web Design Certification, Javascript Algorithms And Data Structures Certification and Front End Libraries Certification ticked off. The new projects also gave me a chance to try and work on all the skills I had learned from Andrew Mead’s Udemy courses.

It definitely wasnt fun to come back and see a whole bunch of new stuff staring me in the face, especially being that close to completing something that I have worked towards for the last 2-3 years, but it turns out that there was a silver lining in it all along… in the form of more work… wait… oh man!

“When life gives you lemons, just say fuck lemons, and bail.”

Fi Fi Foe Fum, Tic Tac Toe Makes You Feel Mighty Dumb

See the Pen Tic Tac Toe by Luke (@escrew7) on CodePen.0

Well I finally did it, this project was probably the hardest that I have faced so far, getting your head around the challenge and the idea of AI was super stressful and actually made me walk away from freeCodeCamp for quite a while, if anything I would suggest that people tackle Simon before taking this bad boy on (although now with the new update to FCC that isn’t even necessary).

I will say that this is a very basic AI version of the project using a random number generator to calculate the computers next move, I couldn’t seem to get my head around the MinMax algorithm that everyone is talking about on the forum and I really just wanted to get some runs on the board, so if you are up for a challenge, my game isnt it. Hopefully somewhere down the line I can come back to it and make it a little tougher than playing against your 3 year old sister.

I have returned to using jQuery as I find it a little easier than having to write plain javascript which can sometimes get a bit messy and easy to get lost when looking through code previously written.

As for advice regards the project I would say just start from the ground up, make a simple two player version first so you can get your head around the project and from there you can start working on creating an AI to play against. This is a real challenge and its easy to get stressed out but if you work slow and look for advice around the place you can build yourself a decent little program.

All the best.

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!

Luke

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.

Luke

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?

Cheers.

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!

Luke

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

2be

“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