Um etwas Zerstreuung vom Uni-Lernstress zu bekommen, habe ich einen Ausflug in die bunte Node.js-Welt unternommen. Als Mittel zum Zweck diente mir dabei das digitale Notizbrett “Clipboard”. Serverseitig kommt das Application-Framework Express zum Einsatz. Gespeichert werden die Daten in einer MongoDB-Datenbank mithilfe von Mongoose.

Client-seitig kommt die bewährte Kombo aus Underscore, Backbone und jQuery zum Einsatz. Für Ordnung sorgt überdies Require.js, wobei ich auf folgenden Ansatz zurückgegriffen habe: Modular JavaScript & Backbone.js. Außerdem hat jQueryUI einen “Gast-Auftritt” und sorgt für die Draggability der Notizen.

Das Hosting übernimmt dankenswerterweise Nodester, die Daten werden bei MongoHQ abgelegt. Defenitiv zwei sehr praktische Services.

(Clipboard-Code bei GitHub)

Verwandte Beiträge:

• „Backbone Fundamentals“ – Ein fundierter Einstieg in das Thema Backbone.js
• Backbone.js-Tutorial: Die Merkliste
• Studie “Backboned”: AJAX-powered WordPress-Theme mit Backbone.js

Wer hier gelegentlich mitliest, wird eventuell mitbekommen haben, dass ich mich gerne mit dem JavaScript-MVC-Framework Backbone.js beschäftige. Von daher war meine Freude recht groß, als ich gewahr wurde, dass Addy Osmani höchstselbst sich dran gemacht hat, eine unter CC-Lizenz stehende Wissenssammlung zum Thema unter dem Namen “Backbone Fundamentals” zu scheiben.

Diese behandelt die Basis-Themen und gibt einen kurzen Einblick in das Thema Backbone.js. Des weiteren wird die Entwicklung einer “RESTful Application” mithilfe von Node.js, Express, Mongoose und MongoDB beschrieben. Es folgt eine Einführung in das Thema “Modular JavaScript” im Kontext von Backbone.js, abgerundet durch konkrete Anwendungsszenarien. Anschließend wird das nicht uninteressante Thema Backbone.js in Kombination mit jQuery Mobile behandelt. Und zum Schluss steht Unit Testing mit dem Test-Framework Jasmine auf der Agenda.

Alle Themen werden anhand der Backbone-Todo-Application erläutert, so dass der praktische Einsatz der vorgestellten Techniken direkt ersichtlich wird. Meinem Empfinden nach entsteht mit “Backbone Fundamentals” eine sehr wertvolle, breit gefächerte Ressource, was das Thema Backbone.js anbelangt. Vielen Dank deshalb an Addy Osmani und allen weiteren, die mitgeholfen haben.

Zum Schluss möchte ich jedoch auch anmerken, dass es sich bei “Backbone Fundamentals” nicht gänzlich um Einstiegslektüre handelt. Grundsätzlich sollte man ein Verständnis von JavaScript, DOM-Libraries im allgemeinen und Application Development in Ansätzen mitbringen, um sich der Lektüre der Basics zu widmen. Bei den weiterführenden Themen ist ein Grundverständnis der verwandten Frameworks und Techniken, die im Kontext von Backbone.js beleuchtet werden, sicherlich auch hilfreich.

Obwohl meiner Meinung nach auch nichts dagegen spricht, bspw. das Kapitel “Modular JavaScript” zum Anlass zu nehmen, sich endlich einmal mit der Materie auseinander zu setzen. Allerdings wird man in diesem Fall wohl nicht umhin kommen, begleitende Lektüre zu konsultieren.

Verwandte Beiträge:

• „Clipboard“ – Digitales Notizbrett mit Node.js und Backbone.js
• Backbone.js-Tutorial: Die Merkliste
• Studie “Backboned”: AJAX-powered WordPress-Theme mit Backbone.js

Der Deutsche Rollstuhl-Sportverband hat neuerdings eine Android-App, welche ich in meiner Rolle als Frontend-Developer bei w3design. entwickeln durfte. Die App wird zeitnah außerdem auch für das iPhone erscheinen.

Was daran jedoch besonders interessant ist – abgesehen vom Erscheinen der App selbst –, ist die Tatsache, dass ich sowohl von Java, als auch von Objective-C nicht den blassesten Schimmer habe. Vielmehr habe ich mich beim Entwickeln der App auf meine HTML-, CSS- und JavaScript-Kenntnisse verlassen. Möglich ist das durch PhoneGap, ein Framework, das Web-Apps in native Apps umwandelt und dabei ein paar sinnvolle Hardware-APIs zur Verfügung stellt.

Für die App selbst, habe ich auf Backbone.js gesetzt, da es mir gute Möglichkeiten bot, einerseits die Fülle an unterschiedlichen Daten zu verarbeiten, und andererseits ein sehr umfangreichen “One-Pager” zu bauen, welcher aus einer index.html besteht und alle Unterseiten client-seitig rendert.

Ich kann Phonegap jedenfalls nur empfehlen und möchte noch auf LungoJS hinweisen, welches bei kleineren Apps sicher gut mit Phonegap Hand in Hand geht.

Verwandte Beiträge:

• Bilder mit jQuery einblenden, wenn sie fertig geladen sind

1. Es bestehen Abhängigkeiteen zwischen den zu ladenden Daten, so dass sicher gestellt sein muss, dass die Daten vom Typ A fertig geladen sind, bevor das Laden der Daten vom Typ B startet bzw. starten kann.
2. Der Fortschritt des Ladevorgangs soll visualisiert werden, heißt, ist ein Ladevorgang abgeschlossen und es beginnt der nächste, soll ein Ladebalken vorwärts schreiten.

Es wird ersichtlich, dass es nicht damit getan ist, die AJAX-Calls hintereinander aufzurufen. Vielmehr braucht es eine ordnende Instanz, die dafür sorgt, dass die Aufrufe sauber von einander getrennt ablaufen und zwischendurch Callback-Funktionen aufgerufen werden können. Um das zu erreichen, greife ich auf das Pub-Sub-Pattern von Addy Osmani zurück und kombiniere es mit einer InitialDataloader-Funktion. Die AJAX-Funktionalitäten hole ich mir von jQuery.

Im folgenden das Pub-Sub-Pattern:

JavaScript

var mediator = (function () {

	function subscribe(channel, fn) {

		if ( !mediator.channels[channel] ) {
			mediator.channels[channel] = [];
		}

		mediator.channels[channel].push({
			context : this,
			callback : fn
		});

		return this;

	}

	function publish(channel, context) {

		var i = 0,
			len,
			args,
			subscription;

		if ( !mediator.channels[channel] ) {
			return false;
		}

		args = Array.prototype.slice.call(arguments, 2);
		len = mediator.channels[channel].length;

		for ( ; i<len; i += 1 ) {
			subscription = mediator.channels[channel][i];
			subscription.callback.apply((context || subscription.context), args);
		}

		return this;

	}

	return {
		channels : {},
		publish : publish,
		subscribe : subscribe,
		installTo : function (obj) {
			obj.subscribe = subscribe;
			obj.publish = publish;
		}
	}

})();

Auf das Pub-Sub-Pattern möchte ich gar nicht weiter eingehen. Lediglich der Hinweis, dass ich die Publish-Funktion um die Möglichkeit ergänzt habe, einen eigenen Kontext zu übergeben.

Kommen wir als nächstes zur InitialDataloader-Funktion:

JavaScript

var InitialDataloader = function (args) {
	this.args = args;
	this.result = [];

	this.init();
};

InitialDataloader.prototype.init = function () {

	var i = 0,
		len = this.args.length;

	if ( !len ) {
		return;
	}

	for ( ; i<len; i+=1 ) {
		mediator.subscribe(this.args[i], this.load);
	}

	mediator.publish(this.args[0], this, {path : this.args[0], next : 1});

};

InitialDataloader.prototype.load = function (obj) {

	var that = this,
		deferred = $.ajax({url : obj.path});

	deferred.success(function (resp) {
		that.result.push('Data' + obj.next + ' loaded');
	});

	deferred.then( function (resp) {
		if ( obj.next === that.args.length ) {
			console.log(that.result);
		} else {
			mediator.publish(that.args[obj.next], that, {path : that.args[obj.next], next : obj.next+1});
		}
	});

};

in der Konstruktor-Funktion werden die Argumente entgegen genommen und der Prozess via der init-Funktion gestartet. Das args-Argument stellt dabei einen Array dar, der die Pfade zu den Daten enthält.

In der init-Funktion wiederum wird für jeden Pfad des args-Array eine Funktion im Pub-Sub-Pattern angemeldet. Anschließend wird das erste Element des Pub-Sub-Patterns “veröffentlicht”, sprich die load-Funktion mit dem ersten Pfad aufgerufen und der Zähler zum nächsten Element des Pfad-Arrays mit übergeben.

Innerhalb der load-Funktion wird ein AJAX-Call auf den übergebenen Pfad gemacht und an ein deferred-Objekt übergeben. Dies wird anschließend genutzt, um eine Callback-Funktion zu starten, wenn der Ladevorgang abgeschlossen ist, und anschließend entweder das nächste Element des Pfad-Array im Pub-Sub-System zu “veröffentlichen” oder – wenn alle AJAX-Calls gemacht sind – eine finale Funktion aufzurufen (console.log(that.result);).

Anschließend noch der Aufruf der Funktion:

JavaScript

var initialDataLoad = new InitialDataloader([
	'http://apple.com/',
	'https://twitter.com/',
	'http://www.spiegel.de/',
	'http://www.flickr.com/'
]);

Die Adressen sind willkürlich gewählt.

Wenn man den Code in ein Skript packt und im Browser laufen lässt, sieht man in der Konsole nacheinander die AJAX-Calls und abschließend die Ausgabe des this.result-Array, der die einzelnen, zu ladenden Elemente mitgezählt hat.

Das war es auch schon. Sollte es Fragen oder Anregungen, nutzt bitte die Kommentar-Funktion. Ich freue mich immer über Feedback!

Verwandte Beiträge:

• Animierte Image-Caption mit jQuery unter WordPress
• Backbone.js-Tutorial: Die Merkliste

AK Madagaskar Filmtrailer auf Vimeo

Vor etwas mehr als einem Jahr sind einige Pfadfinderinnen und Pfadfinder vom AK Madagaskar des VCP Land Niedersachsen nach Madagaskar gereist um das Land kennen zu lernen und den Fortschritt des dort betreuten Projekts zu begutachten.

Des weiteren wurde der Plan gefasst, im Zuge der Reise einen Dokumentarfilm sowie eine Fotoausstellung zum Thema “Kindheit und Jugend in Madagaskar” zu erstellen. Beides – Film und Ausstellung – nähern sich nun langsam der Fertigstellung. Obiger Trailer gibt schon einmal einen Vorgeschmack auf das, was kommen wird.

Google stellt seinen neuen Service “Music” mit einer ziemlich beeindruckenden Tour vor. Diese ist multimedial, gefällig im Design und insgesamt sehr kurzweilig. Die einzelnen Bereiche der Tour werden durch Tonspuren repräsentiert, die quirlig über den Bildschirm flitzen und sich sukzessive zu einem Song ergänzen.

Ist man mit der Tour fertig, ist auch der Song vollständig und kann kostenlos heruntergeladen werden. Das ist ein ziemlich guter Call-to-Action und katapultiert den Besucher direkt in das Google-Music-System. Die erste Hemmschwelle, den Service auszuprobieren, könnte also schnell abgebaut sein. Allerdings funktioniert das nicht, wenn man nach dem Klicken des Download-Buttons folgende Seite angezeigt bekommt:

Nun muss man Google zugute halten, dass der Service noch brandneu ist und es daher nicht verwundern sollte, wenn er nur nach und nach über die US-amerikanischen Landesgrenzen hinaus erweitert wird. Aber ein bißchen ernüchternd war das nach der Präsentation zuvor schon…

(via @73inches)

Letzte Nacht verstarb Steve Jobs – Gründer von u.a. Apple Inc. – mit 56 Jahren an Krebs.

Mein Verhältnis zur Firma Apple ist zwar seit längerem recht ambivalent – den in Funktion und Design überragenden Produkten steht ein oftmals zweifelhaftes Geschäftsgebaren gegenüber. Auch die Schar größtenteils unreflektierter Apple-Jünger erzeugt manches mal ein Stirnrunzeln meinerseits. Doch das alles ändert nichts daran, dass Steve Jobs schon zu Lebzeiten als Unternehmer eine Legende war.

Sein beständiger Antrieb, Dinge voran zu treiben und weiter zu entwickeln, die konstante Suche nach Innovationen und das damit einhergehende regelmäßige, kritische Hinterfragen des Status Quo gepaart mit der Kompromisslosigkeit, mit der er die Dinge anging. Selbst Misserfolge waren keine Rückschläge, sondern nur weitere Teilstrecken auf dem Weg nach vorn.

Dies alles bietet Inspiration nicht nur für Unternehmer, sondern jeden Menschen, der das Leben nicht als statische Einheit zwischen Beruf, Reihenhaus und Kegelklub seht, welche es zu konservieren gilt. Und man entschuldige mir das Strapazieren überkommener Stereotype an dieser Stelle.

Wie dem auch sei, der langen Rede kurzer Sinn: RIP Steve Jobs.

Thomas Stadler erklärt in seinem Artikel jedenfalls, wie man diese Praktik unterbindet. Darüber hinaus bringt er eine anwaltliche Unterlassungsaufforderung an 1und1 auf den Weg. Das ist fair von ihm.

Verwandte Beiträge:

• HTTP Fehler beim Upload in WordPress unter 1und1

Die Fragen bezogen sich auf das Thema Jugendarbeit und gestalteten sich wie folgt:

1. Wie wollt ihr in den nächsten Jahren Jugendverbandsarbeit unterstützen?

2. Erhöhung der Pauschalmittel, wenn Jugendorganisationen mit Migrationshintergrund in den Ring aufgenommen würden?

3. Ein besonderes Projekt?

4. Gleichberechtigte Förderung der Hauptamtlichenstellen?

5. Einbeziehung von Menschen mit besonderem Förderungsbedarf?

6. Einbeziehung von Eltern in die Förderung?

Zusätzlich gab es zu jeder Frage einen erläuternden Satz.

Das Feedback der Aktion war denn auch recht ansehnlich; die jugendpolitischen Sprecher von CDU, Die Grünen, Die Linke und der SPD haben sich die Zeit genommen und alle Fragen hinreichend beantwortet.

Einzig die FDP wollte nicht so recht "mitspielen". Ihr jugendpolitischer Sprecher Dr. Nils Tilsen hat sich – aus welchen Gründen auch immer – nicht mit der Beantwortung der Fragen belastet, sondern kurzerhand folgendes Schreiben aufgesetzt:

“…ich teile Ihnen mit, dass ich mich außerstande sehe, Ihren Fragenkatalog abzuarbeiten.

Die Fragen sind teilweise so ins Detail gehend, dass es für mich einen erheblichen Zeitaufwand bedeuten würde, diese fachgerecht zu beantworten.

Ich finde es zwar von Ihnen taktisch geschickt, hier Kommunalpolitiker für die nächste Wahlperiode auf Ihre Probleme hinzuweisen und jetzt schon Unterstützung schriftlich einzufordern, aber auf einen solchen Deal lasse ich mich nicht ein.

Ich möchte Sie auf die Position der FDP-Ratsfraktion zu den letzten Haushaltsberatungen hinweisen, dass wir die freiwilligen sozialen Leistungen der Stadt, aufgrund der prekären Haushaltslage, pauschal kürzen wollen. Daher gehen Sie bitte davon aus, dass auch die Vertreter der FDP in der nächsten Wahlperiode einen möglichst ausgeglichenen Haushalt als die beste Lösung besonders für die jungen Menschen unserer Stadt als Prämisse ansehen.

Daher kann ich Ihnen nur anraten, dass Sie selber, durch Umschichtung in Ihren eigenen Strukturen, die von Ihnen selbst gesteckten Ziele erreichen müssen.

Ich bitte um Ihr Verständnis.
Mit freundlichen Grüßen! Dr. med. Nils Tilsen”

Das nenne ich mal ein “herzliches” Schreiben. Inwiefern der Mitarbeiter für Öffentlichkeitsarbeit und PR im Urlaub war oder ein derartiger Umgang mit den Anspruchsgruppen bei der FDP Hannover zum Standard gehört, lässt sich nur spekulieren.

Als langjähriger Ehrenamtlicher der Jugendverbandsarbeit des VCP kann ich mich allerdings über ein solches Verhalten nur wundern. In Zeiten zunehmender Kinderarmut, fortschreitender Zerklüftung der Gesellschaft und steigender Jugendkriminalität zu behaupten, ein ausgeglichener Haushalt wäre die beste Lösung für junge Menschen ist in höchstem Maße zynisch.

Weiterhin den Ruf nach Unterstützung als niederes Belästigen herabzustufen ohne sich ernsthaft mit der Materie auseinandersetzen zu wollen, ist in meinen Augen beängstigend. Ich weiß nicht, welches Verständnis von Politik dem zugrunde liegt. Ich würde allerdings vermuten wollen, dass es zum Aufgabenbereich eines jugendpolitischen Sprechers gehört, sich um jugendpolitische Belange zu kümmern.

Dazu gehört auch, dass man sich mit Vertretern der Jugendarbeit auseinandersetzt und diesen nicht einfach auf den Weg mit gibt, sie sollen sich selber um ihren Kram kümmern und eben ihre Strukturen anpassen. Zwar sind Einrichtungen der Jugendarbeit in der Regel keine straff organisierten Wirtschaftsbetriebe. Allerdings ist es fraglich, inwiefern sie das sein müssen. Unabhängig davon ist Ignoranz gegenüber den Sorgen und Nöten dieser Einrichtungen ganz sicher nicht das adäquate Mittel.

Deshalb zum Abschluss die Frage an Herrn Nils Tilsen: Was haben sie sich bei diesem Schreiben gedacht?

In den letzten Wochen war meine Hauptbeschäftigung bei w3design. die Frontend-Entwicklung des Social Media Onlinemonitors – liebevoll smom genannt.

Dieses Tool ist aus der Erkenntnis heraus geboren, dass quantitative Faktoren bei der Erfolgsmessung von Social Media nur einen Aspekt darstellen. Natürlich freut man sich, wenn ein Tweet hundertmal re-tweetet wurde. Doch sagt die Zahl ansich wenig darüber aus, wer re-tweetet hat, und mit welcher Intention. Das gleiche gilt für Kommentare auf Facebook und Blogs.

Dies ist der Punkt, wo smom ins Spiel kommt. Und zwar bietet smom einen modular aufgebauten Fragebogen, welchen man zur Qualitätsmessung von seinen Besuchern beantworten lassen kann. Modular bedeutet genauer gesagt, dass der Fragebogen aus einem allgemeinen Social-Media-Basisteil besteht, welchen man je nach Bedarf um Facebook-, Google-Plus-, Youtube-, Twitter- und Blog-Module ergänzen kann.

Die Fragen sind vorgegeben und wurden in Zusammenarbeit mit whiteboxx erarbeitet. Zusätzlich können eigene, offene Fragen hinzugefügt werden. So ergibt sich mit wenigen Klicks ein vollständiger Fragebogen, ohne dass im Vorfeld stunden-/tagelang an Fragen gefeilt werden muss.

smom befindet sich momentan in der “Closed Beta” und ist derzeit noch für alle Beta-Tester kostenlos. Nutzer werden in kommerzielle und freie Nutzer unterteilt. Nach erfolgreicher Beendigung der Beta-Phase wird es ein Preismodell geben, welches zwischen einmaliger Nutzung und einem Abonnement differenziert. Dieses richtet sich an die kommerziellen Nutzer.

Für freie Nutzer – die den Erfolg ihres Blog oder Twitters messen wollen – wird smom immer kostenfrei bleiben.

Da die Nützlichkeit von smom letztlich nur durch die Nutzer bescheinigt werden kann, ist jeder, der Interesse hat, herzlich eingeladen, sich als Beta-Tester zu versuchen. Um einen Zugang zu bekommen, einfach eine Mail an kontakt@social-media-onlinemonitor.de schreiben, der Zugang wird dann alsbald eingerichtet.

Btw: Wer sich über den klobigen URL wundert – smom.de wird vom souveränen Malteser-Ritterorden “besetzt”

Link: smom – Social Media Onlinemonitor

Verwandte Beiträge:

• "Social Icon Bar" mit jQuery