Tutorial Laravel: Creare la Tua Prima Pagina Iniziale

Introduzione

Ciao là, futuri sviluppatori web! Sono entusiasta di essere il tuo guida in questo emozionante viaggio nel mondo di Laravel. Come qualcuno che ha insegnato scienze informatiche per oltre un decennio, posso dirti che Laravel è uno dei framework più potenti e piacevoli con cui lavorare. Oggi, creeremo la nostra prima pagina iniziale utilizzando Laravel. Non preoccuparti se non hai mai programmato prima – faremo tutto passo per passo, e prima di sapere, sarai in grado di creare bellissime pagine web come un professionista!

Laravel - Home

Cos'è Laravel?

Prima di immergerci, parliamo rapidamente di cosa sia effettivamente Laravel. Immagina di stanno costruendo una casa. Laravel è come il tuo fidato cassetto degli attrezzi, pieno di strumenti utili che rendono il lavoro più facile e veloce. È un framework PHP che aiuta gli sviluppatori a creare applicazioni web senza reinventare la ruota ogni volta. È come avere una serie di piece preassemblate di Lego che puoi unire per creare qualcosa di straordinario!

Prerequisiti

Per seguire questo tutorial, avrai bisogno di:

Un computer (ovviamente!)
PHP installato sul tuo computer (versione 7.3 o superiore)
Composer (un gestore di dipendenze PHP)
Un editor di testo (ti consiglio Visual Studio Code, ma usa ciò con cui sei a tuo agio)
Un senso di avventura e la volontà di imparare!

Non preoccuparti se non hai ancora configurato questi elementi. Ci sono molti tutorial fantastici là fuori per aiutarti a preparare il tuo ambiente.

Configurare Laravel

Passo 1: Installare Laravel

Prima di tutto, installiamo Laravel. Apri il tuo terminale (non aver paura, è solo un modo testuale per parlare con il tuo computer) e digita:

composer create-project --prefer-dist laravel/laravel my-first-laravel-project

Questo comando dice a Composer di creare un nuovo progetto Laravel in una cartella chiamata my-first-laravel-project. Potrebbe volerci qualche minuto, quindi magari prenditi un caffè o fai una piccola danza mentre aspetti.

Passo 2: Navigare nel Tuo Progetto

Una volta fatto, spostiamoci nella nostra nuova cartella del progetto:

cd my-first-laravel-project

Congratulazioni! Ora sei nel tuo primo progetto Laravel. Sembra bello, vero?

Creare la Tua Pagina Iniziale

Passo 3: Comprendere le Rotte

In Laravel, le rotte sono come la receptionist della tua applicazione. Decidono dove i visitatori dovrebbero andare quando arrivano sul tuo sito web. Apriamo il file routes/web.php. Qui diremo a Laravel cosa fare quando qualcuno visita la nostra pagina iniziale.

Vedrai qualcosa del genere:

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

Questa è la rotta predefinita di Laravel. Dice, "Quando qualcuno visita la radice del nostro sito web ('/'), mostra loro la vista 'welcome'." Ma vogliamo creare la nostra pagina iniziale, quindi cambiamo un po' le cose!

Passo 4: Creare un Controller

I controller sono come i manager della tua applicazione. Gestiscono le richieste e restituiscono le risposte. Creiamo uno per la nostra pagina iniziale:

php artisan make:controller HomeController

Questo comando crea un nuovo file in app/Http/Controllers/HomeController.php. Aprielo e aggiungiamo un metodo:

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

class HomeController extends Controller
{
public function index()
{
return view('home');
}
}

Questo metodo index sarà responsabile di mostrare la nostra pagina iniziale.

Passo 5: Aggiornare la Rotta

Ora aggiorniamo il nostro file routes/web.php per utilizzare il nostro nuovo controller:

use App\Http\Controllers\HomeController;

Route::get('/', [HomeController::class, 'index']);

Questo dice a Laravel, "Quando qualcuno visita '/', usa il metodo index del HomeController."

Passo 6: Creare la Vista

Ora dobbiamo creare l'HTML della nostra pagina iniziale. Creiamo un nuovo file in resources/views/home.blade.php e aggiungiamo del HTML:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Welcome to My First Laravel Site!</title>
</head>
<body>
<h1>Hello, Laravel World!</h1>
<p>This is my very first Laravel home page. Exciting times!</p>
</body>
</html>

Passo 7: Eseguire la Tua Applicazione

Ora il momento della verità! Nel tuo terminale, esegui:

php artisan serve

Questo avvia un server di sviluppo. Apri il tuo browser e vai a http://localhost:8000. Dovresti vedere la tua nuova pagina iniziale!

Aggiungere Qualcosa di Speciale

Passo 8: Utilizzare i Template Blade

Laravel utilizza un motore di template chiamato Blade. È come HTML con superpoteri. Aggiorniamo il nostro home.blade.php per utilizzare alcune funzionalità di Blade:

@extends('layouts.app')

@section('content')
<h1>Welcome to {{ config('app.name') }}!</h1>
<p>The current time is {{ now() }}.</p>
@endsection

Ora creiamo un nuovo file in resources/views/layouts/app.blade.php:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>@yield('title', config('app.name'))</title>
</head>
<body>
@yield('content')
</body>
</html>

Questo crea un layout riutilizzabile che la nostra pagina iniziale (e future pagine) possono utilizzare.

Conclusione

Ecco fatto! Hai creato la tua prima pagina iniziale con Laravel. Abbiamo coperto molto terreno - dalla configurazione di Laravel alla creazione di rotte, controller e viste. Ricorda, imparare a programmare è un viaggio, non una destinazione. Continua a praticare, esplorare e, soprattutto, divertirti!

Ecco una tabella di riepilogo dei principali concetti Laravel che abbiamo coperto:

Concetto	Descrizione
Rotte	Definiscono le URL e come l'applicazione risponde alle richieste
Controller	Gestiscono la logica per rispondere alle richieste
Viste	Contengono l'HTML servito dalla tua applicazione
Blade	Il motore di template di Laravel per creare viste dinamiche

Buon codice e benvenuto nel meraviglioso mondo di Laravel!

Credits: Image by storyset

Prossimo tutorial:

Laravel - Panoramica