Programmierblog von Johannes Dienst

SASS mit libsass in Nodejs (1): Installation

Posted by in CSS, Nodejs, Präprozessor

Dieser Blog beschreibt das Setup das notwendig ist, um SASS anstatt mit Ruby mit Nodejs zu kompilieren. Dazu wird die Library namens libsass benötigt und der Taskrunner Grunt mit dem Modul grunt-sass. Grunt sorgt dafür, dass bei einer Änderung in den SASS-Dateien automatisch das CSS neu erstellt wird. So erspart man sich nervige manuell angestoßene Kompilierungsvorgänge. package.json Zuerst erstellen wir einen Projektordner und legen in diesen eine package.json mit folgendem Inhalt:

Soweit so gut und nichts Besonderes. grunt-contrib-watch sorgt für das automatische Neukompilieren bei Änderung von SASS-Dateien. grunt-sass musste…read more

0

Nodemon und PM2 mit Express 4

Posted by in JavaScript, Nodejs

Nodemon und PM2 sind sehr nützliche Tools für die Entwicklung und dann später in der Poduktion. Mit Express 3 konnte man nach der Installation einfach diese Aufrufe zum starten der Applikation benutzen:

Mit dem neuen Layout von Express 4 änderte sich das Startkommando auf npm start. Dabei wird auf die package.json und dort auf Scripts->start verwiesen, das dann ausgeführt wird. Will man Nodemon starten, dann muss man hier statt node einfach nodemon eintragen.

Startet man jetzt die Applikation sieht man in der Konsole, dass sie mit Nodemon gestartet…read more

0

Nib: Library für Stylus

Posted by in JavaScript, Nodejs, Präprozessor

Mit dem Präprozessor Stylus habe ich im letzten Blog meine Loginseite gestylt. Das Ergebnis sah dann so aus: Stylus an an sich ist schon sehr mächtig. Erweitert man es zusätzlich mit Nib hat man so ziemlich alles an der Hand, was man so braucht um Webseiten sogar Cross-Browserfähig zu gestalten. Installation Um Stylus mitzuteilen, dass es Nib verwenden soll hängt man in der Funktion compile noch ein use(nib()) an das return-Statement mit an.

In der style.styl muss man nur noch die gebrauchten Features einbinden. Für das Augmentieren von Gradienten…read more

0

Mit Stylus Webseiten Stylen

Posted by in CSS, Nodejs, Präprozessor

Wer mein Nodejs-Tutorial aufmerksam gelesen hat (Wer nicht kann das gerne nachholen 😉 ) hat sich sicher schon gefragt, ob ich das so lassen will von der Optik her. Natürlich nicht! Das CSS zu erstellen hätte nur völlig den Rahmen gesprengt. Deswegen hole ich das mit diesem Beitrag nach. Für die CSS-Erstellung sind heutzutage Präprozessoren voll im Trend. Neben Sass, Less und noch ein paar weiteren unbekannteren Vertretern, hat sich für Nodejs Stylus als Quasi-Standard etabliert. Deswegen werde ich auf die ersten Schritte, die mit man so mit Stylus macht…read more

0

Nodejs-Tutorial Teil 8: Benutzer löschen

Posted by in JavaScript, Nodejs

Mit Teil 7 des Tutorials ging es in Windeseile weiter Richtung vollständiger CRUD-Anwendung. Genauso schnell werden wir in diesem Teil das (D)elete implementieren und das Einsteiger Tutorial abschließen. Der Löschbutton Im Template userstart.jade wird ein einfacher Button mit dem Namen Benutzer löschen eingebaut. Dessen Action auf deleteuser zeigt. Das wars auch schon. Keine weitere MAGIC 😉

Die Löschroute In der index.js implementieren wir eine neue Route, die unserem Button zugeordnet wird. Es wird wie im vorherigen Teil zuerst das Benutzerdokument gesucht, das gelöscht werden soll. Wird es in unserer…read more

0

Nodejs-Tutorial Teil 7: Benutzer aktualisieren

Posted by in JavaScript, Nodejs

In Teil 6 haben wir die Funktionalität unserer Applikation um eine Benutzerregistrierung erweitert. In diesem Teil, soll nach dem Login die Email Adresse geändert werden können. Profiltemplate modifizieren Im Profiltemplate soll statt dem hässlichen JSON-String eines Users, der Benutzername und die aktuelle Emailadresse angezeigt werden. Darunter gibt es ein Inputfeld für eine neue Emailadresse. Die Formular-Action zeigt auf die Route updateemail

Änderungsroute implementieren Die Route aktualisiert den Benutzer, falls er in der Datenbank existiert. Hier holt man sich zuerst den User aus der Datenbank und bearbeitet dann das Dokument…read more

0

Nodejs-Tutorial Teil 6: Benutzerregistrierung

Posted by in JavaScript, Nodejs

Da sind wir auch schon bei Teil 6 des Tutorials gelandet, der es Benutzern endlich erlauben soll, sich auch selbst einen Login zu erstellen. In Teil 5 gab es eine große Umbauaktion, mit dem wir eine vernünftige Architektur auf die Beine gestellt haben. Damit kann die Registrierung eines neuen Benutzers relativ schmerzfrei implementiert werden. Los gehts! Template für Benutzerregistrierung Wirklich Besonderes gibts dazu nicht zu sagen, denn es ist eigentlich nur eine Kopie des Logins, die register.jade heißt. Die Form wurde so verändert, dass die action auf die Route register…read more

0

Nodejs-Tutorial Teil 5: Echte Authentifizierung

Posted by in JavaScript, Nodejs

In Teil 4 wurde ein naiver Login erstellt, um zu zeigen, wie man aus der Datenbank MongoDB Daten auslesen kann. In diesem Teil geht es darum, den Code zu einem echten Authentifizierungsverfahren auszubauen. Dazu brauchen wir Passport, das die Referenzimplementierung für diese Aufgabe bereitstellt. Vorbemerkungen Während der Arbeit an der Authentifizierung, bin ich an die Grenzen des Machbaren mit Monk und meiner Architektur gestoßen und habe mich deshalb entschlossen eine MVC-Architektur zu verwenden in Verbindung mit Mongoose. Das Ganze hab ich nach dem Vorbild von diesem Blog gemacht. Modifizierung package.json…read more

0

Nodejs-Tutorial Teil 4: Anbindung des Logins an MongoDB

Posted by in JavaScript, Nodejs

In Teil 3 haben wir uns mit der grundlegenden Funktionalität von Express und Jade beschäftigt und außerdem gelernt, wie man Requests routet. Nachdem wir ein rudimentäres Logintemplate gebaut haben, wollen wir uns natürlich einloggen. Dafür brauchen wir eine Datenbank, die Benutzer speichern kann. Dafür eignet sich MongoDB ganz besonders, da sie komplett auf dem Datenformat JSON aufbaut. Also auf gehts! Was ist MongoDB MongoDB ist ein Vertreter der NoSQL-Zunft und damit in der Lage ohne erzwungenes Schema Daten zu speichern. Was aber nicht heißen muss, dass unsere Daten keine Struktur…read more

0

Nodejs-Tutorial Teil 3: Die Startseite

Posted by in JavaScript, Nodejs

In Teil 2 dieses Tutorials haben wir gesehen, wie alle nötigen Komponenten installiert werden. Im dritten Teil, also diesem, werden wir eine einfache Startseite erstellen, die jedoch noch ohne Funktion sein wird. Unter der Lupe: Die zentrale Datei app.js Die Datei app.js ist das Herz der Applikation. Deswegen wird sie hier Stück für Stück erklärt. Im ersten Teil werden einige Variablen initialisiert, die später noch gebraucht werden. Wichtig sind vor allem die letzten beiden Zeilen in denen die Routen der Webapplikation definiert werden. Für diese App ist nur die erste…read more

0