#JavaScript30 - Day 11

Day 11: Custom HTML5 Video Player When I first saw that we were going to build a custom video player with the ability to play, pause, fast forward & rewind in multiple spots plus change the volume and playback rate.... I thought it was going to require writing more code »

#JavaScript30 - Day 10

Day 10: Hold Shift to Check Multiple Checkboxes The shift key is commonly used to group things together between a selection of two items. For example, selecting one email message, pressing the shift key and selecting another email further down the list. This highlights all emails in between. That's the »

#JavaScript30 - Day 9

Day 9: 14 Must Know Dev Tools Tricks Did you know that there is more to the global console object than console.log?! Sorry what? What did I learn? So much. Highlights for me were: console.group & console.groupCollapsed. This is so helpful when I'm looping through data and »

#JavaScript30 - Day 8

Day 8: Fun with HTML5 Canvas This was a super fun challenge! Between the bright colours and learning all things canvas, I was excited to do something creative. What did I learn? Every single part of this tutorial was new to me but I'm including a couple of things that »

#JavaScript30 - Day 7

Day 7: Array Cardio Day 2 This challenge is an extension of Day 4's JS fundamentals. As before, I came up with the solutions before going through the video. What did I learn? I should rephrase this as 'What Am I Noticing?'. I'm getting better at my ES6 syntax! »

#JavaScript30 - Day 6

Day 6: Ajax Type Ahead I love how Wes designed the final product - it looks fantastic! This challenge was to build an autocomplete search bar for US cities & states. What did I learn? That including a dataset with a small challenge opens up the possibilities in playing around »

#JavaScript30 - Day 5

Day 5: Flex Panels Image Gallery Flexbox! Something I don't use enough. I've decided to redo flexbox.io when I've finished this series. I'm only 5 challenges in and my list of things to practice is already super long! I'm ok with this though..... cause I'm all about working hard. »

#JavaScript30 - Day 4

Day 4: Array Cardio Day 1 I tackled the challenges first before watching the video. I wanted to practice my JS array method fundamentals. Also, these type of exercises are good practice as they're usually incorporated in some manner during front end engineering interviews. What did I learn? console.table. »

#JavaScript30 - Day 3

Day 3: Playing with CSS Variables and JS ........CSS Variables? What did I learn? CSS variables exist and use -- for its syntax. I don't know why I didn't know this. I found this blog post which helped provide insight between CSS variables and preprocessors. forEach has recently been added »

#JavaScript30 - Day 2

Day 2: CSS + JS Clock I'm pumped that a clock challenge was part of #JavaScript30. The final product is the seconds, minute and hour hands move to reflect the current time. What did I learn? There's a cubic bezier editor in Chrome dev tools! Who knew?! I didn't. When you »

#JavaScript30 - Day 1

Day 1: JavaScript Drum Kit Considering it was Day 1, I decided to watch the whole video and work alongside Wes. For Day 2, I'll stop the video before he starts working through the solution to give it a go on my own first. I found this exercise fun (who »


I am super excited to be participating in #JavaScript30! I've been looking for something exactly like this. Build 30 things in 30 days with 30 tutorials. I plan on blogging as I go through this to encourage others to participate. Challenging myself and documenting my progress is important to me. »

Sublime HyperClick

I found that within my large projects, it was taking me extra time to find where my import files lived. I wanted to find a better way to go to those files directly! Sublime HyperClick was my answer and has made this process so much easier. Have fun! »

Send Data from a Child to its Parent Component Using Callback Functions

When you get started with React, you'll notice that data flows one way - from parent to child components. I wanted to test out using a two-way data workflow without implementing Flux/Redux. So I built a toggle sidebar to display this behaviour through using callback functions. In the image »

Want to Get Started with React?

If you're thinking about exploring the world of React, I'm excited for you. Whether it's to determine if you want to use it on a regular basis or to build a side project, there's lots of opportunities to dive into this language and understand whether it jives with you. For »

Gulp, SASS, Bourbon, Neat & BrowserSync Boilerplate

I found myself creating this particular dev environment set up multiple times and decided to save myself some time by creating a boilerplate. Here are the list of libraries & frameworks we will be including: npm Gulp Browsersync Gulp Sass Bourbon Neat This post assumes that you have npm and »

Currently Reading

One of the ways I like to step up my coding game is to read on the bus to and from work. Here's what I'm jamming on right now. JavaScript Patterns Description: Explore useful habits for writing high-quality JavaScript code, such as avoiding globals, using single var declarations, and more »

Working With JavaScript Promises

I wanted to learn about Promises. So I created an app to dive into this topic. Hopefully I can help you understand and encourage you to try for yourself! What is a Promise? It's an object that represents a future value. This allows for asynchronous methods to return values like »