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?

Installing RVM on Windows 10

It’s no secret that it’s difficult to work with Ruby on Windows, but installing RVM (Ruby Version Manager) is a way to make it a bit easier.

First, you’ll have to install Cygwin, which basically sprinkles some Linux flavor on Windows.  I recommend following the directions outlined in this blog post, with a few additions:

While checking off which packages to install (there’s a whole list on that blog, I would recommend using the search feature within the Cygwin – but don’t hit enter! that will advance the installation), also install the following packages:

  • sqlite3
  • autoconf
  • automake
  • bison
  • m4
  • cygwin32-readline

Proceed as normal with the installation.  When you get to the kick-off script:


it will make a settings file for you. This is where the blog post kind of stops, so pick up the instructions of the rest of the installation below.

At this point, run the kickoff script again. This will actually initiate the script that will install RVM for you.

Next, exit and reopen the cygwin terminal.

Now, run the final script to finish off the RVM installation:


Once this script finishes running, you should be able to use any and all RVM commands available.  To see them all available, use the command


into the cygwin terminal, or go to https://rvm.io/ for more information.

To see what’s installed, use the command

rvm list known

and the terminal will show what rubies are available. If ruby versions have square brackets around them, they may not be installed, which means you have to tell rvm to install specific versions. Let’s say, for instance, you want to install ruby 1.9.3 on Windows for a code test you have to do.  So to do that enter

rvm install 1.9.3

The installation itself will take a little while, so be patient. After it’s finished, you’re ready to go!

Side Note: If you ever get an error, something like “Requirements installation failed with status: 127.” while you are setting up, it might be that you didn’t install all necessary packages while installing cygwin. To figure out what packages you need to go back and update, simply pay attention to the first few lines of the error. You’ll see a line that says something along the lines of ‘couldn’t find packages’. It’s pretty simple to go back and update the cygwin, by the way. Re-run the setup exe file that you used with the original cygwin install, and go through like you did originally (shouldn’t have to change anything). When you get to the package selection, select the ones you are missing and re-install as normal.  This should resolve the problem.


Action: My 2016 Resolution

Usually, I wait until February to make a New Years resolution. It’s just easier that way. Our sense of what we want or need is skewed by the holidays. After a month of spending and gorging and sloth, who wouldn’t want to save more, eat better, exercise? I give myself a month or so to cool off, collecting the ideas for resolutions I have in my head and abstracting them into a larger theme that I can follow all year. That boils down into just one word. For 2016, that word is “action.”


It seems simple enough – when you want to do something, just do it. But in practice, it proves to be much more difficult.

Action: It means, don’t store it in your head for later, either do it or take the first manageable step in accomplishing the larger goal. Action: Don’t touch things twice. See an email? Got a text? Answer it. Don’t flag it and come back to it.

Action: Put down your phone when it’s not necessary to be on it and be active in conversation.

I’ve sat and thought about actions long enough. Do first, learn second. Mistakes are okay. Be better at recognizing the times where tasks need to be thought out vs acted upon.

Action: Write things down. Ideas and solutions are no good to you or anyone else buried in your head.

Action: Going to the doctor is scary. Making appointments is not. Take things one step at a time.

Action: Move more. Life isn’t a golf, the person who swings the least won’t always win. Take the long way to Chipotle once in a while.

The trash is full. The sink is full. Laundry needs to done. Don’t ruminate about what’s most efficient to do when, do the highest priority first, they all need to happen.

I use this one-word trick to stick to my New Years resolution. When something seems too insurmountable, when you’re too tired, when you think to yourself, “I’ll do it later,” say it out loud: action.

This resolution also applies in regards to code: do something everyday, even if it’s small. Take the initiative to expose yourself to new problems and new solutions. Code is a form of creativity. To push the boundaries of what you can do, you must continually have your perspectives challenged. Artists go to museums, exhibits, where do you go to get inspired?

Earlier thought: “I need to write that blog post about my New Years resolution”

Action: “I am currently done writing a blog post about my New Years resolution.”

What’s your word for 2016?


FizzBuzz is a famous interview test given to incoming developers, to make sure they can at least kindofsortof program.  It asks the candidate to write a program that will print out the numbers 1 – 100 inclusively – except for multiples of 3 print “Fizz”, for multiples of 5 print “Buzz”, and for multiples of both print “FizzBuzz”.


Get it? Fizz and Buzz? Eh.

I was introduced to this via my Skillcrush class for Ruby – so I wrote my first FizzBuzz test in Ruby.

Now that I’m (re-) working my way through vanilla JavaScript, I decided to give it a go in this language as well.  And it only took me about 2 minutes!  Which is great, I think the first one took me 20.

Now, whenever I’m bored or find myself with some idle time, I write a quick FizzBuzz program just to keep it sharp.

Here’s what I got for the FizzBuzz tests in both Javascript and Ruby – I hope someone finds it useful.  Did you solve it differently? Post your answers in the comments below.

Javascript FizzBuzz Solution:

for (i = 1; i<=100; i++){
     if ((i % 3 === 0) && (i % 5 === 0)){
     else if (i % 3 === 0){
     else if (i % 5 === 0){
     else {

Ruby FizzBuzz Solution

(1..100).each do |i|
  	if (i % 15 === 0)
    		puts "FizzBuzz"
  	elsif (i % 3 === 0)
    		puts "Fizz"
  	elsif (i % 5 === 0)
    		puts "Buzz"
   		puts i

See? Not too hard! Keep in mind there are multiple ways to do each one.

Best of luck FizzBuzzing!

Quick Overview of Deploying a Rails App to Heroku

Sometimes you’re working your way through Michael Hartl’s Rails Tutorial and you have just finished chapter 2 when something urgent commands your attention. It continues to command your attention for like a full week and then you decide to get back to it. Chapter 3 hits and Hartl’s telling you to deploy your app to Heroku, with no other explicit instructions except to repeat what you did last time. But it’s been a week, and you have no idea.

You could even say you’ve been derailed.


You’d really like to just get a move on with this, and don’t want to read the whole damn book again. Not that it wasn’t delightful to read the first time. So what are you going to do? Sit around until someone explicitly writes a blog post telling you what to do?

Anyway, I wrote you a nice little guide on how do deploy a rails app to Heroku. Continue reading

Making the Jump

My name is Mary Katherine – and I am making the jump.  Well, making the jump soon.

The goal is to become a software engineer, or a web developer, or a programmer.  Okay, I don’t have the job title down yet but the point is that I want to code.  I want to make things that do something. I want to feel good about the work that I do, and I want to work with others who are passionate about their work.  That’s the goal.  So, how do I get there?

Continue reading