La Juventus ha perso la champions? Per forza i giocatori non si allenavano!

Allegri ha capito perchè ha perso champions, perchè tra un allenamento e l’altro qualcuno tagliava. Ma adesso per vincere il triplete prossimo anno ecco lo strumento che serve per monitorare la situazione: il nuovo potentissimo applicativo FWD traccia il potenziale campione, che consiste nel fare l’appello ogni mattina a Vinovo prima degli allenamenti! Bonucci c’è stamattina? Presente! Bernardeschi è di nuovo andato dalla ragazza? No, ce sta anche lui! De Sciglio si vede stamattina? SI non manca mai è uno di quelli che ha bisogno di allenarsi di più! Stavolta sono tutti sgamati e la champions non sfuggirà il prossimo anno. E dire che tutto ciò è stato reso possibile seguendo i tutorial di Umbriaway Consulting su PHP e MySQL. Quindi con un approccio pratico andiamo subito al sodo e diamo scacco matto in poche mosse ai problemi di Allegri.

Mossa numero 1: procurarsi un editor di testo, che sia Atom piuttosto che Visual Studio Code piuttosto che Sublime Tetx poco importa.

Mossa numero 2: scaricare XAMPP il server locale per testare l’applicazione

Mossa numero 3: iniziare a pensare alla struttura del progetto come file system e preoccuparsi di creare un file di configurazione per il nostro collegamento al DB, che chiameremo config.php

Mossa numero 4 scaricare dalla rete il noto framework bootstrap nella sua forma sintetica e inserire il nuovo file di nome inequivocabile bootstrap.min.css all’ interno di una cartella che chiameremo inc come inclusione, quindi il path completo del file sarà: inc\bootstrap.min.css ; per includere bootstrap nei nostri progetti serve anche il file JS che si può scaricare in rete quindi all’ interno della cartella INC troveremo alla fine anche inc\bootstrap.min.js

Mossa numero 5, includere JQuery nei nostri progetti, dalla rete scaricare il file jquery.min.js (il suo contenuto per fare copia e incolla in locale) e inserirlo nella stessa cartella di inclusione per cui avremo inc\jquery.min.js

Mossa numero 6, creare una nuova cartella che conterrà due nuovi file, Studenti.php e Database.php, il primo ci servirà per la gestione dei calciatori juventini e sul secondo avremo le coordinate di connessione al DB sfruttando le costanti presenti nel file di configurazione

Mossa N 7, creare nella root del file system appena creato il file primario definito come index.php e scrivere il codice strutturale tipico usando la semantica dei tag html, head, title, body, div includendo nell’ head anche il framework bootstrap con le sue classi da utilizzare nel body , quindi la parte superiore della ns pagina sarà:

/*
<?php include ‘inc/header.php’;
include ‘lib/Student.php’;
?>

Serial Student Student Roll Attendance
01 Rugani 10 P
A

03 Bernardeschi 11 P
A

04 De Sciglio 12 P
A

</div>

<?php include ‘inc/footer.php’ ?>

*/

Mossa numero otto, identificare la data degli allenamenti, questo si ottiene aggiungendo subito dopo la classe panel-body il seguente DIV con la classe predefinita di bootstrap:

/*

Date:

*/

Mossa numero 9, aggiungere il php dinamico con la funzione date per la stampa

/*

Date:

*/

Mossa numero dieci, aggiungere lo stile in linea per rendere esteticamente visibile la stampa video dell’ oggeto date:

/*

Date:

*/

A questo punto la parte statica del progetto é completata e non ci resta che dinamicizzare il tutto con il registro delle presenze dei calciatori in una delle prossime puntate. Buona champions a tutti!

Dare scacco matto ai temi wordpress in 425 mosse, istruzioni per l’uso

web developer UmbriaNon ti piaccioni i temi wordpress tradizionali oppure costano troppo? Ne vuoi personalizzare uno a tuo uso e consumo? Vediamo come risolvere la questione in poche semplici mosse e guadagnare elo. Possono esserci varie soluzioni e diverse game per arrivare allo stesso obiettivo, quindi le mosse proposte qui vanno prese elasticamente in quanto nello sviluppo web si arriva allo stesso risultato seguendo diversi percorsi, quello proposto è solo una linea di sviluppo fra molte.

Mossa numero 1, creare una certella all’ interno del wp-content/themes con il nome del nuovo tema, in questo caso chess-themes

Mossa numero 2, creare nella root della cartella appena creata il file index.php responsabile della lettura del file, per gioco possiamo anche scrivere al suo interno dei tag di contenuto tipo <h1>Prima pagina in WP</h1>

Mossa numero 3, creare nella root del nuovo tema allo stesso livello di index.php il foglio di stile, quindo style.css

Mossa numero 4, digitare sul motore codex css e atterrare sulla pagina https://codex.wordpress.org/CSS andare dal menù di destra su design layout , cercare la voce theme development e fare il copia e incolla dell’ header proposto per personalizzarlo in base alle nostre esigenze, in questo caso l’originale proposto per il tema twentythirteen è:

/*
Theme Name: Twenty Thirteen
Theme URI: http://wordpress.org/themes/twentythirteen
Author: the WordPress team
Author URI: http://wordpress.org/
Description: The 2013 theme for WordPress takes us back to the blog, featuring a full range of post formats, each displayed beautifully in their own unique way. Design details abound, starting with a vibrant color scheme and matching header images, beautiful typography and icons, and a flexible layout that looks great on any device, big or small.
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: black, brown, orange, tan, white, yellow, light, one-column, two-columns, right-sidebar, flexible-width, custom-header, custom-menu, editor-style, featured-images, microformats, post-formats, rtl-language-support, sticky-post, translation-ready
Text Domain: twentythirteen

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you’ve learned with others.
*/

Mossa numero 5, personalizzare queste informazioni in base alle proprie esigenze, questa parte verrà poi vista dalla preview dei temi dal pannello di controllo epr la selezione dalla dashboard, quindi nella nostra versione definitiva personalizzata, facendo attenzione a non dimenticare ilk blocco dei commenti per non interferire con il contenuto di css, il tutto diventa:

/*
Theme Name: Chess Theme
Theme URI: https://farwebdesign.com/chesstheme
Author: FWD & Umbriaway Consulting
Author URI: https://www.farwebdesign.com
Description: tema a topic scacchistico
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: bianco, nero. duale, aperture, campioni, finali, mediogioco
Text Domain: chesstheme
*/

Mossa numero 6, creo un file grafico rigorosamente di nome screenshot.png di dimensioni ottimizzate 1200 x 900 e la inserisco nella root della cartella chess-theme del nostro nuovo tema, in questo modo la preview del nostro template quando proporrà la selezione e la scelta del tema tramite l’attivazione avrò tutto quello che gli serve per proporsi in maniera corretta. A questo punto nonc i resta che lavorare sulla index.php

Mossa numero 7, creo la struttura base della pagina HTML, inserendo dentro il contenuto dimostrativo della mossa numero due:

/*
<!DOCTYPE html>
<html>
<body>

<h1>Prima pagina in WP</h1>

</body>
</html>
*/

Mossa numero 8, prendere le impostazioni generali del nostro sito, come TITOLO e descrizione sfruttando tutta la potenza della funzione predefinita bloginfo che accetta vari parametri come name, description e charset e le inserisco, iniziamo con il TITLE che non è altro il nome variabile del sito

/*
<!DOCTYPE html>
<html>
<head>
<title><?php bloginfo(‘name’);?></title>
</head>
<body>

<h1>Prima pagina in WP</h1>

</body>
</html>
*/

Mossa numero 9, inserisco la stessa informazione precedente in una intestazione header presente all’ interno del body:

/*
<!DOCTYPE html>
<html>
<head>
<title><?php bloginfo(‘name’);?></title>
</head>
<body>
<header>

</header>

<h1>Prima pagina in WP</h1>

</body>
</html>
*/

Con questo sistema una volta che andiamo dal menù generale impostazioni della dashboard di WP a cambiare il nome, tutte le modifiche verranno effettuate in automatico su tutte le pagine

Mossa numero 10, inserisco la descrizione sempre nell’ header, come si fa? Inserendo un parametro diverso:

/*
<!DOCTYPE html>
<html>
<head>
<title><?php bloginfo(‘name’);?></title>
</head>
<body>
<header>

<span><h4><?php bloginfo(‘description’);?><h4></span>
</header>
<h1>Prima pagina in WP</h1>
</body>
</html>
*/

Mossa numero 11, inseresco nell’ head il meta tag relativo al charset, con il parametro dedicato masticato sempre dalla funzione predefinita bloginfo():

/*
<!DOCTYPE html>
<html>
<head>
<meta charset=<?php bloginfo(‘charset’);?>
<title><?php bloginfo(‘name’);?></title>
</head>
<body>
<header>

<span><h4><?php bloginfo(‘description’);?><h4></span>
</header>
<h1>Prima pagina in WP</h1>
</body>
</html>
*/

A questo punto facendo tasto dx, ispezione da Chrome verrà visualizzato il charset UTF-8 inserito nella pagina dinamicamente

Mossa numero 12, completo la parte di intestazione inserendo una funzione predefina di WP che é wp_head(); che non fa altro che recuperare tutte le risorse indispensabili a questa sezione, come i collegamento ai link js e css per esempio, quindi il file index.php diventa:

/*
<!DOCTYPE html>
<html>
<head>
<meta charset=<?php bloginfo(‘charset’);?>
<title><?php bloginfo(‘name’);?></title>
<?php wp_head();?>
</head>
<body>
<header>

<span><h4><?php bloginfo(‘description’);?><h4></span>
</header>
<h1>Prima pagina in WP</h1>
</body>
</html>
*/

A questo punto se andiamo ad analizzare questa pagina costruita dinamicamente sempre dalla seziona ispeziona di Chrome ci acoorgiamo che la pagina statica ha quasi tutto ciò che gli serve, una volta che è stata parserizzata dal browser. Attenzione a non fare confusione tra HEAD e HEADER, la prima parola fa riferimento a una sezione strutturale della pagina che contiene tutta una serie di meta informazioni e i collegamento alle librerie esterne, la seconda a un tag semantico presente all’ interno del body.

Mossa numero 13, aggiungere un tag semantico footer per il copyright ad esempio, e curiamo meglio il nome delle classi, ad esempio è buona norma dare il nome alla scatola esterna di container e a quella interna main, dopodichè facciamo conoscenza di una nuova funzione di Wp, quella che setta il tempo the_time():

/*
<!DOCTYPE html>
<html>
<head>
<meta charset=<?php bloginfo(‘charset’);?>
<title><?php bloginfo(‘name’);?></title>
<?php wp_head();?>
</head>
<body>
<header>

<span><h4><?php bloginfo(‘description’);?><h4></span>
</header>
<h1>Prima pagina in WP</h1>
<footer>

&copy –

</footer>
</body>
</html>
*/

Mossa numero 14, inserisco una funzione che mi legge le risorse/librerie esterne come JQuery alla fine del body, perché come sappiamo i tempi di caricamento della pagina si riducono, funzione che é simile a <?php wp_head();?> e che si chiama wp_footer();

/*
<!DOCTYPE html>
<html>
<head>
<meta charset=<?php bloginfo(‘charset’);?>
<title><?php bloginfo(‘name’);?></title>
<?php wp_head();?>
</head>
<body>
<header>

<span><h4><?php bloginfo(‘description’);?><h4></span>
</header>
<h1>Prima pagina in WP</h1>
<footer>

&copy –

</footer>
<?php wp_footer();?>
</body>
</html>
*/

A questo punto se facessi tasto destro ispeziona da chrome vedrei che alla fine della pagina sono stati inseriti dei link di collegamento, quindi tutto funziona! A questo punto se visualizzassi a video mi ritroverei la barra di amministrazione in alto che prima non c’era, questa perchè la sidebar è richiamata quando abbiamo aggiunto l’istruzione <?php wp_footer();?>

Mossa numero 15, lavorare sui contenuti con i LOOP e i controlli condizionali, cioè il programma deve tradurre l’espressio “guardami se ci sono i contenuti e mostrali se non vedi nulla dammi un messaggio di avvertimento”, il tutto si traduce in materiale ciclabile, usiamo nel nostro script la sintassi STRINGA che prevede l’uso dei due punti alla fine delle incorporazioni php, toglierò quindi il mio codice di prova <h1>Prima pagina in WP</h1> e lo sostituisco:

/*
<!DOCTYPE html>
<html>
<head>
<meta charset=<?php bloginfo(‘charset’);?>
<title><?php bloginfo(‘name’);?></title>
<?php wp_head();?>
</head>
<body>
<header>

<span><h4><?php bloginfo(‘description’);?><h4></span>
</header>

“>

 

Articolo creato da |

<?php endif; ?>

<p><?php the_excerpt(); ?></p>

<a class=”btn” href=”<?php the_permalink(); ?>”>Leggi tutto…</a>

</article>

<?php endwhile; ?>

<?php else : ?>

<?php echo wpautop(‘ops…non ho trovato articoli!’); ?>

<?php endif; ?>

</div>

<footer>

&copy –

</footer>
<?php wp_footer();?>
</body>
</html>
*/

Le funzioni have_posts(), the_post(), the_permalink(), the_title(), the_author(), the_time(argomenti) con i parametri vari di formattazione, the_tags(), has_post_thumbnail(), the_post_thumbnail(‘thumbnail’), the_excerpt(), wpautop sono tutti metodi che stampano sulla pagina tutte quelle informazioni tipiche di un blog che ha delle news che hanno un titolo e che devono ciclare con il nome dell’ autore, una data di creazione, dei contenuti, una immagine piccola che lo identifica etc. La mossa numero 14 è quella che nel gergo scacchistico incasina tutto il piano di gioco, una fase complessa del mediogio che ha bisogno di articolare e pianificare tutta una serie di sottopiani per arrivare all’ obiettivo, quindi per ora il codice dinamico che cicla i contenuti non costituisce certo lo scacco matto finale che ci eravamo prefissi, ma solo una tappa intermedia prima di quella che viene definita in gergo scacchistico miniatura, il tutto verrà analizzato in uno dei prossimi articoli

Programmazione procedurale oppure OOP? This is the problem!

La programmazione ad oggetti ha sempre suscitato vere e proprie guerre concettuali, tra sostenitori delle due fazioni. C’è chi sostiene che senza OOP non si potrebbero mettere in piedi dei progetti complessi. E c’è chi sostiene che la procedurale basta e avanza per spedire una mail con gli allegati. Senza la programmazione procedurale non si potrebbe imparare l’Object Oriented Programming che è solo un approccio diverso per fare cose diverse. OOP non è un modo migliore per programmazre, è solo un modo diverso, dipende dal tipo di progetto che si vuole mettere in piedi. OOP è una filosofia di programmazione. Per fare OOP devi astrarre le cose. Casa, auto, stufa sono oggetti concreti con cui familiarizziamo ogni giorno. Per andare sulla luna ci sono decine di fasi e sottofasi in sequenza come per fare una torta o un semplice caffè. OOP richiede tutta una pianificazione anticipata a tavolino, se dico sedia devo definire le proprietà dell’ oggetto come colore e numero di gambe e i metodi o funzioni o azioni da mettere in atto: spostare la sedia, rovesciare la sedia etc, in base alla manipolazione dei dati che intendiamo operare. La programmazione procedurale è istintuale, la OOP è un paradigma, prima mi devo interrogare su cosa devo fare, poi devo identificare gli oggetti e poi decidere come sono definiti e quali azioni devono effettuare. Solo quando ho tutto chiaro e ho pensato i blocchi utili e necessari potrò mettere in pratica il mio cidce. OOP è una pianificazione fatta in anticipo. I problemi si risolvono con la tastiera sulla procedurale, mentre in OOP basta all’ inizio solo penna e foglio di carta. Su OOP dire classe indica la definizione della classe, mentre l’istanza della classa p il vero e proprio ogetto. Le proprietà sono le variabili con dei valori e i metodi sono funzioni interne alla definizione della classe. La classe è la ricetta di un budino , dove avremo la lista degli ingredienti e la somma delle operazioni da affettuare per arrivare al prodotto reale. Ad esempio la classe clienti nel nostro diagramma UML avrà un nome, un cognome, un indirizzo, una mail, un numero di telefono e dei metodi come recupero indirizzo o mail o cambio anagrafica. Le ricette sono tutte diverse, così come sono diversi gli ingredienti e le funzionalità. Definire le proprietà e le funzionalità è il core di una definizione di una classe. Con OOP posso scomporre un problema in tanti piccoli problemi e posso riutilizzare il codice per le stesse funzionalità. La manutenzione del codice viene semplificata e anche il debug è meno complesso. A questo punto la domanda è: come viene definita una classe in PHP? Ad esempio se abbiamo un libro come dobbiamo astrarre tutte le problematiche annesse? Un libro ha delle proprietà come titolo, quantità a magazzino, codice isbn, autore, costo, numero di pagine, immagine di copertina e ha anche dei metodi come sfogliare le pagine, la condizione delle pagine etc. Idem per una classe AUTO dove ho le proprietà dell’ oggetto da istanziare come colore interno, colore esterno numero di ruote e metodi come messa in moto etc. Anche nelle operazioni di shopping cart avrò accesso ai sistemi di login e di registrazione dei dati, a un carrello che memorizza le operazioni sugli articoli, l’invio per i pagamenti e ciascuno di questi blocchi può essere scomposto in sottoblocco per individuare le responsabilità che ogni oggetto deve avere tipo il cliente spedisce i dati, il cliente registra i dati. Ad esempio l’oggetto ordine deve specificare i dettagli effettuati, l’oggetto di verifica di spedizione sarà a carico dell’ oggetto mail e così via. Bisogna quindi stabilire le proprietà e le funzionalità per ogni oggetto. L’oggetto LOGIN deve avere tutta una serie di caratteristiche, un tipo di codifica per oscurare le pwd, un sistema di verifica per vedere se quella mail esiste e molto altro. Occorre definire quinti tutte le possibilità che il nostro oggetto ha a sua disposizione. Quindi si parte dal nome della classe, si definiscono le prorietà e infine i metodi. La definizione della classe non è l’oggetto che va istanziato. L’oggetto cliente ha una sua anagrafica per esempio. La classe libro per esempio potrà avere questo suo elenco di proprietà che possono anche essere inizializzate ma senza la creazione dell’ oggetto sarebbero inutili, senza i metodi che le leggono e le scrivono. Con public e private definisco il livello di riservatezza delle variabili, si parla di accessibilità rispetto alla visibilità interna o esterna, con delle variabili che in caso di private saranno consumabili solo all’ interno della classe:

/*
<?php
class Libro {
public $titolo;
public $autore;
public $codiceisbn;
public $prezzo;
private $quantita;
}
*/

classe inserita all’interno di una cartella arbitraria che verrà linkata sulla pagina di visualizzazione in questo modo, da notare l’uso della parola chiave NEW che crea l’oggetto vero e proprio:

/*
<?php
require_once “Classi/Libro.php”;
$nlibro = new Libro();
//echo $nlibro;
$nlibro -> titolo = ‘Le tigri di Mompracem’;
var_dump($nlibro);
*/

Una volta che abbiamo la ricetta per realizzare la torta possiamo istanziare e accedere alle proprietà. SI crea quindi la definizione della classe e si istanzia per creare un oggetto reale con la parola chiave NEW. La sintassi é $oggetto=NEW nomeclasse(); che non ha ancora la definizione delle proprietà al suo interno. Per accedere alle proprietà della classe dall’ esterno posso puntare solo sulle variabili di tipo PUBLIC, come visto sopra, omettendo al simbolo del dollaro menzionando la variabile: $nlibro -> titolo = ‘Le tigri di Mompracem’; in questo modo vado a travasare il contenuto della variabile nel vaso corrispondente, perché le variabili sono zone di memoria che conservano i dati.

E se volessi inserire nella definizione della classe un metodo tipo leggoTitolo con visibilità pubblica quindi accessibile dall’ esterno? Dovrò inserire una funzione interna alla classe che mette in moto dei metodi o delle azioni che fanno delle cose, la sintassi sarà $oggetto -> metodo:

/*
<?php
class Libro {
public $titolo;
public $autore;
public $codiceisbn;
public $prezzo;
public $quantita;

public function leggoTitolo() {
// return $titolo;
return $this->titolo;
}

}
*/

A questo punto la spontanea domanda, che lo script risolve, come faccio ad accedere a una variabile interna di una classe, trova la sua risoluzione. Bisogna fare molta attenzione alla sintassi perché va introdotta un’ altra parola magica: THIS! Con this possiamo accedere alle variabili interne di una classe: return $this->titolo; e far riferimento alla proprietà dell’ oggetto corrente.

E sevolessi stampare a video titolo e autore dopo aver settato le proprietà grazie a this? Vediamo la definizione della classe e il suo file di lettura:

/*
<?php
class Libro {
public $titolo;
public $autore;
public $codiceisbn;
public $prezzo;
private $quantita;
public function leggoTitoloAutore() {
// return $titolo;
return $this->titolo . ‘-‘ . $this->autore;
}
}
*/

/*
<?php
require_once “classi/Libro.php”;

$nlibro = new Libro();
$nlibro->titolo = ‘Sandokan’; // con this posso dare un valore alla prorpietà
$nlibro->autore = ‘Salgari’;
echo $nlibro->leggoTitoloAutore();
*/

 

Il risultato finale sarà il seguente: https://www.farwebdesign.com/PHPOOP/5/