try / catch / finally / throw

Javascript error handling can be helpful to help debug code. It’s a great tool to pickup and be consistent with. This may not be the most fun post, but arguably one of the most important to know.

I’m going to walk through 2 separate examples for how to use JS errors.

TRY / CATCH / FINALLY

First, lets talk about the syntax. I like to think of the set up like an if / else if / else statement.

try {

// Block of code to test
} catch(e) {

// Block of code to handle errors
// If there was an error they are put into an object
// In the case above: 'e' is an object that has multiple
// properties we can pull values off and use. …


I spend the majority of my time in OSX Terminal and my Atom text editor. However, when I was recently given the task to put together a webpage hosting a gallery of images I needed a quick way to re-size my folder of multiple hi-res photos. Normally I would have access to an external API that includes URLs of different image sizes. In this case I had to figure out how to automate and convert a large numbers of files all at once.

Photoshop’s actions saved the day. Below is a quick tutorial how to take the editing you do on one image and apply the same edits to an entire folder of images. …


I’ve spent some time trying to figure out some new styling in CSS that isn’t always standard in the ‘book’ or tutorials.

CLEARFIX

Before the fun… An important task I wanted to solve is when we have a parent element whose children extend outside of the its div/box/region. What does this mean? We’re basically forcing an element to self-clear its floating children.

/* Parent CSS Tag */
.parent:after {
content: "";
display: table;
clear: both;
}
<!-- Here we’ll clear any floats in the HTML -->
<div class=“parent">
<div class=“floated-child1"></div>
<div class="floated-child2"></div>
<div class="floated-child3"></div>
</div>

1. OUTLINE!

This had me plagued (for a hot 5 minutes). I was all excited to style my own input borders and be all crafty however every time I focused on the element I’d notice a little blue border around it. The solution is in the outline property. …


The things that made me go “What?!”

When first working with CSS there were a few things that looked a tiny bit intimidating. I wanted to conquer these so I put together a little cheat sheet below that I can reference in the future, I hope it helps you too.

Descendant Selector (space)

ul li p { color: blue;}
  • Separated by a spaces
  • Selects all element of the element type listed.
  • Note: it will select p elements nested even further down the chain than listed., i.e, the grandchildren and great-grandchildren.
  • This example has a train of 3 elements, typically if you have more 4 or more elements it may be better choice to organize your page differently. …


What data structure to use when balancing parenthesis?

Given a string of parenthesis such as ‘{}()[]’ return true or false if every opening parenthesis matches its closing partner. What’s the use of this? Imagine a situation if you were writing a compiler where you would need to check the syntax of a program to make sure all the parenthesis are matched up properly.

At first thought I was thinking to use some sort of recursion to check all the brackets to see if they’re matched up properly. However, there’s a much easier data structure we could use, a stack!

Image for post
Image for post
thank you wikipedia

************************************
CHECK IF PARENTHESIS ARE BALANCED
*************************************
LET’S USE A STACK!!!
OUR RULES

  • return true if null, empty string, balanced parens. …


There’s many frameworks for responsive design. I’ve used two of the most popular, Bootstrap, and Materialize. However, I wanted to see what was working under the hood that allows the breakpoints in responsive design so I wanted to dive into media queries.

Responsive design uses HTML and CSS to to make our web pages look good on all devices. Whether it’s a computer screen, tablet, or a phone.

With responsive design we can try to create an experience that is good for all users, not just one using a particular device.

A few notes to be familiar with before dive into media queries. …


A Simple Markdown Cheat Sheet

I wanted to create a simple Markdown guide for quick access to the main functionality of the language.

John Gruber, who founded Markdown Language in 2004 said, “Markdown is intended to be as easy-to-read and easy-to-write as is feasible.”

The idea John had behind Markdown was readability. It should be as easy as reading an email. Nothing over the top fancy.

For me the best way to approach markdown language is to think of it as something intuitive when you’re marking up the code. In other words, it just feels natural. …


Beginner Asynchronous JavaScript And XML (JSON)

An important aspect of modern web development is being able to asynchronously update a web page with out having to refresh the browser. Imagine having to refresh the browser every time you want to see an update to your Twitter feed. Fortunately, at the top of Twitter page we can view the number of new messages without having to refresh the page. This sort of functionality is the idea behind using AJAX.

I think one of the (multiple) things that killed myspace was the inability to keep the user experience on a single page. For instance, if you wanted to check a new message in your inbox it was necessary to click a button that took the user to a new page. If you wanted to check a bulletin, a page refresh was needed. There was a lot of navigating throughout the site which made the user experience slow and unenjoyable. Along came Facebook where we could stay on one page to check messages, wall posts, and more. This was faster and convenient. …


Chatbots are becoming more and more synonymous with everything we do in our day to day lives and we probably don’t even realize it.

Image for post
Image for post
Source: Shutterstock

Ever spoken to Alexa? Ever called Verizon to try to speak to a human and go down a rabbit hole of pressing numbers or repeating “representative?” Simply opening slack and having the slackbot holler at you is communicating with a chatbot.

Chatbots have come a long way. The first chatbot was created by Joseph Weizenbaum in 1966 and it was called Eliza. Maybe that’s where Amazon’s “Alexa” got the name from?

What we don’t fully see immediately about chatbots that will quickly unravel is how the IoT (internet of things) revolution is already here and the truth is we’ll be talking to bots for our thermostat, sound system, or microwave. You probably already are! The future sneaks up on us quickly so it’s important to stay ahead of the curve so you (or your brand) won’t miss out on a competitive edge. …


As a Jr. developer one of the first times you can easily feel power as a programmer is using event handlers to change the way a web page behaves.

I want to run through a few of the most common events on a web page that can be used based with a user’s interaction.

The 3 handlers I want to discuss to have some fun with are:

  • click
  • mouseover
  • input

Before we get started you can play around with these examples at:

URL: http://www.robhitt.com/blog/event-handlers

Github: https://github.com/robhitt/event-handler-blog

At the top of the HTML file I included a <div> with an ID of #main. This is where we will load every event execution into so we can see the result of our event. …

Rob Hitt

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store