See the Pen Dropbox inspired .card with some CSS animations by Martin Wolf (@martinwolf) on CodePen.

I use a whole lot of different service. Some are free, some require a one time only payment and some have subscription models. Today I want to talk about the latter. So let’s see which services I use and what they do.

CodePen Pro (codepen.io)

CodePen is a code playground. You can show off your skills or just try something very quickly. You get three textareas, one for HTML, one for CSS and another one for Javascript. And you always see the results updating live in a fourth box. I often use it to isolate problems I have while developing whole sites. This helps me getting to the underlying problem and thus solving it. But it’s also great to present something you did or just get inspired and see what others are doing. I just love it and use it almost every day.

GitHub (github.com)

I probably don’t have to say much about GitHub. You can host your git repositories there, privately which I happily pay for, or just use the free plan and open source your code and work together with others. We all love GitHub, right?

Spotify (spotify.com)

A few bucks a month and I get access to – what feels like – all the music the world has to offer. Couldn’t imagine living without Spotify – or Rdio, which is basically the same. Other than that I often go to Soundcloud to listen to music.

IRCCloud (irccloud.com)

After not using IRC for a few years, I’m back and it’s better than ever. IRCCloud makes sure I’m always online and thus I don’t miss anything in my favourite channels. I use the IRCCloud website as a fluid app on the Mac, which works really great and there is also an iOS app if I’m on the go.

Feedbin (feedbin.com)

Many claim that RSS is dead. And while I’m definitely don’t use it as much as I used to, I still like it and after the Shutdown of Google Read, Feedbin is my new home. A lot of apps are able to sync with it, but I mainly use the website which has a nice, clean interface and is blazing fast.

Typekit (typekit.com)

Currently I use Typekit for serving webfonts to this blog. There are good alternatives out there but Typekit was the first I took notice of and I stuck with it. But I have to say that I often look at the fast growing Google webfonts library and also love the fonts by H&FJ. So while I’m content at the moment, I might switch some day.

Which services do you use and are happily paying for?

In diesem Screencast geht es um animation-fill-mode: forwards; Was ist es? Was kann es? Wieso ist es cool?

Euch hat das Video gefallen und ihr wollt mehr sehen? Dann nicht vergessen das Video zu liken. Schreibt auch gerne einen Kommentar mit Themenwünschen, Fragen, Ideen, und so weiter.

Und nicht vergessen den YouTube Channel für mehr Screencasts zu abonnieren.

As you might know Philipp, Marcel and me are working on the new watched.li, a service to track the shows you are watching.
Marcel already did most of the Design work and I’m currently putting together the Front End. To try CodePen a little bit more I put a small part of my current watched.li work online as a Pen. You can see one Show-Tile where you can mark shows as seen and unseen. The standard overview in your watched.li account will consist of these tiles.

I wanted to embed the example here, but the code I get from CodePen doesn’t seem to work, so just head over there, have a look and feel free to follow me: http://codepen.io/martinwolf/pen/watchedli-show-tile/

CodePen is all about front end code inspiration, education, and sharing. Enter HTML, CSS, and JavaScript and the combined result is displayed below. This is extremely useful for showing off demos, troubleshooting, demonstrating bugs, or anything else you can think of.

CodePen is a service which went into public beta today. The founders are Chris Coyier, Alex Vazquez and Tim Sabat. It’s kind of like jsfiddle, but with a social touch. This could turn out to be really cool.
Biggest problem for me at the moment is, that I really don’t like the design. But let’s see how Codepen evolves. You can find my profile here: http://codepen.io/martinwolf