Kategorien
Allgemein News Soziale Netze

Du Besucher, du!

In den letzten Wochen kam bei einem internen Chat die Frage auf, ob wir hier im Blog Sie, den Besucher, eigentlich mit Sie oder Du anreden wollen.
Die Frage hört sich einfach an, eine Antwort ist aber gar nicht so einfach. Beide Anredeformen haben ihre Vor- und Nachteile.
Nach ausgiebiger Diskussion haben wir uns entschlossen dich, lieber Besucher dieses Blogs, zu duzen!

Wir, das sind übrigens Michael und Hagen und diese beiden wunderbaren Fotos stammen aus unseren privaten Social Network Accounts .
Du siehst also – wir meinen es ernst 🙂 !

Michael Brunner
Michael Brunner
Hagen Graf
Hagen Graf

Übrigens Social Networks: Damit du (und jetzt Luft anhalten und lächeln) „noch besser“ verfolgen kannst, was wir hier bei NovaTrend und auch auch sonst so treiben, hier unsere Twitter Accounts! Und damit gleich klar ist, wo das hinführt: Wenn du uns folgst, werden wir dir auch folgen 🙂


tl;dr: Wir reden jetzt alle mit „Du“ an

Kategorien
Allgemein Groupware Open-Xchange OX

Mehrere E-Mail Accounts in der OX App Suite

Jedem Webhosting Kunden steht die OX App Suite zur Verfügung. Die E-Mail App ist eine zentrale Stelle und man kann sich schnell an die schnörkelose und funktionale Oberfläche gewöhnen. Die E-Mail Adresse ist auch der Einstiegspunkt in die OX App Suite.

Ich nutze die OX App E-Mail beispielsweise für das seafolly.ch Projekt mit meiner seafolly.ch E-Mail Adresse. Ausserdem habe ich noch eine novatrend.ch E-Mail Adresse und ein paar andere projektspezifische E-Mail Adressen.

Die E-Mail App bietet die Möglichkeit mehrere E-Mail Konten zu bündeln.

E-Mail Account hinzufügen

Um einen E-Mail Account hinzuzufügen, klicken Sie einfach auf den Link E-Mail Account hinzufügen.

OX App - E-Mail
OX App – E-Mail

Es öffnet sich ein Formular. Tragen Sie dort Ihre E-Mail Adresse und Ihr Passwort ein. Die E-Mail App bindet nun den Account automatisch ein.

OX App - E-Mail - Account hinzufügen
OX App – E-Mail – Account hinzufügen

Nach der erfolgreichen Einrichtung, wird mir ein zusätzlicher E-Mail Account angezeigt, den ich ganz normal benutzen kann.

OX App - E-Mail - Mehrere Accounts
OX App – E-Mail – Mehrere Accounts

Von welchem Account wird eine neue E-Mail verschickt?

Wenn Sie in dieser Konfiguration E-Mails verschicken, ist der Sender immer das Konto, aus dem Sie die Neue E-Mail verfassen Seite aufgerufen haben. Sie haben aber auf dieser Seite noch die Möglichkeit, den Sender per Dropdown Liste zu wechseln.

OX App - E-Mail - verfassen
OX App – E-Mail – verfassen

E-Mail Account manuell hinzufügen

Falls die automatische Konfiguration nicht fehlerfrei funktioniert, sollten Sie die manuelle Variante ausprobieren. Sie können das entweder direkt über die E-Mail App, wie oben bereits beschrieben, abwickeln oder Sie klicken auf das Zahnrad Icon in der rechten, oberen Ecke und dann auf Einstellungen. In diesem Bereich können Sie alle individuellen Einstellungen verwalten und konfigurieren. Die E-Mail Accounts befinden sich unter dem Punkt Accounts für E-Mail und soziale Netzwerke.

OX App - Einstellungen - Emails und soziale Netzwerke
OX App – Einstellungen – Emails und soziale Netzwerke
Ich möchte beispielsweise eine Google E-Mail Adresse hinzufügen. Dazu klicke ich auf Account hinzufügen und manuell. Im Formular muss ich dann die entsprechen Werte manuell eintragen. Hier die Werte, die für Google Adressen notwendig sind.

  • Posteingangsserver (IMAP) – SSL erforderlich:
    • imap.gmail.com
    • Port: 993
    • SSL erforderlich: Ja
  • Postausgangsserver (SMTP) – TLS erforderlich:
    • smtp.gmail.com
    • Port: 465 oder 587
    • SSL erforderlich: Ja
    • Authentifizierung erforderlich: Ja
    • Gleiche Einstellungen wie für den Posteingangsserver verwenden
  • Vollständiger Name oder Anzeigename: [Ihr Name]
  • Konto- oder Nutzername: Ihre vollständige Gmail-Adresse (nutzername@gmail.com). Google Apps-Nutzer geben bitte nutzername@ihrebeispielurl.de ein.
  • E-Mail-Adresse: Ihre vollständige Gmail-Adresse (nutzername@gmail.com). Google Apps-Nutzer geben bitte nutzername@ihrebeispielurl.de ein.
  • Passwort: Ihr Gmail-Passwort
OX App - E-Mail - Account manuell hinzufügen
OX App – E-Mail – Account manuell hinzufügen

Was ist Unified Mail?

In den Einstellungen der E-Mail Konten können Sie die Checkbox Unified Mail für diesen Account verwenden ankreuzen.

OX App - E-Mail - Unified Mail
OX App – E-Mail – Unified Mail

Alle Accounts, bei denen diese Checkbox aktiviert ist, werden in einem gemeinsamen Posteingangsordner angezeigt. Der neue Ordner wird beim nächsten Login in die OX App erstellt.

In diesem Ordner werden alle eingehenden E-Mails gesammelt. In der Liste ist markiert, an welche E-Mail-Adresse die Nachricht adressiert wurde. Die Standard E-Mail Adresse wird mit als E-Mail vermerkt, weitere E-Mail Konten dann mit Ihrem Namen ausgeführt (hagen@novatrend.ch).

OX App - E-Mail - Unified Mail - Inbox
OX App – E-Mail – Unified Mail – Inbox

Links


tl;dr: Mit der OX App E-Mail können Sie mehrere E-Mail Accounts komfortabel verwalten

Kategorien
Allgemein News Security

Transportverschlüsselung und HTTP/2 für alle – kostenlos!

Seit ein paar Tagen können Sie bei uns kostenlose TLS Zertifikate für Ihre Domain zu erzeugen und einzusetzen.
Diese Art der Verschlüsselung macht es möglich, dass wir Ihnen bei dieser Gelegenheit auch die Nutzung des schnelleren Übertragungsprotokolls HTTPS/2 SPDY anbieten.

Kurz: Ihre Website wird dadurch sicherer UND schneller 🙂

Aber der Reihe nach:

TLS Zertifikate für alle Domains aller Webhosting Kunden

Wie bereits in mehreren Blogposts angesprochen, ist es nun so weit. Die Zertifizierungsstelle Let’s encrypt hat Ihren Betrieb aufgenommen und bietet kostenlose X.509-Zertifikate für Transport Layer Security (TLS) an. Also genau das, was gemeinhin als SSL Zertifikat bezeichnet wird. Wie versprochen (Natürlich wird es kostenlose SSL/TLS Zertifikate geben – auch bei uns 🙂 ) haben wir so schnell wie möglich dieses Feature auch für unsere Webhosting Kunden bereitgestellt.
Innerhalb der Verwaltungsoberfläsche cPanel gibt es dafür im Bereich Sicherheit ein neues Dialog-Icon – Let’s Encrypt SSL.

cPanel - Sicherheit
cPanel – Sicherheit

In unseren FAQ ist detailliert beschrieben, wie Sie sich ein Zertifikat installieren können (Wie kann ich ein kostenloses Let’s Encrypt Zertifikat installieren?).
Das Zertifikat wird nach Ablauf automatisch für Sie verlängert und bietet handfeste Vorteile:

  1. Der Datenverkehr zwischen dem Browser eines Besuchers und Ihrer Website ist verschlüsselt und erhöht so die Sicherheit bei der Übermittlung von privaten Daten wie beispielsweise Passwörtern und Zahlungsinformationen.
  2. Verschlüsselter Datenverkehr erhöht allgemein das Vertrauen Ihrer Kunden in die Sicherheit Ihrer Website
  3. Für die Benutzung eines SSL-Zertifikats gibt es im Ranking Faktor Ihrer Website bei Google einen Bonus.

HTTP/2 – was ist das?

Das Hypertext Transfer Protokoll (HTTP) ist ein zustandsloses Protokoll und wird hauptsächlich dazu eingesetzt Websites von einem Server zu laden. Das Wort zustandlos beschreibt auch gleich das grösste Problem bei der Kommunikation. Bei jeder neuen Anfrage muss die Verbindung neu „ausgehandelt“ werden. Das kostet Zeit und Ressourcen. Hier ein Beispiel aus dem Leben.

Mein Browser auf meinem PC spricht HTTP in der Version 1.1 und fragt den Host mit dem Namen serverblogger.ch nach seiner Seite (GET / HTTP/1.1 …). Dabei schickt mein Browser alle möglichen Informationen mit. Diese Informationen enthalten beispielsweise den Typ des Browsers (user-agent), die Art des gewünschten Dokuments (Accept), die bevorzugte Sprache (Accept-Language) und weitere Informationen. Diese Daten sind unverschlüsselt und werden an den Webserver geschickt.

GET / HTTP/1.1
Host: serverblogger.ch
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.11; rv:42.0) Gecko/20100101 Firefox/42.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: en-US,en;q=0.5
Accept-Encoding: gzip, deflate
Connection: keep-alive
Pragma: no-cache
Cache-Control: no-cache

Der Server antwortet (HTTP/1.1 200 OK) und schickt seinerseits (je nach Konfiguration) alle möglichen Daten mit. Der Webserver ist ein Apache, Betriebssystem ist Ubuntu, etc.

HTTP/1.1 200 OK
Date: Fri, 18 Dec 2015 14:49:43 GMT
Server: Apache/2.4.7 (Ubuntu)
X-Powered-By: PHP/5.5.9-1ubuntu4.14
Vary: Accept-Encoding
Content-Encoding: gzip
Content-Length: 105
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
Content-Type: text/html

Nach diesen „Headern“ wird dann der eigentliche Text der Website übertragen, den der Browser dann entsprechend darstellt. Das Beispiel stammt von unserem Testserver, den wir für die Artikel des Blogs nutzen.

Hier ein weiteres Beispiel von der aktuellen novatrend.ch Website.

Die Anfrage meines Browser ist die gleiche, die Antwort des Servers ist aber unterschiedlich:

GET /de/ HTTP/1.1
Host: www.novatrend.ch
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.11; rv:42.0) Gecko/20100101 Firefox/42.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: en-US,en;q=0.5
Accept-Encoding: gzip, deflate
Connection: keep-alive
Cache-Control: max-age=0

Mein Browser bietet als Protokoll HTTP/1.1 an, der Server antwortet jedoch mit HTTP/2.0. Als Server wird nicht Apache, sondern LiteSpeed benutzt und als letzter „Header“ wird noch ein X-Firefox-Spdy Wert mitgegeben. Der Server hat also bemerkt, dass ich den Firefox Browser benutze und entsprechend darauf reagiert. Je nach Website wird mehrmals nachgefragt, um alle Grafiken, CSS Dateien und was es zum Aufbau der Site benötigt, herunterzuladen.

HTTP/2.0 200 OK
Cache-Control: no-store, no-cache, must-revalidate, post-check=0, pre-check=0
Pragma: no-cache
Content-Type: text/html; charset=utf-8
Content-Encoding: gzip
Vary: Accept-Encoding
Date: Fri, 18 Dec 2015 15:04:30 GMT
Accept-Ranges: bytes
Server: LiteSpeed
X-Firefox-Spdy: h2

Nun sind wir in der Welt der vielen Protokolle angekommen und müssen etwas genauer hinsehen:

HTTP ist ein zustandloses Protokol, das jede Verbindung zwischen Client und Server neu aushandelt. Um das zu vereinfachen erfand man Cookies und Session-Ids und der Server seinerseits versucht mittels den Keep-Alive Einstellungen eine Verbindung so lange wie möglich „offen zu halten“. In Cookies und Sessions-IDs stecken jedoch hoch interessante Daten und viele offene Verbindungen machen den Server langsam, füllen dessen Speicher und machen ihn anfällig für Szenarien, bei denen ein Client nur eine GET Anfrage schickt aber nicht weiter kommuniziert. HTTPS ist die sichere Variante von HTTP, die noch einmal mehr Informationen hin und her schickt um eine verschlüsselte Verbindung zu ermöglichen.

HTTP/2 ist abwärtskompatibel zu HTTP1.1 und soll alles besser machen. Client Anfragen können zusammengefasst werden, Daten und andere Inhalte können binär kodiert und komprimiert übertragen werden und der Server kann selbst Datenübertragungen initieren (PUSH). Gerade das letzte Feature ist sehr hilfreich bei Web-Applikationen. HTTP/2 wurde massgeblich von Google (SPDY) und Microsoft (HTTP Speed) initiert. Googles SPDY setzte sich dann durch. Die Abkürzung SPDY steht übrigens für speedy, also schnell :).

Ursprünglich war geplant, das HTTP/2 standardmässig TLS, also verschlüsselte Verbindungen mit SSL Zertifikaten, nutzt. Im finalen Entwurf entfiel diese Option allerdings. Der Geschwindigkeitsvorteil des Protokolls wird in erster Linie über das Zusammenfassen von Anfragen erreicht.

Google (Chrome) und Mozilla (Firefox) kündigten jedoch an, HTTP/2 nicht ohne Verschlüsselung nutzen zu wollen und implementierten Googles SPDY in die Browser. Wenn nun ein Webserver wie Litespeed diese Technik mittels des Headers X-Firefox-Spdy: h2 anbietet, so nutzt der Firefox Browser das HTTP/2 Protokoll (für Chrome gibt es einen entsprechenden Header).

SPDY sorgt, wie der Name vermuten lässt, für eine Beschleunigung der verschlüsselten Kommunikation, verglichen mit dem HTTPS Protokoll. Die Kommunikation gesicherter Verbindungen wird „vereinfacht“ in dem die Wege der Datenpakete optimiert werden. Dadurch werden verschlüsselte Verbindungen ähnlich schnell wie unverschlüsselte Verbindungen.

An dieser Stelle kann man auch nachvollzieghen, warum Google verschlüsselten Verbindungen einen kleinen Bonus auf den Page Rank gibt. Zum einen setzt sich dadurch verschlüsselte Kommunikation schneller durch und zum anderen wird der Geschwindigkeitsnachteil ausgeglichen.

Im nächsten Schritt soll SPDY ebenfalls ein Standard werden. Der heisst dann Application-Layer Protocol Negotiation oder kurz ALPN und stellt eine Erweiterung von TLS dar.

Die HTTP Befehle zwischen Ihrem Browser und einem beliebigen Server lassen sich übrigens mit dem Live HTTP Headers Add-On für Firefox und Chrome beobachten.

Fazit

Auch wenn das jetzt vielleicht ein wenig zu technisch war, so bleiben hoffentlich zwei Dinge im Gedächtnis:
Ihre Website bei uns ist jetzt SICHERER und SCHNELLER 🙂

Links:


tl;dr: Novatrend bietet kostenlose TLS Zertifikate für Ihre Website und liefert sie mittels HTTP/2 aus. Das macht Ihre Website sicherer und schneller.

Kategorien
Allgemein Server

Manchmal braucht man einen FTP Server

Das File Transfer Protokoll (FTP) ist in diesem Jahr 30 Jahre alt geworden. Es ist nach wie vor ein gebräuchliches Protokoll um Dateien auf einen Server zu laden. Wenn Sie jemals ein Webhosting auf einem Server betrieben haben (oder auch heute noch betreiben), so sind Sie mit FTP schon mal in Kontakt gekommen. Sie erhalten vom Betreiber des FTP Services normalerweise einen Benutzernamen, ein Passwort und die IP-Adresse des Servers (oder einen Domainnamen wie ftp.ihredomain.ch). Damit haben Sie dann über einen Client wie FileZilla Zugriff auf die Festplatte des Servers.

Sie können eine FTP Verbindung auch als Erweiterung der Festplatte in Windows, Mac OS X und in Linux benutzen. Als Anbieter des Services können Sie per FTP Dateien zum Download anbieten. Selbst mit einem normalen Internetbrowser können Sie per FTP auf Verzeichnisse des Servers zugreifen.

Sie können auch einen FTP Server anbieten, mit dem sich anonyme Nutzer verbinden und Dateien speichern und laden können.

Die Daten werden beim herkömmlichen FTP unverschlüsselt übertragen!

In der Anfangszeit des Internet war FTP quasi das, was heute unter dem Begriff „Cloud“ läuft. Oftmals werden auch heute noch Backups per FTP auf entfernte Server übertragen.

Vor etwa 15 Jahre begann man sich aus Sicherheitsgründen Gedanken über eine Verschlüsselung des Protokolls zu machen und kombinierte das SSH Protokol mit dem FTP zu SFTP. Das SSH Protokoll nutzt die Public Key Verschlüsselung, d.h. der Anbieter des SFTP-Services muss sich einen öffentlichen Schlüssel erzeugen und dem Client bereitstellen.

Wenn Sie „nur“ Kunde eines solchen SFTP-Services sind, wie beispielsweise unsere Webhosting Kunden, können Sie die Verschlüsselung (SSH/TLS) erkennen, wenn Sie sich per FileZilla verbinden.

Status: Resolving address of ftp.seafolly.ch
Status: Connecting to 194.150.248.132:21...
Status: Connection established, waiting for welcome message...
Status: Initializing TLS...
Status: Verifying certificate...
Status: TLS connection established.
Status: Connected
Status: Retrieving directory listing...
Status: Directory listing of "/" successful

Wenn Sie einen Root-Server betreiben, so kommt es auf Ihre Konfiguration an, ob bereits ein FTP-Server vorhanden ist. Wenn Sie, so wie ich, eine Ubuntu-Server Distribution verwenden, dann ist dort kein FTP Server installiert. Oftmals benötigt man gar keinen FTP-Zugriff auf dem eigenen Server aber manchmal eben doch.

Um nun keine ganz groben Fehler bei der Installation zu machen, möchte Ich Ihnen heute die Installation und Konfiguration des vsftpd vorstellen. vsftpd steht für very secure file transfer protocoll daemon also so etwa genau das, was wir gerne hätten. Der Slogan des Projekt ist ganz bescheiden

Probably the most secure and fastest FTP server for UNIX-like systems.

Installation unter Ubuntu 14.04

Die grundsätzlich Installation geht leicht von der Hand

sudo apt-get install vsftpd

Der Server ist nun installiert, benutzt die Standardkonfiguration und „läuft“.

Alle im System User können sich nun anmelden und Dateien aus Ihrem /home Verzeichnis herunterladen. Sie dürfen aber keine Daten schreiben! Der Datenverkehr findet auch ganz klassisch unverschlüsselt statt und daher müssen Sie die Datei /etc/vsftpd.conf nach Ihren Befürfnissen konfigurieren. Mit dem Befehl

sudo nano /etc/vsftpd.conf

rufen Sie die Datei auf und nach dem Speichern müssen Sie mit dem Befehl

sudo restart vsftpd

den FTP-Server neu starten. Die Konfigurationsdatei ist sehr gut kommentiert, so dass die meisten Einstellungen selbsterklärend sind. Die meisten Befehle stehen auskommentiert mit einem Kommentar versuehen bereits in der Datei. Sie müssen nur noch das #-Zeichen davor entfernen. Die aus meiner Sicht wichtigsten Änderungen sind folgende:

Nutzer sollen auch schreiben können

write_enable=YES

Nutzer sollen ihr /home Verzeichnis nicht verlassen können

chroot_local_user=YES

Nicht alle Nutzer sollen FTP Zugriff erhalten.
Dazu schreiben wir die Namen der Nutzer, die Zugriff erhalten sollen, in die Datei /etc/vsftpd.chroot_list (pro Zeile ein User Name).

chroot_list_enable=YES
chroot_list_file=/etc/vsftpd.chroot_list

Verschlüsselung

Die einfachste Art eine Verschlüsselung einzurichten besteht im FTPS Protokoll. Beim SFTP Protokoll muss eine eigene Datei mit FTP Usern gepflegt werden. Dabei können auch User sein, die über keinen System User Account verfügen und damit auch kein Home Verzeichnis haben. Ich gehe hier davon aus, dass jeder FTP User auch System User ist und das wir uns ein Zertifikat selbst erzeugen.

In der /etc/vsftpd.conf müssen Sie dann die folgenden Befehle auskommentieren bzw. eintragen

ssl_enable=Yes
rsa_cert_file=/etc/ssl/certs/ssl-cert-snakeoil.pem
rsa_private_key_file=/etc/ssl/private/ssl-cert-snakeoil.key

Die Zertifikate sind auf Ihrem System bereits installiert und sind selbstsigniert (daher der Name snakeoil). Es ist für die Nutzer nicht überprüfbar, ob das Zertifikat vertrauenswürdig ist, weil es selbst erstellt ist. Wenn Sie aber Ihre FTP User kennen und die Sie auch, dann spielt dieser Punkt keine Rolle, denn die Verschlüsselung funktioniert technisch genau wie bei einem „bestätigten“ Zertifikat.

Wenn Sie nun den FTP-Server neu starten und sich beispielsweise mit FileZilla verbinden, so erhalten Sie eine solche Nachricht:

Selbst signiertes Zertifikat
Selbst signiertes Zertifikat
Sie können die Meldung mit ok bestätigen und Ihr „sicherer“ FTP Server funktioniert nun.

Einen interessanten Artikel zum Thema AES finden Sie hier: AES – die Geschichte eines Standards

 

Links

https://help.ubuntu.com/lts/serverguide/ftp-server.html

https://security.appspot.com/vsftpd.html


tl;dr: Ein FTP Server ist manchmal praktisch und kann auch sicher sein

Kategorien
Allgemein Shared Hosting

Laravel Framework im Webhosting Paket nutzen

Laravel ist ein PHP-basiertes Free and Open Source Framework mit dem man Web-Applikationen entwickeln kann.
Der Slogan von Laravel ist

The PHP Framework for web artisans

Laravel gilt momentan als eines der populärsten PHP-Frameworks. Es versucht, Ideen aus Ruby on Rails und .NET in die PHP Welt zu bringen und macht damit den PHP Code sauberer und strukturierter. Interessante Features von Laravel in diesem Zusammenhang:

  • Laravel nutzt das Model, View, Controller Modell
  • Es nutzt die PHP Paketverwaltung Composer
  • Eloquent ORM ist eine PHP Implementierung des Active Record Entwurfsmusters. Es repräsentiert Datenbanktabellen als Klassen und erlaubt dadurch beispielweise Datenbankabfragen „einfach“ zu programmieren. Wenn am entsprechenden Objekt etwas geändert wird, wird es auch in der Datenbanktabelle geändert.
  • Blade ist eine sehr übersichtliche und leistungsfähige Template Engine.
  • Migrations ist ein Versionskontrollsystem für Datenbankstrukturen und erleichtert das Deployment.
  • Das Artisan Kommandozeilentool bietet viele Befehle, die den Umgang mit Laravel erleichtern, um beispielsweise Update und Migrationsprozesse zu managen. Unit Tests sind ein fester Bestandteil des Frameworks und können über Artisan ausgeführt werden.

Es gibt zahlreiche weitere Features, die Sie so nach und nach entdecken und nutzen können.
Und das Beste: Laravel lässt sich in einem „normalen“ Webhosting Paket von Novatrend per Installatron installieren.

Installation Laravel

Rufen Sie in der cPanel Verwaltung das Installatron auf und wählen Laravel aus.

ACHTUNG: Seit November 2017 benutzen wir anstelle des Installatrons das Tool Softaculous. Im Beitrag Automatisierte Installation mit Softaculous beschreibe ich die grundlegenden Vorgehensweisen.

cPanel - Installatron - Laravel Framework
cPanel – Installatron – Laravel Framework

Installieren Sie Laravel in einem eigenen Verzeichnis. Dieses Verzeichnis wird unterhalb des public_html Verzeichnisses angelegt und je nach Verwendungszweck können Sie Ihre Domain auf dieses Verzeichnis zeigen lassen.

cPanel - Installatron - Laravel Framework - Konfiguration
cPanel – Installatron – Laravel Framework – Konfiguration

Wenn Sie nun im Browser http://ihre-domain/ihr-verzeichnis aufrufen, so sehen Sie die Default Seite des Laravel Frameworks.

Laravel 5 - Startscreen
Laravel 5 – Startscreen

Loggen Sie sich nun mittels SSL auf der Konsole ein (siehe dazu auch Root-Server – ich bin drin) und wechseln Sie in das Unterverzeichnis /public_html/laravel. Lassen Sie sich die installierten Dateien mit dem Befehl ls -l anzeigen, um einen Überblick zu erhalten. Das Ansehen der Dateien können Sie auch per FTP machen. Mit einer SSL Verbindung können Sie allerdings auch Kommandos ausführen.

seafoll1@srv11 [~/public_html/laravel]# ls -l
total 204
drwxr-xr-x 11 seafoll1 seafoll1   4096 Oct 26 15:13 ./
drwxr-x--- 10 seafoll1 nobody     4096 Oct 26 16:55 ../
-rw-r--r--  1 seafoll1 seafoll1    351 Oct 26 15:13 .env
-rw-r--r--  1 seafoll1 seafoll1    307 Aug 30 13:31 .env.example
-rw-r--r--  1 seafoll1 seafoll1     61 Aug 30 13:31 .gitattributes
-rw-r--r--  1 seafoll1 seafoll1     57 Aug 30 13:31 .gitignore
-rw-r--r--  1 seafoll1 seafoll1     76 Oct 26 15:13 .htaccess
drwxr-xr-x 10 seafoll1 seafoll1   4096 Aug 30 13:31 app/
-rw-r--r--  1 seafoll1 seafoll1   1646 Aug 30 13:31 artisan
drwxr-xr-x  3 seafoll1 seafoll1   4096 Aug 30 13:31 bootstrap/
-rw-r--r--  1 seafoll1 seafoll1   1201 Aug 30 13:31 composer.json
-rw-r--r--  1 seafoll1 seafoll1 105047 Sep  2 10:08 composer.lock
drwxr-xr-x  2 seafoll1 seafoll1   4096 Aug 30 13:31 config/
drwxr-xr-x  5 seafoll1 seafoll1   4096 Aug 30 13:31 database/
-rw-r--r--  1 seafoll1 seafoll1    503 Aug 30 13:31 gulpfile.js
-rw-r--r--  1 seafoll1 seafoll1   1780 Oct 26 15:13 index.php
-rw-r--r--  1 seafoll1 seafoll1    159 Aug 30 13:31 package.json
-rw-r--r--  1 seafoll1 seafoll1     87 Aug 30 13:31 phpspec.yml
-rw-r--r--  1 seafoll1 seafoll1    899 Aug 30 13:31 phpunit.xml
drwxr-xr-x  2 seafoll1 seafoll1   4096 Aug 30 13:31 public/
-rw-r--r--  1 seafoll1 seafoll1   1928 Aug 30 13:31 readme.md
drwxr-xr-x  5 seafoll1 seafoll1   4096 Aug 30 13:31 resources/
-rw-r--r--  1 seafoll1 seafoll1    567 Aug 30 13:31 server.php
drwxr-xr-x  5 seafoll1 seafoll1   4096 Aug 30 13:31 storage/
drwxr-xr-x  2 seafoll1 seafoll1   4096 Aug 30 13:31 tests/
drwxr-xr-x 28 seafoll1 seafoll1   4096 Sep  2 10:08 vendor/

Laravel hat ein Command-line Interface namens Artisan. Es beschleunigt viele Arbeiten enorm. Rufen Sie es auf und schauen Sie die Befehle durch.

seafoll1@srv11 [~/public_html/laravel]# php artisan
Laravel Framework version 5.1.12 (LTS)
...
...
...

Erste Schritte

Ich zeige ein kleines Beispiel, um Ihnen den Einstieg in Laravel zu erleichtern.

Ich möchte gern aus dem Bootstrap CSS Framework ein Layout nutzen und Laravel soll den Inhalt dafür erzeugen. Das ist das Prinzip eines jeden Content Management Systems und kann beliebig um Formulare, Benutzerregistrierungen und viele andere Dinge erweitert werden. Das Beispiel ist ein kleiner Teil des Laravel Anfänger Tutorials von Dirk Helbert. In seinem Blog finden Sie weitere Beispiele.

Worum geht es?

In diesem Beispiel arbeiten wir mit der Blade Template Engine.

Aus dem Verzeichnis /public wird Ihre Webapplikation gestartet. Nach der Laravel Installation finden Sie dort unter anderem die index.php Datei, die als Einstieg für Ihre Webapplikation fungiert. In diesem Verzeichnis befinden sich auch alle öffentlichen Resourcen, wie Grafiken und CSS Dateien.

Die Datei, die die Informationen (HTML Code) für die Laravel Startseite enthält, liegt im Ordner /resources/views und heisst welcome.blade.php.

Wir wollen diese Datei verändern (mit den Daten aus dem Bootstrap Beispiel) und dann eine neue Datei namens app.blade.php erzeugen, die das Layout enthält. Nach den Änderungen sieht die Startseite dann etwa so aus:

Beispielseite basierend auf Bootstrap
Beispielseite basierend auf Bootstrap

Bootstrap Code

Laden Sie zunächst das Bootstrap Source Code Paket von der Downloadseite (http://getbootstrap.com/getting-started/#download)

Bootstrap - Download
Bootstrap – Download

Legen Sie im Laravel Verzeichnis public ein Unterverzeichnis bootstrap an und kopieren Sie dort den Inhalt aus dem Bootstrap Verzeichnis dist hinein. Die Verzeichnisstruktur sieht dann so aus:

public/bootstrap/css   //mehrere Dateien
public/bootstrap/fonts //mehrere Dateien
public/bootstrap/js    //mehrere Dateien

Legen Sie im Laravel Verzeichnis public ein weiteres Verzeichnis mit dem Namen css an. Kopieren Sie die Datei sticky-footer-navbar.css aus dem Bootstrap Verzeichnis docs/examples/sticky-footer-navbar in das Laravel Verzeichnis public/css und benennen Sie sie um in style.css.

public/css/style.css   //die umbenannte sticky-footer-navbar.css

Wechseln Sie nun in das Laravel Verzeichnis resources/views. Kopieren Sie die Datei index.html aus dem Bootstrap Verzeichnis docs/examples/sticky-footer-navbar in das Laravel Verzeichnis resources/views und benennen Sie sie um in app.blade.php.

resources/views/app.blade.php //die umbenannte index.html

Passen Sie die ../.. Pfade zu den Bootstrap-Dateien im HTML Code der app.blade.php auf Ihr Dateisystem an, fügen Sie den Verweis auf die Stylesheet Datei ein (und vergessen Sie auch die JavaScript Dateipfade am Ende der Datei nicht 🙂 )

<!-- Bootstrap core CSS -->
<link href="public/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="public/css/style.css" rel="stylesheet">
...
...
<script src="public/bootstrap/js/bootstrap.min.js"></script>

Nach dem Kommentar <!– Begin page content –> befindet sich ein div Tag mit der Klasse Container. Enfernen Sie den Inhalt zwischen dem öffnenden und schliessendem div Tag und fügen stattdessen den Befehl @yield(‚content‘) ein. Der Befehl fügt später den gewünschten Inhalt ein. Die Datei enthält nun das Layout, der eigentliche Inhalt kommt aus einer anderen Quelle hinzu.

...
<!-- Begin page content -->
<div class="container">
   @yield('content')
</div>
...

Die Quelle des Inhalts befindet sich in der Datei welcome.blade.php. Löschen Sie den bestehenden Inhalt und fügen Sie folgenden Code ein:

@extends('app')
@section('content')
<div class="page-header">
  <h1>Inhalt aus der <code>welcome.blade.php</code> Datei</h1>
</div>
<p class="lead">Beispieltext ...</p>
@endsection

Datei: welcome.blade.php

Der Code ist recht selbsterklärend und lässt ein wenig die Faszination von Laravel erahnen. Der Befehl @extends(‚app‘) erweitert die app.blade.php um den Text zwischen @section(‚content‘) und @endsection. Hier nochmal der genaue Verezichnispfad für diese Datei:

resources/views/welcome.blade.php

Wenn Sie nun die Startseite von Laravel im Browser aufrufen, sieht sie folgendmassen aus:

Beispielseite basierend auf Bootstrap
Beispielseite basierend auf Bootstrap

Genauso elegant wie in der Template Engine lassen sich nun andere Teile Ihrer Site aufbauen (Navigation, Benutzeranmeldung, Datenbankverbindungen, etc). Falls Sie bereits Erfahrungen mit PHP haben, sollten Sie sich Laravel unbedingt ansehen.

Links:


tl;dr: Wenn Sie bereits ein wenig Erfahrung mit PHP haben, werden Sie an Laravel viel Freude haben!