border:none 2013

Yesterday I attended the first ever border:none conference in Nuremberg, a conference focused on the mobile we. I really enjoyed the day there and am still have to wrap my head around all the things I learned there. The talks spread over technical and conceptual topics around the web (not only the “mobile” one) and I came home with a long list of things to think about and to try out. Let me try to summarize the talks a bit.

The Talks

As already mentioned the talks spread across a diverse set of topics. It started with Jay talking about some great new layout features that are coming to CSS and how they allow new ways of presenting your content.

Where as Tobias talked on something completely different topic: How to actually test the performance of your websites under real-life conditions and how to automate this process for desktop and mobile browsers. I think that performance measurement is generally a topic that will get more and more into focus, as the responsive hype becomes a standard.

Keeping the testing topic Rodney got into “test the web forward” – writing test for browser to ensure they comply with the actual specifications. So instead of just working around a bug in your current project, write a test for all and make the web a little less broken.

After lunch Vasilis got back towards a more design-y direction. Using the idea that on the web there is no fixed canvas. Still there are a lot of aspects that can define a good design which should all focus around the actual content.

Vitaly afterwards did a wrap-up of the various tools and techniques that are out there for responsive webdesign. He managed to bring up the pieces that you might have heard of at some point but which aren’t widely used (yet).

Having read Bastian’s Let’s build a better web a couple of weeks ago, I was quite excited about his talk. I like such talks that go beyond the scope of the every day work and get to the bigger picture about how the web works and where we can bring it.

One of the best speakers I’ve seen is Jeremy. To close this awesome conference day he got back to very basic ideas that are already built into HTML, CSS and JavaScript. That our goal shouldn’t be to make the web accessible and responsive, because the web already is this way. Instead we should try to not screw it up.

This list is surely not complete and only reflects a few bits of what I took from this conference. If you weren’t able to attend the conference, make sure you watch the videos once they are up, I highly recommend them.

The Conference

At the unbeatable price of only 30€ it was a no-brainer for Jojo, Fabian, Sonja and me to go there. Despite a large traffic jam on the autobahn we arrived at the venue just in time for the first talk.

The venue was an amazing old movie theater, the Orpheum, where the team behind border:none – especially Marc and Joschi – had to bring and install everything themselves. A huge thanks to all the people who made this conference possible and ensured the nice atmosphere.

The only particular wish I have for the next border:none: Chairs which are a bit more comfortable.

Easier vHost setup

Starting development on a new web project is a pretty mundane task: Probably cloning some existent repository or creating the initial folder structure and then setting up a local virtual host, so each project got it’s own development domain, like fancyproject.dev.

Especially the last part is quite annoying: Manually editing the hosts-file and adding a new vHost in the Apache config files.

After years of just going with this workflow, I found a way to cut this whole process. Using dnsmasq and wildcards in the Apache config do the same thing without having to change a single line of config files.

dnsmasq

dnsmasq is a little DNS server and I only use it to route all request targeted at *.dev to the local machine and thereby make editing the /etc/hosts file redundant.

For installing it on a Mac I suggest using Homebrew, following these steps (mostly in the terminal of your choice):

$ brew install dnsmasq

$ cp /usr/local/opt/dnsmasq/dnsmasq.conf.example /usr/local/etc/dnsmasq.conf

Editing /usr/local/etc/dnsmasq.conf and adding at the end:

# dnsmasq.conf
# ...
address=/dev/127.0.0.1
listen-address=127.0.0.1

Then adding dnsmasq to the startup elements by executing $ sudo cp -fv /usr/local/opt/dnsmasq/*.plist /Library/LaunchDaemons

To start it this time, execute $ sudo launchctl start homebrew.mxcl.dnsmasq

It might be necessary to add 127.0.0.1 as the first DNS-Server in your Network Settings.

Apache Config

As it turns out you can use wildcards in the Apache config to automatically map all <project-name>.dev to .../projects/<project-name>/. Far better than editing the httpd-vhosts.conf all the time.

The single VirtualHost entry necessary is this one (Keep in mind to change the paths):

NameVirtualHost *:80

<VirtualHost *:80>
    <Directory /<path-to-your-projects-root>/>
        Options Indexes MultiViews FollowSymLinks Includes
        AllowOverride All
        Order allow,deny
        Allow from all
    </Directory>
    UseCanonicalName off
    ServerName localhost
    ServerAlias *.dev
    VirtualDocumentRoot /<path-to-your-projects-root>/%1/
</VirtualHost>

Voilá! Now all I need to do is create a new directory and drop the files in. The vHost comes automatically.

Raspberry Pi: Dynamically mounting an external drive

A couple of weeks ago I wrote about how I use my rpi as a TimeMachine. It quickly turned out that things weren’t as nice and easy as I imagined. The hassle of dealing with corrupted HFS+ file systems was a real annoyance. But it was the silent buzzing of the external HDD made that annoyed me enough to do something about it.

Fighting the buzzing

I own a mildly aged WesternDigital MyBook Essential and even while unmounted I can hear a constant buzzing. Throughout the day it’s not a real problem but at night quite annoying. So I tried to find the cause.

Turns out there are the internet knows about a few issues with the internal system of the drive (which has its own power supply) that might keep the drive from completely shutting down. The first suggested solutions were all about compiling a custom kernel. That seemed a bit over the top and frankly, I am not that familiar with these things yet.

Unmounting, Detaching and how to get it back

udisks --detach finally led to success: The drive would now spin down completely and stay totally silent. But the system won’t recognize a detached device anymore, so no easy mounting.

It took a few attempts to get the Raspberry Pi to recognize a detached device again without physically plugging cables. The solution is to temporarily deauthorize the USB device. Once it is authorized again, the system recognizes it as a new device and allows to mount it again.

Cleaning up

From the beginning I had the plan to automatically mount and unmount the external drive based on whether it’s needed. It’s sole purpose is to be used as backup storage, so it only needs to be available while my computer is on and likely to run a backup.

The best indicator is whether my notebook is currently in the network or not. Therefore I wrote a little bash script (Gist)1 to check the presence of my computer in the network and then mount or unmount the drive as needed. A cronjob runs this script every ten minutes.

While I’m on it… Fixing the filesystem issue

And coming back one last time to the file system thing: I decided to reformat the drive as FAT32 and use it as regular network share. Luckily TimeMachine can be tricked into accepting regular network shares. It works without problems so far. Especially without corrupted filesystems.

  1. As I am still new to these scripts, don’t hesitate to share some feedback on this. 

Raspberry Pi

I often thought about having a Raspberry Pi and doing all kinds of supercool stuff with it. But it took me until last week to actually get one and play with it.

First Steps

Setup

I didn’t want to buy any HDMI cables and decided to run it completely headless, meaning I will use it only over SSH and never connect it to an actual display. After putting Raspbian onto a SD card as operating system, I hooked it up to the network. I did buy a Wifi USB Adapter beforehand, but for the configuration process it’s easier to go with the wire option.

AirPlay

AirPlay was the first thing I wanted to give a shot. It often bugs me that I have to mess around with the cables when I want to use the notebook on my couch rather than on my desk.

Thanks to ShairPort1 that’s really easy and works like a charm with both my MacBook and my iPhone.

ProTip: If you are not alone in your network, make sure to set a password.

TimeMachine

The next cable on my desk is the one of my external backup hard drive. Why not doing backups over Wifi? It turned out to be a bit more tricky. There are quite a few tutorials on running using your Pi as full-fledged TimeCapsule.

There are quite a few tutorials on this. One of my biggest problems was that the external drive was always getting mounted as read-only. Turns out that if you don’t eject the drive correctly the Linux driver won’t mount it writable the next time. Although Apple tells one not to do it, disabling journaling seems to fix this problem.

I tried a lot to get TimeMachine accepting my previous backups and continue there. Turns out Mac OSX handles local (= USB) backups way differently than network backups. I didn’t find any way to do so and decided to connect my MacBook and the Pi with a LAN cable directly. After doing the initial backup that way, it’s no problem to change to wireless later on.

What’s next?

Currently the external drive is permanently mounted and powered. I am experimenting a bit with dynamically mounting it whenever my MacBook is in the network.

I stumbled upon GroundControl, a neat control center for the Pi with statistics and the possibility to execute commands. As I am missing a few features I hope to make some time for forking and exiting it a bit.



But for new functionality I don’t know what to do next. If you have got some cool idea, shoot me a tweet.

  1. Be sure you get version 1.0, at the time of writing it is still in development but has proven to be more reliable on my system. 

Automatically Sync PhotoStream to Dropbox

The sync behind Apple’s photostream is really comfortable. My photos are uploaded when my iPhone has WiFi and my mac downloads them instantly. So when I want to get an image from my phone I just have to tap into the PhotoStream.

But all regular solutions are in some way inconvenient. To access the PhotoStream you have to use the somewhat bloated iPhoto and Dropbox requires you to either start the iOS app or connect your iPhone via USB. None of these options are really comfortable.

Digging into Photostream

Turns out OS X saves the images as regular files, but puts each in a separate subfolder – not that cool for direct use. But at least that’s automatically done by a system service, so no need for iPhoto.

In a quick Google search I found an AppleScript that copies images from the PhotoStream to the Dropbox folder. That seemed great until I noticed it freezes the Finder for the duration of the sync.

Copying the PhotoStream into your Dropbox

That’s why I came up a little bash script that does the same but it runs faster and doesn’t freeze the Finder. You can find it below or on GitHub Gist.

The script just takes all files starting with IMG_ from the PhotoStream folder and copies them into the subfolder photostream of my Dropbox. Make sure you adjust the second path and make the script executable.

cd ~/Library/Application\ Support/iLifeAssetManagement/assets/sub/
find . -name 'IMG_*' -exec cp -n -p {} /Volumes/HDD/max/Dropbox/photostream \;

Additionally I registered the script as a LaunchAgent, so it automatically gets started every 5 minutes. Again, make sure you adjust the paths and save the .plist-File (is.justcurious.photostreamsync.plist) in ~/Library/LaunchAgents/ . (A restart is required to actually register the LaunchAgent.)

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
    <key>Label</key>
    <string>is.justcurious.photostreamsync</string>
    <key>ProgramArguments</key>
    <array>
        <string>/Applications/utils/photostream</string>
    </array>
    <key>StartInterval</key>
    <integer>300</integer>
</dict>
</plist>

Project Locationaire

I rarely have the chance to show what I am actually doing at university. But yesterday was the final presentation of a practical course on iOS development and I’d like to share the result.

Locationaire

Locationaire is an app to bookmark and share the best locations you discover and share them with your best friends. When you and your friends are traveling around the globe Locationaire allows to easily share the places you discover and to find the places your friends like.

We – Fabian, Felix, Jörg and me – didn’t aim to get people to constantly save every location. Instead we focused on getting honest recommendations. Therefore Locationaire doesn’t have any global stream or similar functionality but only shows the items of your friends, the people who you trust and whose taste you value.

You can find more information on locationai.re.

Technicalities

For me personally it was the second time I actively developed on iOS and the first time to probably get an actual app out the door. We used Parse as backend and Foursqaure to get locations, which allowed us to mostly focus on the iOS part of the project.

Quo vadis?

At the moment we are happy that we got that far and rocked our presentation. Although we have to catchup with our other courses for now, we plan on bringing Locationaire to the AppStore.

To get if even faster, we start a private beta in the upcoming days. If you are interested feel free to contact us.

Tracking myself

The idea to capture as much data as possible about myself fascinates me. Most of the time I don’t have any specific goal in my mind. It is more about looking back and seeing how things evolved over weeks/months/years. Throughout the last couple of years I tried many different approaches and tools. Here is a short overview of the areas I currently track and what I use for it.

Spending: Next

It’s easy to automatically track the movements in my bank account. But this hardly mirrors my actual spending habits as I can’t figure out where all my cash goes. Next is a sleek iOS app to track on what I actually spend my money.

Sports: Runkeeper

I picked up running once again this year and doing so far much better than in all previous attempts. And finally I can put all those fitness apps to use. I decided to go with Runkeeper mostly because I like their data export options and that they offer an API.

Journaling and everything else: Day One

Day One lives on both my Mac and my iPhone. Generally I try to capture bigger stories about my personal life in there. It’s nice to sometimes look back on what obsessed my mind a couple of months ago and how these things actually turned out.

Brett Terpstra’s Slogger is a nifty tool that pipes the social webservices of choice into Day One. Such a great tool to preserve all my tweets and checkins in a central place.


Maybe I made this whole entry up as an excuse for pre-ordering the Fitbit Flex.

Switching to Ocotopress

Along with a small refresh of the design, I switched this blog from Wordpress to Octopress. Except for the name these two have actually very few in common. While Wordpress is a blogging system growing into a fully fledged CMS, Octopress is a static site generator.

I do still enjoy developing projects with Wordpress a lot. It’s template and theming structure is relatively simple and straightforward (other than Drupal). For most blog-alike things it is the most suitable option.

So I ditched it mostly out of curiosity to try something new. While the admin interface of Wordpress is easy to use, it bugged me to only have the posts in a database on my server. Quite some time ago I have come to love Markdown (and it’s extension MulitMarkdown). It allows me to store additional semantic information in plain text files. Yet I can edit and read these files on any available machine without any proprietary software.

Using Octopress I now create all entries locally on my Mac and write them in Markdown. Which makes them also searchable via Spotlight. It comes with a handy deployment functionality which automatically pushes everything to the server. I find this workflow quite enjoyable.

Furthermore this blog has now a new domain (justcurious.is along the previous .de-domain) and yes, I am writing in English.

Prima Leben und Stereo 2012

Man kann nie auf genug Festivals gehen. Also gings vergangenes Wochenende aufs PLUS nach Freising. Mein zweites Festival nach dem Southside im Juni. Allerdings Unterschiedlicher könnte es kaum sein: Nur eine Bühne, recht unbekannte Bands, kein Becks und "Camping" bei Freunden daheim. Nur das Wetter ist auf allen Festivals gleich riskant. Nachdem das PLUS bei meinem letzten Besuch 2010 regelrecht abgesoffen ist, hatten wir dieses Jahr mehr Glück. Leicht bewölkt, warm genug und nur ein kleiner Nieselregen ist eine gute Mischung. Der einzige Schauer kam gerade, als wir noch beim Weißwurstfrühstück im Trockenen saßen. Vielleicht werde ich auch nur alt, aber so es ist schon sehr bequem, in einem Haus schlafen zu können und dennoch in 20 Minuten aufm Festivalgelände zu sein. Da braucht man auf so manchen Zeltplatz länger (I'm looking at you, Frequency!). Es passt zur sonst schon familiären Atmosphäre. So verbrachten wir die Nachmittage eher im hinteren Bühnenbereich chillend auf der Wiese und tranken Bier der ältesten Brauerei der Welt. Musikalisch waren Fuck Art, Let's Dance! und Fiva & das Phantom-Orchester ziemlich weit vorne dabei. Aber auch die meisten lokalen Bands ausm Münchner Raum haben perfekt in diese sommerliche Stimmung gepasst.