Le ricette di Umbriaway Consulting: costruire la nostra prima WEB APP con Laravel

web developer umbria

la nostra prima web app con laravel

Preparativi

Prima di lanciarci nella costruzione dell’ APP andiamo all’ indirizzo http://localhost:8000/ dopo aver lanciato il comando da fienstra terminale di visual studio code che conosciamo che é

php artisan serve

e vediamo quello che segue:

lanciare laravel di default

ora partiamo subito in quarta alla luce delle scoperte fatte all’ indirizzo: https://umbriawayfidelizza.wordpress.com/2021/02/22/iniziare-laravel-con-la-pratica/ . Consolidiamo un attimo le nostre scoperte. Abbiamo visto che le cartelle critiche per aggianciare le viste ai controller che dipendono dalle routes sono:

1 C:\xampp\htdocs\laravel\myCodexWp\app\Http\Controllers

La voce 1 è il folder per creare il nostro controller

2 C:\xampp\htdocs\laravel\myCodexWp\routes

La voce 2 è responsabile dell’ instradamento tra controller e viste

3 C:\xampp\htdocs\laravel\myCodexWp\resources\views

La voce 3 è la vista che si appoggia sul template engine BLADE che ha delle direttive da conoscere

Lanciamoci senza paracadute

A questo punto possiamo iniziare esperimenti fondamentali e costruire sulla base di queste informazioni viste e controller a nostro piacere passando per le routes. Il comando per lanciare il nostro nuovo controller sarà da riga di comando:

php artisan make:controller MioController

questo vuol dire che adesso all’ interno di C:\xampp\htdocs\laravel\myCodexWp\app\Http\Controllers abbiamo un altro file MioController.php su cui andremo a scrivere:

<?php
 
namespace App\Http\Controllers;
 
use Illuminate\Http\Request;
 
class MioController extends Controller
{
    public function home(){
    return view('home');
}

Adesso dobbiamo instradare il controller nella cartella routes dentro il file web.php:

<?php

use Illuminate\Support\Facades\Route;

/*
|--------------------------------------------------------------------------
| 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('/','App\Http\Controllers\MioController@home');

come si diceva la direttiva @home richiama il metodo home() della function pubblica nel controller

E’ andato tutto bene e ora?

A questo punto devo avere il file home nella vista, ma abbiamo deciso di creare una pagina master che è valida per tutte le pagine mentre nella home teniamo solo la parte del content e abbiamo anche deciso di integrare bootstrap e anche di tagliare la navbar per gestirla nella cartella shared della cartella PUBLIC. Per arrivare a tutta questa serie di cambiamenti siamo dovuti passare attraverso il template engine blade presente in C:\xampp\htdocs\laravel\myCodexWp\resources\views che ha delle direttive, pertanto diamo un occhiata alla parte finale e vediamo come ci siamo arrivati:

la nostra prima applicazione servita su un piatto caldo

il file web.app nella cartella C:\xampp\htdocs\laravel\myCodexWp\routes è diventato:

<?php

use Illuminate\Support\Facades\Route;

/*
|--------------------------------------------------------------------------
| 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('/','App\Http\Controllers\MioController@home');
Route::get('/php','App\Http\Controllers\MioController@phpbase');
Route::get('/phpoop','App\Http\Controllers\MioController@phpoggetti');
Route::get('/wordpress','App\Http\Controllers\MioController@wp');
Route::get('/codeigniter','App\Http\Controllers\MioController@ci');
Route::get('/laravel','App\Http\Controllers\MioController@laravelframework');

il file MioController.php dentro il folder C:\xampp\htdocs\laravel\myCodexWp\app\Http\Controllers:

<?php
 
namespace App\Http\Controllers;
 
use Illuminate\Http\Request;
 
class MioController extends Controller
{
    public function home(){
    return view('home');
}

    public function phpbase(){
    return view('php');
}

    public function phpoggetti(){
    return view('phpoop');
}

    public function wp(){
    return view('wordpress');
}

    public function ci(){
    return view('codeigniter');
}

    public function laravelframework(){
    return view('laravel');
}

}

A questo punto prima di andare oltre e sviluppare la nostra WEB APP dobbiamo trovare la risposta alla domanda che ci stuzzica a nostra insaputa. Abbiamo sempre detto che Laravel è un MOSTRO perchè assegna la gestione della parte logica al database con il model, sostiene le viste tramite il Controller e renderizza le viste a seconda delle richieste dell’ utente. Allora come mai sopra non vedo il MODEL? Semplice, perchè non stiamo gestendo nessuna base dati al momento, ci stiamo sofermando solo sull’ apprendimento del template BLADE. Infatti se apriamo la pagina HOME scopriamo che:

@extends('master')
@section('title','Home')
@section('content')
    <div class="container">
       <div class="col-md-12">
           <h1 class="text-center mt-5 editcontent">
               <a href="https://www.farwebdesign.com/" target="_blank">FarWebDesign</a>
           </h1>
           <h3 class="text-center mt-2 editContent">
               Area di supporto tecnico
           </h3>
           <div class="text-center">
               <img src="https://www.farwebdesign.com/img/uw.png" width="600" height="300" alt="" class="img-fluid">
           </div>
       </div>
    </div>
@endsection
cosa è stato fatto per arrivare fin qui?

Sulla spiegazione in dettaglio di questa situazione e di tutte le direttive espresse dal simbolo della chiocciola che non sono le uniche che si vedono qui ci ritorneremo nei prossimo articoli di approfondimento didattico con Umbriaway Consulting. In sostanza dobbiamo consolidare il lavoro fatto per arrivare alla pagina immortalata nell’ immagine in cui ci sono una serie di link tutti attivi e funzionanti che rimandano alle sezioni corrispondenti. La nostra prima web app è una ricetta pronta, tempo di realizzazione circa un ora anche l’uso della pentola a pressione (se sai dove mettere le mani).

Rispondi

Inserisci i tuoi dati qui sotto o clicca su un'icona per effettuare l'accesso:

Logo di WordPress.com

Stai commentando usando il tuo account WordPress.com. Chiudi sessione /  Modifica )

Google photo

Stai commentando usando il tuo account Google. Chiudi sessione /  Modifica )

Foto Twitter

Stai commentando usando il tuo account Twitter. Chiudi sessione /  Modifica )

Foto di Facebook

Stai commentando usando il tuo account Facebook. Chiudi sessione /  Modifica )

Connessione a %s...