CSS & HTML Holiday Trees


Happy Holidays and Happy New Year everybody! I made this tutorial originally for the CodeNewbie DC December meet up, but was unfortunately too sick with a cold to give the tutorial live. Since I had some extra time over the holidays, I decided to spruce (no pun intended) up this holiday tree tutorial and post it to my blog for everyone to enjoy!

In this tutorial, you’ll learn how to make a holiday tree using shapes made only of HTML and CSS. We’ll be using CodePen to create the trees. You can stop there if you’d like to just keep it for yourself, or, if you’d like, you can pull down my repository from GitHub and add your tree to the forest.

For more of an incentive, I’ll be purchasing carbon offsets through the Nature Conservancy for every 3 trees planted on my site. Plant a virtual tree, plant a real tree!

This tutorial is based on a CSS Christmas Tree tutorial from CSS Viking. You can find the original here!

Continue reading

Tutorial: Build a Rails app using the NASA Astronomy Photo of the Day API

Learn APIs for Rails

Do you want to make a really cool app? With a really cool space API? OF COURSE YOU DO, IT’S SPACE!

Great! You’re right where you need to be.


Our really cool SPACE APP


The idea for this app was conceived as a learning exercise for myself by mentor Barrett Clark, and I turned it into a live tutorial/demo for the Women Who Code DC’s Ruby on Rails group. The goal of this tutorial is to de-mystify APIs for Rails developers. I hope it accomplishes that for you! A live version of this app can be found here. Continue reading

How To Get the Most Out of Instructional Videos

This weekend was Code School’s Free Weekend, and I tried to take as full advantage of it. The courses are pretty dense, making getting through one of them in a weekend quite a bit of a challenge – especially if you have other responsibilities outside of learning to code (which most of us do!). I’ve struggled with videos in the past – often, they move too quickly, make a lot of assumptions about the viewer knowing jargon and concepts –  but I think I’m starting to get the hang of it. I’ve developed a great algorithm, if you will, for getting the most out of tutorial videos:

  1. Watch the entire video the whole way through, do not pause or write notes.
  2. Watch the video the entire way through, writing down vocab words or jargon that you do not understand.
  3. Look up and write down the meaning of these jargon words in a few lines if possible.
  4. Watch the video through again, this time pausing the video to take notes or write down new concepts. Additionally, write down questions that you have and underline them. Underline concepts that need additional clarifications.
  5. Look up your underlined questions and concepts and write them down.
  6. Watch the video the whole way through again.

This works best with videos under 10 minutes that pack a lot of knowledge into a very short space, such as Code School’s videos. Some steps can be consolidated for longer videos, or if the video has a speed-up function, you can view at 1.5x or 2x speed on the last run.

This varies from person to person, but I retain more when physically writing something down. It my seem archaic to be writing notes about code into a paper notebook, but something about the act of writing helps me to remember the notes better. I’ve also found that writing out the sample code (yes, writing code on paper) also helps me to internalize and demystify what that bit of code is doing. Writing forces you to think about each piece of the puzzle a bit more because it gives you more time with each piece.

How do you learn best?