Laravel - Ansichten: Ein Anfängerleitfaden

Hallo da draußen, zukünftige Laravel-Entwickler! Heute tauchen wir in einen der aufregendsten Teile von Laravel ein - Ansichten (Views). Machen Sie sich keine Sorgen, wenn Sie noch nie kodiert haben; ich werde Sie Schritt für Schritt durch alles führen. Am Ende dieses Tutorials werden Sie wunderschöne Webseiten wie ein Profi erstellen können!

Laravel - Views

Was sind Ansichten?

Ansichten in Laravel sind wie das hübsche Gesicht Ihrer Anwendung. Sie sind verantwortlich für das, was Ihre Benutzer tatsächlich sehen, wenn sie Ihre Webseite besuchen. Stellen Sie sich Ansichten als HTML-Vorlagen vor, die Ihre Daten auf eine benutzerfreundliche Weise präsentieren.

Erstellung Ihrer ersten Ansicht

Lassen Sie mit einem einfachen Beispiel beginnen. Stellen wir uns vor, wir möchten eine Willkommensseite für unsere Webseite erstellen. So machen wir das:

Navigieren Sie zum Verzeichnis resources/views in Ihrem Laravel-Projekt.
Erstellen Sie eine neue Datei namens welcome.blade.php.
Fügen Sie den folgenden Code hinzu:

<!DOCTYPE html>
<html>
<head>
<title>Willkommen auf meiner Seite</title>
</head>
<body>
<h1>Hallo, Welt!</h1>
<p>Willkommen auf meiner tollen Laravel-Webseite.</p>
</body>
</html>

Dies ist eine grundlegende HTML-Struktur mit einer warmen Willkommensnachricht. Die Erweiterung .blade.php weist Laravel an, seinen Vorlagenmotor Blade zu verwenden, den wir später genauer erkunden werden.

Rendern der Ansicht

Nun, da wir unsere Ansicht haben, lassen Sie uns anzeigen, wenn jemand Ihre Webseite besucht. Fügen Sie in Ihrer routes/web.php Datei den folgenden Code hinzu:

Route::get('/', function () {
return view('welcome');
});

Dies weist Laravel an: "Wenn jemand die Startseite besucht, zeigen Sie ihnen die 'welcome' Ansicht."

Daten an Ansichten übergeben

Ansichten sind großartig, aber sie werden wirklich mächtig, wenn wir dynamische Daten in sie einfügen können. Lassen Sie uns sehen, wie wir das machen können.

Einfaches Übergeben von Daten

Stellen wir uns vor, wir möchten unsere Willkommensnachricht personalisieren. Wir können Daten an unsere Ansicht wie folgt übergeben:

Route::get('/', function () {
$name = "Sarah";
return view('welcome', ['name' => $name]);
});

Jetzt aktualisieren wir unsere welcome.blade.php, um diese Daten zu verwenden:

<!DOCTYPE html>
<html>
<head>
<title>Willkommen auf meiner Seite</title>
</head>
<body>
<h1>Hallo, {{ $name }}!</h1>
<p>Willkommen auf meiner tollen Laravel-Webseite.</p>
</body>
</html>

Die Syntax {{ $name }} ist die Art und Weise von Blade, Daten auszugeben. Wenn Sie die Seite jetzt besuchen, sehen Sie "Hallo, Sarah!" anstelle von "Hallo, Welt!".

Übergeben mehrerer Variablen

Wir können so viele Variablen übergeben, wie wir benötigen. Lassen Sie uns ein paar mehr hinzufügen:

Route::get('/', function () {
$data = [
'name' => "Sarah",
'age' => 28,
'hobbies' => ['Lesen', 'Programmieren', 'Wandern']
];
return view('welcome', $data);
});

Und aktualisieren unsere Ansicht:

<!DOCTYPE html>
<html>
<head>
<title>Willkommen auf meiner Seite</title>
</head>
<body>
<h1>Hallo, {{ $name }}!</h1>
<p>Willkommen auf meiner tollen Laravel-Webseite.</p>
<p>Sie sind {{ $age }} Jahre alt.</p>
<p>Ihre Hobbys sind:</p>
<ul>
@foreach($hobbies as $hobby)
<li>{{ $hobby }}</li>
@endforeach
</ul>
</body>
</html>

Hier haben wir die Blade-Direktive @foreach eingeführt, um durch das Hobbys-Array zu iterieren. Blade macht es super einfach, mit Daten in Ihren Ansichten zu arbeiten!

Daten an alle Ansichten übergeben

Manchmal möchten Sie bestimmte Daten an alle Ansichten in Ihrer Anwendung übergeben. Zum Beispiel möchten Sie möglicherweise den Namen des aktuellen Benutzers in der Navigationsleiste auf jeder Seite anzeigen.

Verwenden von View Composers

Laravel bietet eine Funktion namens View Composers für diesen Zweck. So verwenden Sie sie:

Erstellen Sie eine neue Datei app/Providers/ViewServiceProvider.php (falls sie noch nicht existiert).
Fügen Sie den folgenden Code hinzu:

<?php

namespace App\Providers;

use Illuminate\Support\ServiceProvider;
use Illuminate\Support\Facades\View;

class ViewServiceProvider extends ServiceProvider
{
public function boot()
{
View::composer('*', function ($view) {
$view->with('currentUser', 'John Doe');
});
}
}

Registrieren Sie diesen Anbieter in config/app.php:

'providers' => [
// Andere Anbieter...
App\Providers\ViewServiceProvider::class,
],

Jetzt ist $currentUser in allen Ihren Ansichten verfügbar!

Fazit

Ansichten sind das Herzstück der Benutzeroberfläche Ihrer Laravel-Anwendung. Sie ermöglichen es Ihnen, Ihre Präsentationslogik von Ihrer Geschäftslogik zu trennen, was Ihren Code sauberer und wartbarer macht. Denken Sie daran, dass Übung den Meister macht, also fürchten Sie sich nicht, verschiedene Layouts und Datenübergabetechniken auszuprobieren!

Hier ist eine schnelle Referenztabelle der Methoden, die wir behandelt haben:

Methode	Beschreibung
`view('name')`	Gibt eine Ansicht zurück
`view('name', ['key' => 'value'])`	Gibt eine Ansicht mit Daten zurück
`View::composer('*', function)`	Gibt Daten an alle Ansichten weiter

Frohes Coden und möge Ihre Ansichten stets atemberaubend sein! ?

Credits: Image by storyset

Vorheriges Tutorial:

Laravel - Antwort

Nächstes Tutorial:

Laravel - Blade-Vorlagen