Guida laravel 8: come creare un crud con Mysql

Category: blog, crud, laravel
44.129 views Tempo di lettura: 15 minuti

Questa Guida Laravel è un prosieguo naturale del tutorial dove abbiamo realizzato un sistema di autenticazione con lo stesso, dunque ,se non l avete fatto vi consiglio di leggervela.

Nella seguente realizzeremo un’applicazione web , quindi un classico CRUD (Create, Read ,Update, Delete) passo dopo passo partendo da zero. Memorizzeremo i dati su un un database MySql.

Guida Laravel: i vantaggi di utilizzare Laravel

Laravel è un framework PHP orientato alla programmazione ad oggetti ed al pattern architetturale MVC (che se non conoscete consiglio caldamente di studiarvi) e all’eliminazione di uno dei nostri peggiori nemici, lo spaghetti code. Presenta, inoltre, un comodo sistema di bundles per “pacchettizzare” i nostri software (parliamo quindi di HMVC), in modo tale da creare applicazioni sempre più sofisticate e al tempo stesso facilmente manutenibili.

La sua storia comincia nel 2011, quando Taylor Otwell decide di “rendere lo sviluppo web più facile e divertente, perché è quello che amo fare”. Da allora di strada ne è stata fatta, nonostante siano passati solo poco meno di due anni.

Attualmente, infatti, il progetto è arrivato alla versione 8 ed offre tante novità molto interessanti, il mio consiglio comunque è quello di utilizzare la versione 7 n quanto la 8 è ancora in fase alpha.

La documentazione ufficiale la trovate all’indirizzo laravel.com e come recita la stessa ,il framework per poter essere utilizzato senza problemi necessita di alcuni requisiti fondamentali quali:

• PHP> = 7.3.0
• Estensione XML PHP
• Estensione PHP PDO
• Estensione PHP JSON
• Ctype PHP Extension
• Estensione PHP BCMath
• Estensione PHP OpenSSL
• Estensione PHP Mbstring
• Tokenizer PHP Extension

Guida Laravel: Il Composer

Per poter lavorare con Laravel è necessario installare Composer, questo è un progetto open source per la gestione delle dipendenze di librerie PHP e l’autoloading delle classi.

Il funzionamento dello stesso è basato sulla presenza di un file di configurazione, denominato composer.json il quale viene utilizzato per impostare le dipendenze con librerie di terze parti da utilizzare nel progetto.

Installare Composer

Per Windows:

Il modo più semplice di installare Composer è quello di fare il download dell’installer dal seguente indirizzo “https://getcomposer.org/Composer-Setup.exe”.

Per Linux/macOS:

Si può digitare nel terminale il seguente comando:

php -r “readfile(‘https://getcomposer.org/installer’);” | php

Queste istruzioni installano il file composer.phar nella directory corrente. Se si vuole rendere disponibile Composer a livello di sistema, si può spostare il file composer.phar nella directory usrlocal/bin nel modo seguente:

sudo mv composer.phar /usr/local/bin/composer

per essere sicuri della corretta avvenuta installazione da terminale digitate:

composer

se vi restituisce la versione con altri dati come di seguito è ok:

bene ,ora siamo pronti per realizzare il progetto con Laravel.

Creare il progetto laravel

Se avete installato una versione di php superiore o uguale alla 7.3 potete gestire la realizzazione del progetto laravel mediante il composer installer, digitando da terminale, sistema più veloce:

composer global require laravel/installer

quindi per realizzare il progetto con il framework poi semplicemente, spostandovi nella vostra directory scelta per i progetti:

laravel new name-project

Nel caso in cui aveste una versione di php inferiore alla 7.3, da terminale ed all’interno della directory scelta digitate, sistema più lento:

composer create-project --prefer-dist laravel/laravel name-project

Realizza il progetto Student

Bene quindi spostatevi nella directory scelta per i vostri progetti e da terminale digitate:

laravel new student

come potete notare in pochi istanti viene scaricato il progetto laravel.

Verifichiamone la versione, spostandovi all’interno della directory student :

cd student
php artisan -v

se tutto è andato a buon fine dovrebbe restituirvi la versione (attualmente la 8.x.x).

Realizza il database

Per questa guida utilizzerò il server virtuale Xampp per la gestione del Php e del database Mysql. Quindi vado a realizzare il db dalla shell dello stesso:

mysql -u root -p

nel momento in cui vi chiede la password inseritela, se non la avete impostata date semplicemente invio, dunque successivamente digitate:

CREATE DATABASE student_db;

Il database è stato realizzato, per verifica digitate:

show databases;

se aprite il PhpMyAdmin all’indirizzo http://localhost/phpmyadmin/, dovreste trovare il database appena creato, la realizzazione delle tabelle le gestiremo con Laravel a breve. E’ chiaro che potete creare il database manualmente, come preferite.

Configura il database su Laravel

Con il vostro Ide preferito aprite il progetto Student, nella struttura dello stesso dovreste trovare il file .env , apritelo:

APP_NAME=Laravel
APP_ENV=local
APP_KEY=base64:vojmMS8GCtCNSNGz0nE3TAIEZYRNKBV9c4zvDLdGfuw=
APP_DEBUG=true
APP_URL=http://localhost

LOG_CHANNEL=stack

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=laravel
DB_USERNAME=root
DB_PASSWORD=

BROADCAST_DRIVER=log
CACHE_DRIVER=file
QUEUE_CONNECTION=sync
SESSION_DRIVER=file
SESSION_LIFETIME=120

REDIS_HOST=127.0.0.1
REDIS_PASSWORD=null
REDIS_PORT=6379

MAIL_MAILER=smtp
MAIL_HOST=smtp.mailtrap.io
MAIL_PORT=2525
MAIL_USERNAME=null
MAIL_PASSWORD=null
MAIL_ENCRYPTION=null
MAIL_FROM_ADDRESS=null
MAIL_FROM_NAME="${APP_NAME}"

AWS_ACCESS_KEY_ID=
AWS_SECRET_ACCESS_KEY=
AWS_DEFAULT_REGION=us-east-1
AWS_BUCKET=

PUSHER_APP_ID=
PUSHER_APP_KEY=
PUSHER_APP_SECRET=
PUSHER_APP_CLUSTER=mt1

MIX_PUSHER_APP_KEY="${PUSHER_APP_KEY}"
MIX_PUSHER_APP_CLUSTER="${PUSHER_APP_CLUSTER}"

ecco come si presenta.

Poiché laravel può eseguire l’applicazione in diversi ambienti, locale o produzione , per agevolare la configurazione nei diversi ambienti, il framework fa uso della libreria PHP DotEnv.

In poche parole il file .env è un file di configurazione di Laravel , difatti spiccano la variabile d’ambiente APP_NAME con il nome del progetto, l’APP_KEY etc…

Se scorrete un po più in basso vi sono anche le variabili che ci consentono di configurare il db:

...
DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=laravel
DB_USERNAME=root
DB_PASSWORD=
...

ok andiamo a modificare:

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=student_db
DB_USERNAME=root
DB_PASSWORD=

come puoi notare ho modificato il nome del db , inserendo il nostro, il resto lasciatelo così come è, se avete una password inseritela.

Guida Laravel: Realizzare le tabelle con le migrations

Innanzitutto realiziamo il model , classe che ci consente di gestire le tabelle in laravel. Da terminale spostatevi nella root principale del progetto e digitate:

php artisan make:model Student -m

inserendo il flag -m realiziamo anche la migration dello stesso.

Ora sotto la directory App/Models trovate il file Student.php, mentre sotto Database/Migration trovate, fra le altre anche, 2020_10_09_082121_create_students_table.php, file di migrazione per realizzare la tabella. La data iniziale nel nome serve a gestirne l’ordine di realizzazione.

Apritelo:

<?php

use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;

class CreateStudentsTable extends Migration
{
    /**
     * Run the migrations.
     *
     * @return void
     */
    public function up()
    {
        Schema::create('students', function (Blueprint $table) {
            $table->id();
            $table->timestamps();
        });
    }

    /**
     * Reverse the migrations.
     *
     * @return void
     */
    public function down()
    {
        Schema::dropIfExists('students');
    }
}

ecco come si presenta.

La up()funzione consente di creare / aggiornare tabelle, colonne e indici.

La down()funzione consente di invertire un’operazione eseguita con il metodo up.

Modificate come di seguito:

<?php

use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;

class CreateStudentsTable extends Migration
{
    /**
     * Run the migrations.
     *
     * @return void
     */
    public function up()
    {
        Schema::create('students', function (Blueprint $table) {
            $table->bigIncrements('id');
            $table->string('name');
            $table->string('email');
            $table->string('phone');
            $table->string('password');
            $table->timestamps();
        });
    }

    /**
     * Reverse the migrations.
     *
     * @return void
     */
    public function down()
    {
        Schema::dropIfExists('students');
    }
}

come puoi vedere ho configurato la realizzazione dei campi. Da terminale digitate:

php artisan migrate

comando con il quale creo tabella con i relativi campi nel db. Difatti se riaprite phpMyAdmin trovate il db popolato con la tabella students:

ed i campi, ora chiaramente vuoti:

modifichiamo il model relativo alla tabella,aprite il file App/Models/Student.php:

<?php

namespace App\Models;

use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;

class Student extends Model
{
    use HasFactory;
}

e modificate:

<?php

namespace App;

use Illuminate\Database\Eloquent\Model;

class Student extends model
{
    protected $fillable = ['name', 'email', 'phone', 'password'];
}

l’array $fillable consente di modificare i campi inseriti all’interno dello stesso, in alternativa si potrebbe utilizzare $guarded ,che all’opposto, consente di modificare tutti i campi tranne quella dichiarata:

<?php

namespace App;

use Illuminate\Database\Eloquent\Model;

class Student extends model
{
    protected $guarded = ['id'];
}

Realizzare il controller per la gestione delle rotte

Il controller è la classe  ci consente di gestire le routes (percorsi o rotte) in laravel, quindi l’aggiunta, la modifica, la vista e la cancellazione dei dati nel database.

Da terminale digitate:

php artisan make:controller StudentController --resource

aggiungendo il flag –resource realiziamo tutti i metodi necessari che ora andremo a vedere.

Apritelo sotto App/Http/Controller/StudentController.php:

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

class StudentController extends Controller
{
    /**
     * Display a listing of the resource.
     *
     * @return \Illuminate\Http\Response
     */
    public function index()
    {
        //
    }

    /**
     * Show the form for creating a new resource.
     *
     * @return \Illuminate\Http\Response
     */
    public function create()
    {
        //
    }

    /**
     * Store a newly created resource in storage.
     *
     * @param  \Illuminate\Http\Request  $request
     * @return \Illuminate\Http\Response
     */
    public function store(Request $request)
    {
        //
    }

    /**
     * Display the specified resource.
     *
     * @param  int  $id
     * @return \Illuminate\Http\Response
     */
    public function show($id)
    {
        //
    }

    /**
     * Show the form for editing the specified resource.
     *
     * @param  int  $id
     * @return \Illuminate\Http\Response
     */
    public function edit($id)
    {
        //
    }

    /**
     * Update the specified resource in storage.
     *
     * @param  \Illuminate\Http\Request  $request
     * @param  int  $id
     * @return \Illuminate\Http\Response
     */
    public function update(Request $request, $id)
    {
        //
    }

    /**
     * Remove the specified resource from storage.
     *
     * @param  int  $id
     * @return \Illuminate\Http\Response
     */
    public function destroy($id)
    {
        //
    }
}

esso contiene vari metodi:

• index () => mostra l’elenco degli studenti
• create () => crea uno studente utilizzando un modulo
• store () => crea uno studente nel database
• show () => mostra uno studente specifico
• edit () => aggiorna i dati dello studente utilizzando un modulo
• update () => aggiorna i dati degli studenti utilizzando un modulo
• destroy () => rimuove un particolare studente

 

modifichiamo tali metodi come di seguito:

<?php

namespace App\Http\Controllers;

use App\Student;
use Illuminate\Http\Request;

class StudentController extends Controller
{
    /**
     * Display a listing of the resource.
     *
     * @return \Illuminate\Http\Response
     */
    public function index()
    {
        $student = Student::all();
        return view('index', compact('student'));
    }

    /**
     * Show the form for creating a new resource.
     *
     * @return \Illuminate\Http\Response
     */
    public function create()
    {
        return view('create');
    }

    /**
     * Store a newly created resource in storage.
     *
     * @param  \Illuminate\Http\Request  $request
     * @return \Illuminate\Http\Response
     */
    public function store(Request $request)
    {
        $storeData = $request->validate([
            'name' => 'required|max:255',
            'email' => 'required|max:255',
            'phone' => 'required|numeric',
            'password' => 'required|max:255',
        ]);
        $student = Student::create($storeData);

        return redirect('/students')->with('completed', 'Student has been saved!');
    }

    /**
     * Display the specified resource.
     *
     * @param  int  $id
     * @return \Illuminate\Http\Response
     */
    public function show($id)
    {
        //
    }

    /**
     * Show the form for editing the specified resource.
     *
     * @param  int  $id
     * @return \Illuminate\Http\Response
     */
    public function edit($id)
    {
        $student = Student::findOrFail($id);
        return view('edit', compact('student'));
    }

    /**
     * Update the specified resource in storage.
     *
     * @param  \Illuminate\Http\Request  $request
     * @param  int  $id
     * @return \Illuminate\Http\Response
     */
    public function update(Request $request, $id)
    {
        $updateData = $request->validate([
            'name' => 'required|max:255',
            'email' => 'required|max:255',
            'phone' => 'required|numeric',
            'password' => 'required|max:255',
        ]);
        Student::whereId($id)->update($updateData);
        return redirect('/students')->with('completed', 'Student has been updated');
    }

    /**
     * Remove the specified resource from storage.
     *
     * @param  int  $id
     * @return \Illuminate\Http\Response
     */
    public function destroy($id)
    {
        $student = Student::findOrFail($id);
        $student->delete();

        return redirect('/students')->with('completed', 'Student has been deleted');
    }
}

Configura le rotte

Aprite il file sotto Routes/web.php ed aggiungete StudentController.php:

<?php

/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
|
 */

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

Route::resource('students', 'App\Http\Controllers\StudentController');

da terminale digitate:

php artisan route:list

ecco il risultato:

Realizza le viste con Blade

Spostatevi all’interno della directory Resource/Views e realizzate i seguenti file mediante il modello di Blade (con estensione blade mi raccomando):

• layout.blade.php
• index.blade.php
• create.blade.php
• edit.blade.php

 

Utilizzare il framework css Bootstrap

Utilizzeremo il layout.blade come file master per quanto riguarda il template delle viste, per cui apritelo ed aggiungete le seguenti righe, come vedete ho aggiunto i collegamenti cdn relativi all’utilizzo del framework css di bootstrap in modo tale da avere un layout carino e responsive:

<!DOCTYPE html>
<html>
   <head>
      <meta charset="utf-8">
      <meta name="viewport" content="width=device-width, initial-scale=1">
      <meta http-equiv="X-UA-Compatible" content="ie=edge">
      <title>Laravel 7/6 CRUD App Example</title>
      <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
   </head>
   <body>
      <div class="container">
         @yield('content')
      </div>

      <script src="https://code.jquery.com/jquery-3.4.1.slim.min.js"></script>
      <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"></script>
      <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" type="text/js"></script>
   </body>
</html>

se volete approfondire il template  blade di laravel potete fare click qui.

Configurare il layout Create.blade

Configuriamo il file in modo tale da creare, archiviare e convalidare i dati di un utente utilizzando i componenti Bootstrap Form e Card UI.

Aprite resource/views/create.blade.php e aggiungete:

@extends('layout')

@section('content')

<style>
    .container {
      max-width: 450px;
    }
    .push-top {
      margin-top: 50px;
    }
</style>

<div class="card push-top">
  <div class="card-header">
    Add User
  </div>

  <div class="card-body">
    @if ($errors->any())
      <div class="alert alert-danger">
        <ul>
            @foreach ($errors->all() as $error)
              <li>{{ $error }}</li>
            @endforeach
        </ul>
      </div><br />
    @endif
      <form method="post" action="{{ route('students.store') }}">
          <div class="form-group">
              @csrf
              <label for="name">Name</label>
              <input type="text" class="form-control" name="name"/>
          </div>
          <div class="form-group">
              <label for="email">Email</label>
              <input type="email" class="form-control" name="email"/>
          </div>
          <div class="form-group">
              <label for="phone">Phone</label>
              <input type="tel" class="form-control" name="phone"/>
          </div>
          <div class="form-group">
              <label for="password">Password</label>
              <input type="text" class="form-control" name="password"/>
          </div>
          <button type="submit" class="btn btn-block btn-danger">Create User</button>
      </form>
  </div>
</div>
@endsection

Per generare un nuovo utente viene chiamato in causa il metodo create() del controller StudentController.php:

// StudentController.php

    /**
     * Show the form for creating a new resource.
     */
    public function create()
    {
        return view('create');
    }

    /**
     * Store a newly created resource in storage.
     */
    public function store(Request $request)
    {
        $storeData = $request->validate([
            'name' => 'required|max:255',
            'email' => 'required|max:255',
            'phone' => 'required|numeric',
            'password' => 'required|max:255',
        ]);
        $student = Student::create($storeData);

        return redirect('/students')->with('completed', 'Student has been saved!');
    }

avviate il server:

php artisan serve

aprite http://127.0.0.1:8000/students/create , quindi compilate il form e date invio, se tutto procede per il verso giusto siete riusciti ad inserire i dati dello studente nel db.

 

 

Nota bene se dopo l’invio dei dati l’app vi restituisse errore come se non trovasse la classe Student, eseguite da terminale il seguente comando:

composer dump-autoload

questo potrebbe succedere perchè in laravel 8 sono cambiati i namespace delle classi.

Mostra la lista degli studenti

Implementiamo ora la vista che si occupa di restituire la lista degli elementi presenti nel db , in questo caso gli studenti:

// StudentController.php

 public function index()
    {
        $student = Student::all();
        return view('index', compact('student'));
    }

quindi aprite resource/views/index e digitate:

@extends('layout')

@section('content')

    <style>
        .push-top {
            margin-top: 50px;
        }
    </style>

    <div class="push-top">
        @if(session()->get('success'))
            <div class="alert alert-success">
                {{ session()->get('success') }}
            </div><br />
        @endif
        <table class="table">
            <thead>
            <tr class="table-warning">
                <td>ID</td>
                <td>Name</td>
                <td>Email</td>
                <td>Phone</td>
                <td>Password</td>
                <td class="text-center">Action</td>
            </tr>
            </thead>
            <tbody>
            @foreach($student as $students)
                <tr>
                    <td>{{$students->id}}</td>
                    <td>{{$students->name}}</td>
                    <td>{{$students->email}}</td>
                    <td>{{$students->phone}}</td>
                    <td>{{$students->password}}</td>
                    <td class="text-center">
                        <a href="{{ route('students.edit', $students->id)}}" class="btn btn-primary btn-sm"">Edit</a>
                        <form action="{{ route('students.destroy', $students->id)}}" method="post" style="display: inline-block">
                            @csrf
                            @method('DELETE')
                            <button class="btn btn-danger btn-sm"" type="submit">Delete</button>
                        </form>
                    </td>
                </tr>
            @endforeach
            </tbody>
        </table>
        </div>

@endsection

Buono!!

Modifica dei dati

E’ arrivato il momento di gestire la modifica dello studente:

// StudentController.php

     /**
     * Edit the specified resource.
     */
    public function edit($id)
    {
        $student = Student::findOrFail($id);
        return view('edit', compact('student'));
    }

    /**
     * Update the specified resource in db.
     */
    public function update(Request $request, $id)
    {
        $updateData = $request->validate([
            'name' => 'required|max:255',
            'email' => 'required|max:255',
            'phone' => 'required|numeric',
            'password' => 'required|max:255',
        ]);
        Student::whereId($id)->update($updateData);
        return redirect('/students')->with('completed', 'Student has been updated');
    }

il metodo nello specifico è l’update() del controller StudentController.php.

Aprite il file resource/views/edit.blade.php e digitate:

@extends('layout')

@section('content')

<style>
    .container {
      max-width: 450px;
    }
    .push-top {
      margin-top: 50px;
    }
</style>

<div class="card push-top">
  <div class="card-header">
    Edit & Update
  </div>

  <div class="card-body">
    @if ($errors->any())
      <div class="alert alert-danger">
        <ul>
            @foreach ($errors->all() as $error)
              <li>{{ $error }}</li>
            @endforeach
        </ul>
      </div><br />
    @endif
      <form method="post" action="{{ route('students.update', $student->id) }}">
          <div class="form-group">
              @csrf
              @method('PATCH')
              <label for="name">Name</label>
              <input type="text" class="form-control" name="name" value="{{ $student->name }}"/>
          </div>
          <div class="form-group">
              <label for="email">Email</label>
              <input type="email" class="form-control" name="email" value="{{ $student->email }}"/>
          </div>
          <div class="form-group">
              <label for="phone">Phone</label>
              <input type="tel" class="form-control" name="phone" value="{{ $student->phone }}"/>
          </div>
          <div class="form-group">
              <label for="password">Password</label>
              <input type="text" class="form-control" name="password" value="{{ $student->password }}"/>
          </div>
          <button type="submit" class="btn btn-block btn-danger">Update User</button>
      </form>
  </div>
</div>
@endsection

con questo abbiamo appena terminato il nostro semplicissimo CRUD, fate tutte le prove del caso, aggiungete studenti, modificateli e cancellateli.

Potete scaricarvi le risorse dell’applicazione da Github.