Playing Sounds with the HTMLAudioElement

While working on my Pomodoro Timer and testing out the Notifications API, I decided I wanted to add in some sounds. I figured that notifications might not always be ideal when using a timer and that sometimes a good old fashioned timer can be a much better tool. I discovered information on the HTMLAudioElement and…

Exploring the Notifications API

I was recently working on a Pomodoro Timer and decided it would be a great time to look into browser notifications. I discovered the Notifications API and started to play around with how to incorporate it into my timer. The first step is to request permission from the user to allow notifications. A callback function…

Preventing Early Escape

Recently, I was working on a Wikipedia Viewer for Free Code Camp that allows you to search for articles and links you to the top five results. After playing around with my finished product, I noticed that sometimes the link wasn’t taking me to the correct result. For instance, the search result “It’s Not Right…

Create an Inline Form with Bootstrap

Recently, I started working on a project and was in need of an inline form. I wanted a simple search box and a search submit button. I checked out what Bootstrap had to offer and tweaked to simplify. I created a container to hold my form and centered that within the page. Then I added…

Geolocation and the Open Weather API

Recently, I was working on a Free Code Camp¬†project where I created a page to show the current weather in your location. I knew that in order to pull weather data for the user’s area, I needed to locate them first. When I tried to get geolocation information from the user, it initially failed. I…

Vertical Centering with Flexbox

Recently, I started to struggle with vertical centering while working on my Random Quote Machine. I had no problems getting it to center horizontally, but couldn’t for the life of me get it to center vertically. I was using a Bootstrap container to hold my content and my CSS looked a little something like this.…

Playing With APIs

A few weeks ago, I completed my first project where I used data from an API. I created a Random Quote Machine that shows a quote on button click, and gives you the option to post it to Twitter. When I started, it only took a quick search to find a free API from Quotes…

Building a Portfolio Page

I recently worked on a portfolio page to showcase some of my past projects. I decided to style it similar to my blog so that I had the option to add it in at a later date. I had no major issues during this project so I focused on learning new things. It was my…

A Tribute Using Bootstrap

About a month ago I started Free Code Camp’s full stack development program. Since then, I’ve been learning front end development through lots of hands-on projects. The first project I worked on taught me how to use Bootstrap to create a tribute page. Before this, I dealt with the struggle of alignment and centering using…

Leaving the Nest

After playing around on Codewars and taking a few Codecademy classes, I decided it was time to work on my first real project. I wanted to learn how HTML, CSS, and Javascript all worked together to make a site. I decided to create a simple two player tic-tac-toe game with a scoreboard and the option…