senäh

17senäh und so…

HTML/CSS/JS
29. Sep 2012
Kommentare: 0

Web Dev Rückblick für August/September

Kategorien: HTML/CSS/JS | 29. Sep 2012 | Kommentare: 0

Pipo ist wieder hier! Und ich grüße euch. Es schreit einfach nach einen neuen Web Dev Rückblick. Ich muss noch die Monate August und September nachholen. Und ich muss euch mal sagen, wie sehr sich mein Workflow in dem letzten halben Jahr geändert hat! Kleinen Apps, Automatisierungen und Terminal-Scripten sei dank. Workflow-Optimierung FTW! Falls es euch interessiert, dann lest doch weiter 😉

Node ist ein super Einstieg in Welt der Command Lines und Terminals

Ganz ehrlich? Ich habe mich immer vor Terminals gefürchtet. Ich habe es strikt vermieden mit einem Terminal und Command Lines zu arbeiten und immer Apps mit GUI bevorzugt. Ich war ein echter Terminal-Verachter. Aber so ist es bei mir häufig. Ich verurteile etwas und sage, dass ich es nicht benötige – dabei kenne ich es kaum. Und wie so oft hat mir einfach nur der richtige Einstieg in die Thematik gefehlt. Bei Command Lines war es genauso. Aber dann fing ich an mit Node.js zu arbeiten.

Ohne jetzt näher auf Node eingehen zu wollen (tolle Technologie!), so will ich nur sagen, dass man mit Node Command Line Tools bauen kann. Und als JavaScript Entwickler benötigt man einen Tag, um einen groben Überblick über Node zu gewinnen und einen weiteren Tag, um ein erstes einfaches Command Line Tool zu bauen. Nur zwei Tage. Und dafür bekommt man Monate von Arbeitserleichterungen und neue Erkenntnisse. Und on-top-of-that lernt man noch Server zu programmieren.

Automatisierung mit grunt ftw!

Ihr wollt noch einen kleinen Geheimtipp für Node und Command Line Tools? grunt! grunt ist ein plugin-basiertes Node Framework zur Entwicklung von (automatisierten) Command Line Scripten. grunt kommt mit sehr vielen eigenen und zahlreichen anderen Plugins anderer Entwickler, welche die Arbeit eines Webentwicklers extrem vereinfachen. Less und Sass Kompilierung, JSHint Tests, concatenating und minification… Mit grunt können so viele alltägliche Arbeitsschritte einfacher und schneller ausgeführt werden.

Noch dazu ist es extrem leicht eigene Plugins zu schreiben. Bevor PhoneGap 2.0 herauskam und ein neues CLI mit sich brachte, habe ich selbst versucht ein einheitliches CLI zum builden und deployen einer Webapp für Web, iOS und Android zu bauen. Ich hatte einen Dev-App Ordner, in welchem meine Rohdaten lagen. Habe ich dort bspw. eine JavaScript-Datei verändert, so sprang automatisch grunt an und hat aus den Rohdaten der Dev-App eine saubere Webapp geschnürrt (ggf. SASS/Less kompilieren, JS minifizieren, etc.). Anschließend wurde die Webapp in eine native Shell gepackt und auf meine angeschlossenen Entwicklergeräte installiert.

Alles automatisch. Nur wenn ich eine Datei verändert habe. Großartig oder? Mittlerweile hat das fast alles PhoneGap von Haus aus, aber bis dahin konnte ich mir diese Funktionen selbst mit grunt bauen.

Yeoman

Fast alles? Was habe ich denn noch so schönes mit grunt gemacht? Ein Punkt der mir sehr wichtig war, war das Erstellen neuer Projekte (= scaffolding). Die Möglichkeiten von grunt haben auch die Leute bei Google erkannt und kurzerhand Yeoman entwickelt. Das ist quasi grunt on steroids. Und Yeoman kommt (unter anderem) mit eigenen scaffolding Plugins, (generators genannt), welche selbstständig erweitert werden können.

Bis jetzt konnte ich Yeoman noch nicht ausführlich testen. Bei einem ersten Test erschienen mir die mit Yeoman generierten Projekte etwas bloated. Da muss ich erst noch herausfinden, ob mir Yeoman wirklich einen Mehrwert bietet und in meinen Workflow passt oder ob mir nicht grunt vollkommen ausreicht.

Node Hosting ist ein Graus

So schön Node als Technologie auch ist – als Werkzeug ist es gut nutzbar, aber als Server-Technologie hat Node noch einen (kleinen?) Weg vor sich. Nicht unbedingt wegen der Technologie selbst, sondern eher wegen der Akzeptanz bei Hostern. Es gibt ein paar freie Hostingmöglichkeiten für nodebasierte Apps, aber die, die ich getestet habe, hatten mir nicht gefallen. Hauptsächlich weil ich irgendwann bei der Anmeldung oder kurz danach gescheitert bin und anschließend keine Lust hatte mich durchzubeißen. (Bei cloudno.de hatte ich bspw. irgendwie Probleme mit meinen SSH Key. Aber dafür, dass ich nur kurz etwas testen und experimentieren möchte, verschwende ich nicht Stunden für Konfigurationen.)

Wer Node.js derzeit professionell einsetzen möchte/muss, der ist vermutlich bei virtuellen Linux Servern (Die heißen doch so oder?) wie Amazons EC2 am besten aufgehoben. Amazon hat wohl auch ein Freemium Modell, aber das habe ich nicht getestet.

App-Mania: Sketch, Pixelmator, Byword, Day One…

Vom Terminal-Wahnsinn abgesehen habe ich in den letzten Monaten einige Apps sehr lieb gewonnen. Sowohl meine Begeisterung für Command Line Tools als auch kleiner Apps habe mich in den letzten Monaten extrem vom Mac als Arbeitscomputer überzeugt. Ich bin vor knapp 1 1/2 Jahren zu Mac gewechselt. Größtenteils aus Neugier und weil ich iOS Apps machen wollte. Ich war voller Vorfreude, weil alle Bekannten, die von Win zu Mac gewechselt sind, absolut begeistert waren. Aber ich war lange Zeit eher ernüchtert, weil ich feststellen musste, dass ein Mac halt doch nur ein Computer ist. Ich hatte viel Freude an dem tollen Akku/Display/TouchPad meines MacBooks, aber das Betriebssystem ließ mich zunächst kalt. Mittlerweile haben sich aber so viele Betriebssystem-spezifische Anwendungen dazu gesellt, dass ich meinen Mac nicht mehr missen möchte. Meine aktuellsten Apps will ich kurz vorstellen (- waren fast alle extrem runtergesetzt in letzter Zeit… Pipo, der alte Schnäppchenjäger! 😉 ):

  • Sketch: Ein tolles Vektorprogramm, welches etwas an eine entschlacktes Fireworks erinnert. Diese Entschlackung sehe ich aber eher als Vorteil, da die GUI viel übersichtlicher ist. Mit Sketch lassen sich sehr einfach gute Icons entwerfen, aber auch für Layout-Entwürfe ist Sketch geeignet. Sketch kommt dabei mit einigen interessanten Funktionen wie die automatische Generierung von an Retina-Displays optimierten Icons. Schade: Das Programm hatte bei mir einige Abstürze und es fehlen noch einige wichtige Funktionen (Styles projektübergreifend wieder verwenden, Styles gruppieren, parametrisierbare Symbole einfügen, etc.). Cool: Die Jungs haben bisher auf jede Mail mit Bugs und Feature Requests von mir geantwortet und fast alles soll noch umgesetzt werden!
  • Pixelmator: Wenn Sketch ein entschlacktes Fireworks ist, dann ist Pixelmator ein entschlacktes Photoshop. Habe ich noch nicht so oft verwendet wie Sketch, gefiel mir aber bei den ersten Schritten sehr gut.
  • Byword: Wenn ihr diesen Blog häufig lest, solltet ihr Byword längst kennen. Dieser Artikel entsteht gerade in Byword. Auch wenn ich Ennos fancy Automatisierung noch nicht nutze… Schande über mich.
  • Day One: Eine Tagebuch-App in sehr ansehnlichem Design. Wurde zu erst von mir falsch benutzt, da ich Day One u.a. als Notiztool genutzt habe. Aber dafür eignet sich wie ich mittlerweile weiß nvALT viel besser. Jetzt nutze ich Day One eigentlich nur zum Eintragen privater Ereignisse. Hilft mir Arbeit und Privates mental besser zu trennen. Learned lesson: Choose the right tool for your job! Oder auch: Wenn man nicht die richtige Antwort findet, ist die Frage schon falsch. Aber jetzt genug Phrasen… Day One ist super falls man mit kurzen Texten seinen privaten Alltag dokumentieren möchte. Leider fehlt eine Android-App 🙁 Dafür gibt es Markdown-Support 😉
  • YNAB: YNAB oder in Langform You need a budget ist eine Budgetierungs-/Finanzapp mit schicker GUI und schicken Internetauftritt. Hand aufs Herz: Bei dem Werbevideo hatte ich die App quasi schon halb heruntergeladen. (Die gleiche Taktik nutzt Humble Bundle bei mir auch immer!) Leider sind Finanzapps bei mir wie Todo-Apps: So richtig funktioniert haben sie bei mir nie. Aber bei YNAB habe ich ein sehr gutes Gefühl. Etwas besseres gibt es meines Wissens nach nicht für mich. Es gibt Android und iOS Versionen mit sync. Alles ist recht einfach und übersichtlich gehalten. Nützlich für jeden – egal ob als Freelancer oder privat.
  • Multimon: Fügt eine zusätzliche Menüleiste zu jeden externen Monitor hinzu, sowie zahlreiche Shortcuts um Fenster von einem Monitor zum anderen zu schicken.

Wow. Schon so viel geschrieben. Dabei habe ich jetzt schon sechs weitere Stichpunkte und der Oktober hat noch nicht einmal angefangen! o_O Aber jetzt reicht es wirklich. Die nächsten mehr oder weniger interessanten Gedanken von mir kommen nächsten Monat 😛

Ansonsten habe ich noch spannende News: Pipo ist nächste Woche auf der jsconf.eu in Berlin und bloggt dann (hoffentlich) live von der Messe 🙂

Autor: Pipo

...kommt ursprünglich aus der Designerecke, ist aber im Laufe seines Studiums in die Webentwicklung gestolpert. Kann sich seit dem nicht so richtig entscheiden wo er hingehört und wagt deswegen vielleicht die Flucht nach vorne in ein komplett neues Gebiet. Vielleicht Management? Niemand weiß es. Auch er nicht.