Date Archives April 2017

#100DaysofCode: A look back.


What can be accomplished in 100 days.

About a month ago I posted about my experience with #1ooDaysofCode. You can read about it here.

This week I hit 100 days. Now I can show you what I accomplished.


When I started the challenge I was all over the place. I didn’t really have any direction except I thought I would try to work on freeCodeCamp challenges.

Soon after I started, I found the ‘s #dailycssimages challenge and started working on those to improve my knowledge of CSS. I was quickly hooked.

Most of my 100 days have been spent on expanding my knowledge of CSS. When I initially went to complete the JavaScript challenges on freeCodeCamp I realized I was having all kinds of trouble with the layouts of my pages. Developers often complain about CSS and all it’s faults but I realized I just didn’t have enough of an understanding of how CSS worked.

and now…

I love CSS and all it’s perceived problems. Some might think it was a waste of time to spend most of the 100 days learning CSS but diving into CSS and playing around with all it can do has kept me coming back and wanting to learn more about programming.

I have delved into the world of creative coding and I am having a lot of fun with it. Here are some examples of what I created.

My first CSS image was pretty basic. But I was really proud of it and because I posted it and got feedback I wanted to keep learning more.

See the Pen Daily CSS image day1 Cub by Christina Gorton (@cgorton) on CodePen.28314

At some point I decided to learn CSS animations. I took Val Head’s CSS Animation course on and began applying what I learned there to my images. Here are a few of my more popular animations and some of my personal favorites.

This was my first pen to be featured on CodePen. I was probably a little to excited but it was a great motivator to keep learning more.

See the Pen Daily CSS Image: Doctor Who Adipose by Christina Gorton (@cgorton) on CodePen.28314

See the Pen Daily CSS Images 25: Captain America by Christina Gorton (@cgorton) on CodePen.28314

See the Pen Daily CSS Images 38: Cat vs. Monitor by Christina Gorton (@cgorton) on CodePen.28314

This is currently my most popular pen. I just had the idea running through my head one day and had to code it up.

See the Pen House Points Hourglasses by Christina Gorton (@cgorton) on CodePen.28314

Along with starting to add animations, one of the things I started doing to expand my knowledge of CSS was to look at other peoples’ code and research anything I didn’t understand. This helped me learn gradients, SCSS, Pug, pseudo selectors and elements, and many more aspects of CSS as you can see in these pens.

I was determined to learn @mixins so I coded this pen.

See the Pen #dailycssimages: 33 Awesome-Vue by Christina Gorton (@cgorton) on CodePen.28314

The other project I have been working on to learn more advanced CSS is my Paint with CSS (formally #weeklycsspainting). I am recreating art whenever their is a new part of CSS I want to dive deeper in. I alreadly shared my first painting here and have since remade one more painting.

See the Pen Paint with CSS: Spray by Christina Gorton (@cgorton) on CodePen.28314

I have also used this challenge to learn CSS Grid. I started taking some crochet graphs I use and recreated them with Grid to get a better understanding of what Grid can do. If you haven’t heard about Grid yet or haven’t played around with it, check out this website.

See the Pen Paint with CSS Grid: Luna Lovegood by Christina Gorton (@cgorton) on CodePen.28314

What would I change?

The only thing I would try to do differently if I were to do the 100 days again is commit to GitHub more often. It was the one area I slacked on when doing this challenge. I am now making up for it by spending a few days pushing my code to my repositories.

So again, was #100DaysofCode worth it?

I have developed a way to learn that has been working great for me(creative coding) and I have built the habit of coding everyday. My 100 days are over but I am still spending each day coding. My goals now are to use creative coding to Learn JavaScript and Vue.js. Keep checking in to see how I progress.

As a side note, thank you to everyone who has participated in the challenge and encouraged me along the way. It was a great community to be a part of.