Tag Archives: Tutorial

Tutorial: Ghost Blog Installation

Ghost-Logo

Die Blogging-Plattform Ghost kann mal eine sehr gute Alternative für Blogger zu WordPress werden. WordPress ist mittlerweile viel mehr als nur für das Bloggen gedacht, dass kann aber auch Nachteile haben. Kompromisse müssen eingegangen werden, es schwirren für viele Nutzer unnötige Funktionen rum, das System wird langsamer und vielleicht noch der ein oder andere Punkt mehr.

Ghost will wirklich nur für das Bloggen gedacht sein, setzt auf node.js und hat sich über Kickstarter finanziert – ist aber kostenfrei erhältlich.

Continue reading

Quick-Hints #14

Willst du fließend JavaScript sprechen?

Wenn du das möchtest und gerade begonnen hast zu lernen, dann kann ich dir wärmstens http://speakingjs.com/es5/ ans Herz legen. In dieser HTML-Edition des Print-Books findet man eine sehr gute Einführung in JavaScript plus vielen weiteren Informationen, weit über die reine Syntax der Sprache hinaus. So werden unter anderem die wichtigsten Libraries vorgestellt, aber auch wie man die Code-Qualiät verbessern kann und wie die Geschichte von JavaScript ist.

Aber auch für Nicht-Anfänger ist es eine tolle Lektüre. Viele Sachen wird man überspringen können, einiges wird wieder in Erinnerung gerufen und alles kennt man nie.

Don’t use EmberJS

Ich bin eher ein Fan von Low-Scope und flexiblen Frameworks, also nicht unbedingt von EmberJS (auch wenn es ein tolles Framework ist!):

Von gezeichneten und lebenden Prototypen

In Quick-Hints #11 hatte ich bereits seinen tollen Artikel zu Transitional Interfaces vorgestellt. In einem weiteren tollen Artikel von Pasquale D’Silva auf Medium stellt er ein paar nette Tools für die Darstellung / Prototypisierung von Interaktionsdesign vor. Besonders Framer hat es mir angetan und ich werden es demnächst einsetzen, wenn ich eine Idee kurz ausprobieren oder vorstellen möchte. Mit Framer können Prototypen von Animationen und Interaktionen mit JavaScript erstellt werden.

Für die statische Darstellung (oder vielleicht auch dynamisch in Verbindung mit Framer) gibt es auf http://awesomekit.me ein tolles Grafikpaket zum kostenlosen Download. Hiermit gelingen jedem schöne iOS7 Wireframes.

Ein weiterer CSS Preprocessor?

Nein, GridStyleSheets ist mehr. Basierend auf dem gleichen Algorithmus, den Apple für sein natives Layout benutzt, will GSS das CSS der Zukunft sein.

Quick-Hints #9

JavaScript Tutorials

Promise Cartoon by Wilf Eddings

Promise Cartoon by Wilf Eddings / @iamwilf

Wie so häufig in den Quick-Hints; ein paar JavaScript Tutorials. Im letzten Quick-Hints hatte ich schon ein CheatSheet zum Thema Promises verlinkt, jetzt hab ich noch etwas gefunden, was ich unbedingt noch hinzufügen möchte: Ein Cartoon, der sehr anschaulich Promises erklärt.

Ich gehöre nicht zu den riesen Fans von AngularJS, aber in Verbindung mit der detaillierten Erklärung, wie man ChromeApps entwickelt, ist ein dabei ein gutes “ChromeApp mit AngularJS entwickeln” Tutorial herausgekommen.

StartUp-Doku

Jetzt noch zwei Dokumentationen zum Thema StartUp / Firmengründung. Bei startingupinamerica.com ist eine Doku zu finden, in der USA-Einwanderer von Ihrer Business-Story berichten und die Vorteile für ihr neues Land verdeutlichen. Umgekehrt werden hier auch die Vorteile eines StartUps in Amerika gegenüber anderen Ländern aufgezeigt.

Das folgende YouTube-Video ist die Hintergrundgeschichte zu Minecraft. Es erzählt ein wenig über die Entstehung von Mojang, der Firma hinter Minecraft und rund um den Entwickler notch.

#perfmatters

Wenn du als PHP- oder Java-Entwickler aus der (standardmäßig) blockierend Input/Output Welt kommst, solltest du dich bei JavaScript (nodeJS) relativ schnell mit dem Thema non-blocking IO beschäftigen und dazu hier der passende (englische) Einstieg: Zen of non-blocking IO. Als Bonus gibt es dort auch eine schöne Übersicht, was einen WebServer ausmacht.

Um die Performance seiner Webanwendungen verbessern zu können, ist es essentiell, dass du verstehst, wie ein Browser arbeitet und funktioniert. Genauer, wie stellt der Browser deinen HTML und CSS Code dar. Auf Youtube habe ich hierzu ein nettes Einstiegsvideo “How Browser Works” gefunden, vier Minuten und die Basics sind klar. Wenn du über diese Basics hinaus bist, musst du UNBEDINGT dieses Experten-Video sehen. 51 Minuten geballtes Wissen über Rendering-Performance und wie diese in deiner WebApp gesteigert werden kann. Den Speaker anschließend noch folgen: Google Mitarbeiter Paul Lewis auf Twitter.

Quick-Hints #8

Statistik Besucher Wochenrekord

Statistik Besucher Wochenrekord

Lange hab’ ich nichts mehr veröffentlicht, komme leider nicht wirklich dazu. Trotzdem konnte ich letzte Woche einen neuen Visits-Wochenrekord für ben.nyben.net aufstellen. Damit es nicht langsam aussieht, als sei mein Blog tot, hier ein neuer, kleiner Quick-Hints Eintrag.

Ein extrem nützliches, aber noch nicht so beachtetes Objekt in JavaScript ist der MutationObserver. Dieser Nachfolger der MutationEvents bietet weniger Fehlerpotential und findet bereits jetzt eine breite Unterstützung seitens der Browser. Sehr nützlich bei der Implementierung eines eigenes Frameworks, bietet dir der MutationObserver die Möglichkeit, auf DOM-Änderungen zu reagieren. Im Opera (ja, der Browser) Blog ist ein sehr nettes Tutorial zu finden. Weiterführend dazu, hat Addy Osmani auf der JSConfEU13 einen sehr sehenswerten Talk gehalten. In diesem geht es um Object.observe aus der ECMAScript Harmony Spec. Object.observe bietet quasi den Mitspieler der MutationObserver. Hiermit können Änderungen an JS-Objekten (zum Beispiel) im DOM wiedergespiegelt werden: Everthing you want to know about Object.observe

Hier ein Post, der sich als sehr nützlich erweisen kann, wenn man mal wieder das Aussehen der Scrollbars im Browser anpassen soll… Warum auch immer man das möchte.

Ein kurzer Ausflug in die Welt des Marketings: Wie schaffe ich es, vier Millionen Leute für meine Sache zu begeistern.

Promises sind extrem schön um in JavaScript einen asynchronen Aufruf / Ablauf zu entwickeln. Für Promises gibt es in JS viele Implementierungen, unter anderem von jQuery. Ein schönes CheatSheet, basierend auf der promises/A+ Implementierung, kann dabei sicher gut unterstützen. Eine nette (englische) Beschreibung von Promises findet sich im Blog von parse.com.

Auf den Seiten der FH Wedel findest du eine nette Kurzbeschreibung zu den wichtigsten Technologien, die bei nodejs zum Einsatz kommen. Nichts Weltbewegendes, aber falls du noch nicht weisst, was hinter non-blocking I/O steckt, findest du dort eine kompakte, gute Antwort.