NODE, javascript lato server, istruzioni per l’uso

Se c’è qualcosa di interessante in questa epoca che stiamo vivendo è che la distribuzione della conoscenza non è più esclusiva di scienziati, prelati o uomini di armi come nel medioevo di Leonardo Da Vinci per esempio, che avrebbero avuto da perderci nei loro profitti favorendo i loro bellicosi competitors, oggi una quantità inesauribile di tecnologie per costruire web app sono a disposizione di tutti per favorire sviluppo e innovazione tecnologica. Javascript lato server è una tecnologia ormai di ampia diffusione e Node, https://nodejs.org/en/, in quanto runtime JavaScript guidato da eventi asincroni, il software è progettato per creare applicazioni di rete scalabili. Per seguire questo post è sufficiente avere un minimo di base con JS tradizionale e HTML, nulla di trascendentale. Rispetto alla programmazione classica dove il web developer deve costruire i suoi mattoni uno per uno a livello fisico con tanto di tocco di mouse, qui abbiamo il vantaggio di passare a una programmazione velocizzata grazie all’ uso dei comandi che DOBBIAMO eseguire da terminale, operazione un pò ostica all’ inizio se non si è abituati a un simile approccio. Nel seguente esempio “ciao mondo”, molte connessioni possono essere gestite contemporaneamente. Ad ogni connessione viene attivato il callback, ma se non c’è lavoro da fare, js asincrono dormirà, per usare una metafora letteraria. Ciò è in contrasto con il modello di concorrenza più comune di oggi in cui vengono utilizzati i thread del sistema operativo. Il networking basato su thread è relativamente inefficiente e molto difficile da utilizzare. Inoltre, gli utenti di Node sono liberi da preoccupazioni di blocco permanente del processo, poiché non ci sono blocchi. Quasi nessuna funzione in Node esegue direttamente I / O, quindi il processo non blocca mai. Perché nulla blocca, i sistemi scalabili sono molto ragionevoli da sviluppare in Node. Il nodo è simile nel design e influenzato da sistemi come Ruby’s Event Machine o Python’s Twisted. Nodo prende un po ‘più in basso il modello di evento. Presenta un ciclo di eventi come un costrutto di runtime invece che come una libreria. In altri sistemi c’è sempre una chiamata di blocco per avviare il ciclo degli eventi. In genere il comportamento è definito tramite callback all’inizio di uno script e alla fine avvia un server attraverso una chiamata di blocco come EventMachine :: run (). In node non esiste una tale chiamata di ciclo di avvio-evento. Il nodo entra semplicemente nel ciclo degli eventi dopo aver eseguito lo script di input. Node esce dal ciclo degli eventi quando non ci sono più callback da eseguire. Questo comportamento è simile al browser JavaScript: il ciclo degli eventi è nascosto all’utente. HTTP è un cittadino di prima classe in Node, progettato pensando allo streaming e alla latenza bassa. Ciò rende Node adatto alla fondazione di una libreria o di un framework web. Solo perché il nodo è progettato senza thread, non significa che non è possibile sfruttare i core multipli nel proprio ambiente. I processi figlio possono essere generati utilizzando la nostra API child_process.fork () e sono progettati per essere facili da comunicare. Costruito sulla stessa interfaccia è il modulo cluster, che consente di condividere i socket tra i processi per consentire il bilanciamento del carico sui core. Per lavorare con Node è sufficiente un editor performante tipo https://code.visualstudio.com/ per esempio o anche Sublime Text, Brackets o Atom. Il framework che lavora con Node è https://expressjs.com/it/ , libreria web veloce, non categorica e minimalista per Node.js installabile con una semplice riga di comando: $ npm install express –save dove per npm si intende il gestore dei moduli a disposizione per lo sviluppatore. Npm che gestisce le dipendenze modulari è fornito automaticamente al momento dell’ istallazione di Node, ulteriori informazioni sono reperibili anche all’ indirizzo https://www.npmjs.com/. Il comando npm-init create a package.json file ad esempio il comando $ npm init react-app ./my-react-app crea un nuovo progetto basato su React usando create-react-app. il comando npm i npm aggiorna alla versione più recente. Con il comando node posso entrare nella console di programmazione dove posso dire ad esempio che a = 1 e digitando a invio mi verrà restituito 1 e ancora digitando a = 2 posso cambiare il valore della variabile. Posso anche definire una costante con global.a = 3 per esempio; con il comando .exit ritorno alla root utente. Ora proviamo a creare un file con estensione JS nella stessa cartella dove abbiamo creato il JSON ad esempio module1.js e all’ interno scriviamo le seguenti righe di codice:

consol.log(“ciao”);
a = 2;
console.log(a);

quale sarà il risultato lanciando da console con il comando node module1.js il file creato? Vedremo esattamente prima il ciao stampato a video e successivamente nella riga successiva l’esecuzione della istruzione che viene dopo quindi un due. web developer umbriaNelle architetture basate su richiesta risposta nel processo tradizionale io ho una partita a tennis dove il lato client del browser interroga il lato server, con Node abbiamo già detto che questo meccanismo non corre il rischio di interruzioni in quanto il processo è asincrono. Ora nella stessa cartella test creata prima creiamo il file server.js e creiamo un localserver sulla porta 3000 come quello che mette a disposizione xampp per esempio. Nel file server.js scriveremo:

var http = require(‘http’);
var server = http.createServer(function(req, res) {
console.log(‘inizia la richiesta!’);
res.write(‘ho ottenuto la tua richiesta’);
res.end();
});
server.listen(3000);

lanciando il file con il solito comando node server.js (anche senza estensione) e aprendo la pagina 127.0.0.1:3000 o anche localhost:3000, vedremo come si comporta esattamente lo script dalla finestra terminale non appena avrò digitato a video il mio URL. Ovviamente con Node abbiamo il vantaggio di usare EXPRESS Server. Con il comando npm i express –save posso installare il mio pacchetto modulo all’ interno della cartella node_modules. Ora posso fare lo stesso rispetto alla creazione di un localserver, quindi creo il file serverex.js e dentro scriverò le seguenti istruzioni, precedendo questa operazione dalla creazione del famoso file index.html che si trova nella root che andremo a inserire dentro la famosa cartella PUBLIC tipica dell’ architettura da erigere per una web app, ossia l’area dove saranno visibili le parti interattive con l’utente a video. Quindi:

var express = require(‘express’);
var app = express();
var server = app.listen(3000, listening);
function listening() {
console.log(“sono in ascolto”);
}
app.use(express.static(‘public’));

web developer umbriaA questo punto lanciando il comando node serverex.js il terminale si metterà in ascolto e lanciando il nostro localhost noteremo che automaticamente il contenuto della nostra cartella PUBLIC verrà mostrato all’ utente. Riassumento in questo post abbiamo visto che javascript lato server o NODE è facilmente installabile sul nostro computer. Abbiamo anche visto come installare il modulo EXPRESS o il server dedicato che ha i suoi comandi per il restart o lo spegnimento. Abbiamo visto la semplicità di alcuni comandi (ma non tutti, ad esempio il parametro -g alla fine di una stringa viene usato per le installazione GLOBALI sulla propria macchina) per iniziare ad entrare nella shell di programmazione o per installare o lanciare eseguibili. Abbiamo anche dato una occhiata all’ architettura di base capito l’importanza di alcune cartrelle funzionali come PUBLIC o la cartella NODE_MODULES, oltre a padroneggiare a livello base alcuni strumenti legati al browser come la web.consol o gli editor di testo per gestire il codice. Come primo approccio può bastare, in uno dei prossimi appuntamenti entreremo nella progettazione vera e propria di una WEB APP con NODE!




Il seicento di Don Giovanni Cantoni e l’Italia in decadenza

Don Giovanni Cantoni il parroco che gestisce Collemosso nella prima metà del seicento in Umbria, con una Italia di sfondo che sembra equiparata a una sorta di bella addormentata nel bosco, ha ormai acquisito credibilità sul campo e legittimazione ad esistere dopo tre riconoscimenti ufficiali che lo vedono pubblicato a destra e a manca su alcune antologie nazionali nati da concorsi letterari. Ma chi è questo personaggio e come si inquadra nel periodo storico? Chi fa sport sa bene che il modo migliore di utilizzare il tempo quando l’atleta non ha prestazioni dirette da offrire sul campo è quello di prepararsi per la gara successiva, magari usando il tempo passivo per un lavoro di revisione critica o di conoscenza sugli avversari o programmando una tabella di marcia per i prossimi impegni. Anche l’aspirante campione che si cimenta nella letteratura condominiale ha gli stessi obblighi, nel senso che se ha in progetto di scrivere di storia, può usare la crisi cosiddettà delle terre di mezzo (mancanza di scintille creative e materiale fluente che abbia senso compiuto sulla carta) per ricaricare il fucile e acquisire competenza sul periodo storico in esame, per esempio. Don Giovanni Cantoni è un criminale travestito da prete sottomesso che ridistribuisce la ricchezza accumulata con la coercizione e il plagio dai suoi stessi governanti in favore dei compaesani e del popolo e questo lo può fare dopo che nei suoi trascorsi passati vi è stata una esperienza unica di addestramento come sicario alla tana degli assassini, un progetto finanziato dal duca di Urbino ma gestito da strane cariche al soldo del Papa, una località segreta orientativamente ubicata nel confine umbro marchigiano in un terreno boscoso caratterizzato da anfratti cavernosi lungo l’appennino, questo ai primi del seicento. Ma quello che accade a Collemosso non è altro che specchio di un gioco più grande che fa girare i suoi giganteschi ingranaggi nella grande storia, che malgrado tutto finisce per influenzare le beghe dei piccoli umani anche a livello locale. Allora come è questo seicento buio dove vengono consumati trucidi delitti legalizzati (vedi la morte di Bruno inizio secolo per esempio)? Salta subito all’ occhio il restringimento dell’ Italia come blasone internazionale, anche se solo la famosa banca di Genova amplificherà ancora per poco le sue gesta, dal momento che i prestiti agli spagnoli padroni non verranno onorati: questo perchè il rinascimento e i suoi riverberi sono alla frutta, perchè la scoperta dell’ America ha portato al declino delle repubbliche marinare che non possono competere con le grandi flotte commerciali di paesi come Olanda, Inghilterra e Spagna in rotta verso l’Atlantico e il Nuovo Mondo brulicante di ricchezze, un crollo prodotto da una Spagna che governa gran parte del territorio e che essendo egli stessa sommersa dai debiti e al declino nella sua classe dirigente ancora centrata su una fiducia da rigido feudalesimo che tramanda le sue cariche in virtù di logiche clientelari, non è in grado di portare innovazione e sviluppo sulla penisola a causa della sua politica vessatoria indotta sui popoli sottomessi per pagare il peso di guerre europee molto dispendiose. Il restringimento delle città marinare che dominavano l’Europa come Venezia per esempio, porta anche al restringimento del business come quello dei tessuti per citarne uno, in quanto non è più l’italia al centro del business, ma il mondo. Come se non bastasse lo stesso Manzoni parla di una famosa peste nel suo romanzo storico i promessi sposi (anni trenta) e anche le cronache locali riportano un terribile flagello nell’ indotto di Collemosso (Colle di Nocera Umbra nella realtà) e dintorni (anni cinquanta) che decimerà la popolazione mentre un parroco locale morirà nel tentativo di arginarne i suoi effetti nefasti (nella storia reale è Don Francesco Faraoni, ma nel mio filone rivoluzionario non è altro che Don Giovanni Cantoni che si pone alla stregua di un novello John Connor della saga di Terminator per organizzare una resisteza ideologica e culturale che web developer umbriadovrà servire come leva per rimuovere i regimi autoritari centrati sull’ oppressione e il controllo delle genti gravate da dazi e tasse insostenibili. Per compiere questa operazione deve educare le masse in gran segreto e accumulare libri strategici che la chiesa sta bandendo al rogo come quelli di Keplero, Galileo, Copernico ma anche quelli che inneggiano alla ribellione e alla rivoluzione, come la città del sole di un Campanella sopravvissuto solo per astuzia all’ inquisizione fingendosi pazzo e che abolisce il concetto tanto caro alla chiesa come quello di proprietà senza autorizzazione. Quindi se da un lato il personaggio fa buon viso con il vescovo che gli impone vincoli e restrizioni, dall’ altro fa cattivo gioco capeggiando egli stesso assalti guidati con i suoi briganti nascosti sulle falde del Monte Merlana per sottrarre alla chiesa in transito verso i porti marchigiani impegnati con una potenziale lotta contro le mire espansionistiche dell’ impero ottomano, ciò che ella stessa ruba senza rispettare le leggi. Gli scenari sono abbastanza contorti nel seicento ma quando pensiamo all’ arte di Caravaggio e alla rivoluzione etsetica del Bernini che ci mostra la persuasiva bellezza del declino nel settore artistico o nomi come quelli di Bacone e la sua filosofia naturalistica in Inghilterra, alla Francia e alla rivoluzione operata da Cartesio, alle indicazioni sconvolgenti di Keplero in campo astronomico e tutto quello che abbiamo contemporaneamente in Italia (appunto vedi intellettuali finiti abbrustoliti ma anche gente come Galileo o Campanella), possiamo pensare a un secolo che trasforma radicalmente il mondo antico per plasmarlo in un incubatore di quello moderno. Il seicento con i suoi laghi di sangue delle guerre anche religiose non è solo un ponte verso la costruzione della società moderna ma un sistema dove le rivolte ideologiche e culturali e militari vengono fomentate e messe in atto per liberare il popolo dall’ oppressore. Il tema della giustizia sociale che caratterizza anche la nostra epoca è centrale nel seicento così come quello del conflitto permanente tra le parti offese dal sistema e quelle invece che cercano di assicurarsi l’immobilità del tessuto sociale per meglio controllare e dissanguare. In questo quadro poco idilliaco dove per strada potevi essere sbranato da lupi armati di spade e archibugi solo in una stregua lotta per la sopravvivenza, trova fertile comparsa la figura di DGC che ha una personalità bipolare scissa tra il suo passato sanguinario che lo ha visto sopravvivere a esercitazioni crudeli e il suo bisogno di giustizia e di contemplazione della bellezza che gli fa ammirare anche le opere dei suoi contemporanei. Uno spirito nobile plagiato da istinti animali efferati che però vengono messi al servizio della comunità, con azioni silenziose che sfuggono alla tracciatura del vescovo Fiodenzi. Indubbiamente i moti di vitalità in tutta Europa che si spostano dal sud verso il nord, alimentati anche dal diffondersi da nuovi movimenti protestanti che lasciano l’Italia ancora scombussolata dagli echi del concilio di Trento, tolgono credibilità internazionale alla penisola, anche perchè le spinte nazionalistiche indotte dalle posizioni religiose provocano terremoti bellici di sanguinosa portata nel continente (guerra dei trenta anni a partire dal 1618). Il seicento è un secolo nero come la profondità del cosmo senza stelle e senza dio, come una statua di ebanite senza linee, come un quadro pervaso da una miriade di demoni affamati brulicanti di pece che emergono dalla tela per sostenere la cruenta lotta per la sopravvivenza. La sensazione è che DGC si trova a suo agio a combattere i campioni della prepotenza mentre molto meno può fare e ne esce sconfitto quando di fronte ha le estreme unzioni da consumare causate dalle carestie inaccettabili prodotte dall’ uomo, contro la fame indotta dall’ ingiustizia sociale DGC diventa in gergo inglese un powerless e il suo sguardo di parrocco ne esce impotente dopo l’ennesima morte di un popolano perso nella miseria che non è solo quella materiale o quella di un bambino ucciso prematuramente dalle malattie. Il seicento è un secolo dannato per definizione, pieno di squarci di luce ma anche di torrenti di sangue e ha anche inquietanti analogie con il mondo attuale, fortunatamente con alcune brutali malattie definitivamente sconfitte. Che sia anche il nostro tempo solo un trampolino di lancio verso la costruzione di società migliori prive del servilismo e dai comportamenti indotti dalla logica del denaro nel modello globalizzato? Se la risposta è si, allora anche in questa era esistono dei supereroi che stanno combattendo di nascosto per rivendicare equilibrio ed equità sociale? Ce lo auspichiamo in termini di prospettivee di crescita evolutiva e non implosiva, non lo sappiamo. L’unica cosa certa è che DGC è riuscito a mettere le mani su un altri libro eretico da sistemare nella sua biblioteca maledetta prima che venga bruciato dai suoi nemici che egli stesso serve: https://umbriawaynoir.wordpress.com/2019/06/05/triplete-con-don-giovanni-cantoni-coppa-italia-scudetto-e-champions-league-nella-letteratura-condominiale/




Progetto storico fotografico su Colle di Nocera Umbra

Stiamo allestendo un archivio documentale fotografico dotato di tutte le moderne comodità dei motori di ricerca per cercare ogni tipo di informazione su Colle di Nocera Umbra con l’idea di metterlo presto in linea: storia, location, tradizioni, curiosità, landscape, skyline, epoche vintage di come eravamo etc etc. Il progetto è open source e non ha fini di lucro se non rispondere alla domanda dantesca che Sante Cioli nel suo secondo libro su Castrum Collis pone come incipit di una avvincente narrazione storica: “chi fur li maggior tui?” . Colle appartenente alla Terre di Mezzo (meno male che non c’è Sauron..o sì?) ha dalla sua delle radici fortemente caratterizzate stigmatizzate per l’appunto dai due lavori del compianto SC, che è riuscito a vagliare una enorme quantità di materiale archivistico che consentono al collegiano di sapere tutto su chi era e dove sta andando (se mai servisse!). Il progetto è open source e non ha fini di lucro, se mai ha permesso a Umbriaway Consulting di risolvere alcuni problemi tecnici per costruire una interfaccia grafica minimale ma funzionale e precisa anche nei criteri di ricerca, nel senso che anche una semplice parola come “agricoltura” o “vintage”, può richiamare il materiale fotografico connesso, oltre naturalmente a estrapolare comodamente il materiale semplicemente selezionando dal menù a tendina per categoria. Chiunque può partecipare attivamente al progetto inviando foto o materiale che verrà catalogato con il nome imposto della sorgente. Hai una foto del paleolitico su Colle di Nocera Umbra che ci mostra come eravamo? Hai delle curiosità storiche-antropologiche da proporre con documentazioni testuali? Vuoi semplicemente valorizzare un tramonto collegiano su uno skyline che certamente non è come quello di Los Angeles ma altrettanto unico e irripetibile per un momento da cartolina? Per partecipare a questa iniziativa compilare il modulo di contatto presente all’ indirizzo https://www.umbriaway.eu/contatti/ sarete tempestivamente attivati! In ogni caso prossimamente il progetto verrà inizializzato con le informazioni base presenti e sarete informati sull’ indirizzo web pubblicato. Nel frattempo sono disponibili free le gallery https://www.umbriaway.it/collegallery/ e https://www.farwebdesign.com/collegallery/




Colle Search, il traduttore delle terre di mezzo!

web designer umbriaScine, none, damme la petriola, te dò una rocciata giù le gambe, che te sei nuggita e via cantando. Ma perchè sulla dorsale Gualdo Tadino Nocera Umbra parlano cuscine? Cuscine che significa cuscino? Se uno arriva da Oxford e legge il bollettino che fanno al Grottino ci ha bisogno di un traduttore dei termini dialettali? Niente paura Umbriaway Consulting sensibile a tutte le forme di erudizione ha messo in moto un progetto di decriptazione semantica per tradurre i geroglifici di Champollion con un semplice tocco del mouse. Basta recarsi all’ indirizzo: https://www.umbriaway.eu/collesearch/ e digitare il termine delle terre di mezzo (Colle del resto si trova a metà strada tra Nocera e Gualdo a cavallo tra i CAP 06025 e 06023) da tradurre in presunto italiano e il gioco è fatto, al momento l’ufficio tecnico ha inserito solo lo scine, il none, marraccione e la famosa rocciata a scopo dimostrativo ma c’è da giurare che qualche simpatica storpiatura borderline dei parlanti locali, invidiata persino dall’ accademia della crusca, finirà presto vivisezionata nel DB Colle Search! Google Search ce spiccia casa quando c’è da imprimere qualche lieve storpiatura agli avverbi comuni ma non solo quelli! Al di là degli aspetti ironici che non mancano sarebbe interessante capire come nascono certe espressioni idilliache locali, non sarà stato mica Dante quando bazzicava per l’Umbria che ha seminato proseliti dotati linguisticamente rifacendo il verso a Gengis Kahn nelle steppe asiatiche solo per fagocitare l’incremento demografico in volgare?! Mah! Comunque se non sai che cosa indicano i parlanti locali con l’espressione “sei proprio un marraccione” don’t worry! Oggi c’è il traduttore universale delle terre di mezzo di Umbriaway Consulting, consultabile all’ indirizzo: https://www.umbriaway.eu/collesearch/ !




Esistono gli arbitri venduti? C’è un listino prezzi ed esiste un gestionale per contattarli? Certo, da oggi puoi usufruire di venduto crud versione 1.0 di Umbriaway Consulting!

web developer umbriaCome fare quando un arbitro serve per veicolare una partita decisiva per la classifica? Chi sono quelli maggiormente corruttibili? Come li contattiamo? Ora essendo l’argomento delicatissimo ci siamo astenuti dall’ inserire nella tabella di base che abbiamo ribattezzato product in quanto seppure umanamente tangibili i venduti sono solo equiparabili alle logiche bce della globalizzazione a pozzanghere liquide, qui dati sensibili come numero di telefono, indirizzo e mail a corredo che abbiamo occultato per evitare diffamazioni. Ovviamente l’esercizio é finalizzato a sviscerare meglio il potenziale offerto da PHP come tecnologia. Quindi poche banfate e molti fatti, utilizzeremo PHP, MYSQL, CSS , HTML5 per mettere in piedi il nostro potentissimo applicativo che avrà i seguenti file a corredo:

  • index.php che é la lista di default visibile dal nostro applicativo
  • add.php che serve per aggiungere dati
  • edit.php (o se volete anche update.php) che ci servirà a modificare i dati
  • una cartella conn che al suo interno conterrà il connect.php responsabile del collegamento al DB
  • una cartella css che conterrà al suo interno tre file, ciascuno dei quali formatterà il bottone aggiungi arbitro, la tabella di base nella index o lista di nomi e i form che ci serviranno per aggiornare a aggiungere i dati.

Quello che vedi é quello che ottieni per cui iniziamo a costruire prima di tutto il nostro database che basterà importare direttamente nel nostro DB, a scelta in locale o sull’ ambiente di produzione se l’applicativo ci serve davvero! Per fare questa operazione selezioniamo il DB di interesse all’ interno di phpMyAdmin http://localhost/phpmyadmin/ e importiamo la seguente struttura della tabella product con dei dati di esempio che poi modellerempo a nostro piacimento, creando un DB demo per esempio e andando sull’ apposita linguetta SQL messa a disposizione dallo strumento:

/*

— phpMyAdmin SQL Dump
— version 4.1.14
— http://www.phpmyadmin.net

— Host: 127.0.0.1
— Generation Time: Apr 30, 2015 at 09:23 PM
— Server version: 5.6.17
— PHP Version: 5.5.12

SET SQL_MODE = “NO_AUTO_VALUE_ON_ZERO”;
SET time_zone = “+00:00”;

/*!40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT */;
/*!40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS */;
/*!40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION */;
/*!40101 SET NAMES utf8 */;


— Database: `demo`

— ——————————————————–


— Table structure for table `product`

CREATE TABLE IF NOT EXISTS `product` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`name` varchar(250) COLLATE utf8_unicode_ci NOT NULL,
`price` decimal(10,0) NOT NULL,
`quantity` int(11) NOT NULL,
`description` text COLLATE utf8_unicode_ci NOT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci AUTO_INCREMENT=4 ;


— Dumping data for table `product`

INSERT INTO `product` (`id`, `name`, `price`, `quantity`, `description`) VALUES
(1, ‘Name 1’, ‘1000’, 2, ‘good’),
(2, ‘Name 2’, ‘2000’, 3, ‘good’),
(3, ‘Name 3’, ‘3000’, 4, ‘good’);

/*!40101 SET CHARACTER_SET_CLIENT=@OLD_CHARACTER_SET_CLIENT */;
/*!40101 SET CHARACTER_SET_RESULTS=@OLD_CHARACTER_SET_RESULTS */;
/*!40101 SET COLLATION_CONNECTION=@OLD_COLLATION_CONNECTION */;

*/

fatta questa operazione, eseguendo il tutto con l’IMPORT, andremo a creare all’ interno della cartella conn (potete chiamarla come volete, anche connessione, l’idea é quella di usare nomi congruenti identificativi che spiegano da sole il contenuto solo leggendole) un file che chiameremo connect,php che conterrà al suo interno il seguente codice PHP:

/*
<?php
$con = mysqli_connect(‘localhost’, ”, ”, ‘demo’);
?>
*/

web developer umbriadove demo é il nostro DB che ospita la tabella e tutta la stringa non fa altro che sfruttare con un semplice cavo (se vogliamo usare metafore visuali) il collegamento con il core del nostro gestionale tramite la funzione mysqli_connect che accetta come si può osservare quattro parametri o argomenti tra le parentesi per cui abbiamo la macchina server dove puntare, negli ambienti di produzione si utilizzano gli indirizzi IP, il nome utente e la pwd e il nome del DB. In genere in locale spesso il nome utente e la pwd sono in bianco, come nel caso sopra indicato. A questo punto prima di passare ai file diamo un occhiata alla cartella CSS che conterrà come detto tre file, form.css, table.css, button.css che parlano da soli come funzionalità, in pratica ci serviranno per abbellire il nostro applicativo e rendere responsive anche la nostra tabella. Quindi diamo un occhiata a table.css che andrà copiato integralmente senza i /* e */ nel file vuoto menzionato e che qui servono solo ad ingannare wordpress:

/*
table {

border-collapse: collapse;
border-spacing: 0;
width: 100%;
border: 1px solid #ddd;
}

th, td {
text-align: left;
padding: 8px;
}

tr:nth-child(even){background-color: #f2f2f2}
*/

Tralasciamo per ora spiegazioni approfondite su questo codice in quanto il CSS esula al momento dall’ obiettivo che ci siamo posti, ossia mettere in piedi il nostro applicativo. A questo punto vediamo il contenuto del button.css. per farlo abbiamo utilizzato uno dei tanti tools presenti in rete digitando css button tools e nello specifico: https://toolset.mrwebmaster.it/css/button-generator.html che ha generato il seguente codice da incollare dentro il file vuoto menzionato, sempre senza i riferimenti ai commenti:

/*
.btn-toolset {
display: inline-block;
text-align: center;
white-space: nowrap;
color: #FFFFFF;
text-decoration: none;
line-height: 1.2;
font-weight: normal;

font-size: 18px;
background-color: #007BFF;
border-radius: 16px;
padding: 6px 20px;
border: 1px solid #004996;
cursor: pointer;
}
.btn-toolset:hover {
background-color: #0063CC;
border-color: #0056B3;
}
.btn-toolset > strong {
font-size: 24px;
}
*/

ricordiamoci che .btn-toolset come classe dovrà essere aggiunto al nostro bottone che ci consentirà di aggiungere un nuovo arbitro. A questo punto diamo un occhiata anche alla stilizzazione del file form.css:

/*

* {
box-sizing: border-box;
}

input[type=text], select, textarea {
width: 100%;
padding: 12px;
border: 1px solid #ccc;
border-radius: 4px;
resize: vertical;
}

label {
padding: 12px 12px 12px 0;
display: inline-block;
}

input[type=submit] {
background-color: #4CAF50;
color: white;
padding: 12px 20px;
border: none;
border-radius: 4px;
cursor: pointer;
float: right;
}

input[type=submit]:hover {
background-color: #45a049;
}

.container {
border-radius: 5px;
background-color: #f2f2f2;
padding: 20px;
}

.col-25 {
float: left;
width: 25%;
margin-top: 6px;
}

.col-75 {
float: left;
width: 75%;
margin-top: 6px;
}

/* Clear floats after the columns */
.row:after {
content: “”;
display: table;
clear: both;
}

/* Responsive layout – when the screen is less than 600px wide, make the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
.col-25, .col-75, input[type=submit] {
width: 100%;
margin-top: 0;
}
}

*/

dopo aver mostrato il contenuto delle due cartelle css e conn nonc i resta che costruire i tre file menzionati, con index.php come priorità, collegando tutti i file esterni appena creati, compresa la stringa di connessione e gli stili, cosa che possiamo osservare nelle prime quattro righe di testo:

/*
<link rel=”stylesheet” href=”css/table.css”>
<link rel=”stylesheet” href=”css/button.css”>
<?php
require ‘conn/connect.php’;

if(isset($_GET[‘action’])){
$id = $_GET[‘id’];
mysqli_query($con, ‘delete from product where id=’.$id);
}
?>
<a href=”add.php” class=”btn-toolset”>Add arbitro</a>
<br>
In questa tabella sono presenti i nominativi degli arbitri che si offrono per prestazioni varie alle squadre più vincenti d’Italia. Non potendo più usufruire di vetture per il loro rientro a casa si limitano solo a richieste ufficiose sul codice IBAN.
<table cellpadding=”2″ cellspacing=”2″ border=”1″>
<tr>
<th>Id</th>
<th>Name</th>
<th>description</th>
<th>quantity</th>
<th>Price</th>
<th>Option</th>
</tr>
<?php
$result = mysqli_query($con, ‘select * from product’);
while($product = mysqli_fetch_object($result)){
?>
<tr>
<td><?php echo $product->id; ?></td>
<td><?php echo $product->name; ?></td>
<td><?php echo $product->description; ?></td>
<td><?php echo $product->quantity; ?></td>
<td><?php echo $product->price; ?></td>
<td align=”center”><a
href=”index.php?id=<?php echo $product->id; ?>&action=delete”
onclick=”return confirm(‘Are you sure?’)”>Delete</a> |
<a href=”edit.php?id=<?php echo $product->id; ?>”>Edit</a>
</td>
</tr>
<?php } ?>
</table>
*/

In questa pagina ci sono molte cose interessanti dal punto di vista didattico da spiegare, ma per ora limitiamoci a riportare il codice per ogni singolo file, a questo punto possiamo creare il nostro add.php che non sarà altro che un semplice form con la query insert:

/*
<link rel=”stylesheet” href=”css/form.css”>
<?php
require ‘conn/connect.php’;
if(isset($_POST[‘submitSave’])){
$name = $_POST[‘name’];
$price = $_POST[‘price’];
$quantity = $_POST[‘quantity’];
$description = $_POST[‘description’];
mysqli_query($con, ‘insert into product(name, price, quantity, description) values(“‘.$name.'”,’.$price.’,’.$quantity.’,”‘.$description.'”)’);
header(‘Location: index.php’);
}
?>
<form method=”post”>
<table cellpadding=”2″ cellspacing=”2″>
<tr>
<td>Name</td>
<td><input type=”text” name=”name”></td>
</tr>
<tr>
<td>Price</td>
<td><input type=”text” name=”price”></td>
</tr>
<tr>
<td>Quantity</td>
<td><input type=”text” name=”quantity”></td>
</tr>
<tr>
<td>Description</td>
<td><textarea rows=”5″ cols=”20″ name=”description”></textarea></td>
</tr>
<tr>
<td>&nbsp;</td>
<td><input type=”submit” name=”submitSave” value=”Save”></td>
</tr>
</table>
</form>
*/

mentre per la pagina di aggiornamento che contiene la query update, ossia edit.php avremo:

/*
<link rel=”stylesheet” href=”css/form.css”>
<?php
require ‘conn/connect.php’;
if(isset($_GET[‘id’])){
$result = mysqli_query($con, ‘select * from product where id=’.$_GET[‘id’]);
$product = mysqli_fetch_object($result);
}
if(isset($_POST[‘submitSave’])){
$id = $_POST[‘id’];
$name = $_POST[‘name’];
$price = $_POST[‘price’];
$quantity = $_POST[‘quantity’];
$description = $_POST[‘description’];
mysqli_query($con, ‘update product set name=”‘.$name.'”, price=’.$price.’, quantity=’.$quantity.’, description=”‘.$description.'” where id=’.$id);
header(‘Location: index.php’);
}
?>
<form method=”post”>
<table cellpadding=”2″ cellspacing=”2″>
<tr>
<td>Id</td>
<td><?php echo $product->id; ?> <input type=”hidden” name=”id”
value=”<?php echo $product->id; ?>”></td>
</tr>
<tr>
<td>Name</td>
<td><input type=”text” name=”name”
value=”<?php echo $product->name; ?>”></td>
</tr>
<tr>
<td>Price</td>
<td><input type=”text” name=”price”
value=”<?php echo $product->price; ?>”></td>
</tr>
<tr>
<td>Quantity</td>
<td><input type=”text” name=”quantity”
value=”<?php echo $product->quantity; ?>”></td>
</tr>
<tr>
<td>Description</td>
<td><textarea rows=”5″ cols=”20″ name=”description”><?php echo $product->description; ?></textarea></td>
</tr>
<tr>
<td>&nbsp;</td>
<td><input type=”submit” name=”submitSave” value=”Save”></td>
</tr>
</table>
</form>
*/

A questo punto non ci resta che modellare i nostri dati nel DB per avere il nostro DB pronto all’ uso e aiutare qualche squadra blasonata a caccia del triplete per migliorare la sua classifica. Ma prima dobbiamo soffermarci su tutta una serie di istruzioni base presente in questo potentissimo applicativo:

  • la presenza dell’ istruzione require ‘conn/connect.php’; tra tag dedicati indica alla pagina di andarsi a connettere con i dati presenti nel file connect.php
  • i link <link rel=”stylesheet” href=”css/form.css”> vanno a vestire in modo stiloso le nostre parti grezze HTML

Analisi del meccanismo di cancellazione, se diamo un occhiata a questo codice della index:

/*
<?php
if(isset($_GET[‘action’])){
$id = $_GET[‘id’];
mysqli_query($con, ‘delete from product where id=’.$id);
}
?>

e la successiva parte finale della sezione option del link di cancellazione:

<td align=”center”>
<a href=”index.php?id=<?php echo $product->id; ?>&action=delete”
onclick=”return confirm(‘Are you sure?’)”>Delete</a> |
<a href=”edit.php?id=<?php echo $product->id; ?>”>Edit</a>
</td>

/*

ci accorgiamo che schiacciando il link verrà inviata una richiesta GET a inizio pagina che catturerà il parametro ID del record da cancellare più l’azione fisica dell’ eliminazione che passa tramite un metodo java script con loggetto CONFIRM che aprirà una finestra diu dialogo che ci chiederà di pensarci bene prima di continuare, in quanto stiamo per togliere un record. Come sappiamo CRUD in PHP sta per create, read, update, delete quindi non ci resta che dare un occhiata alla query che nella index ci fa fare la letura READ:

/*
<?php
$result = mysqli_query($con, ‘select * from product’);
while($product = mysqli_fetch_object($result)){
?>
*/

Per aggiungere e creare tramite add.php abbiamo la seguente query:

/*
<?php
require ‘conn/connect.php’;
if(isset($_POST[‘submitSave’])){
$name = $_POST[‘name’];
$price = $_POST[‘price’];
$quantity = $_POST[‘quantity’];
$description = $_POST[‘description’];
mysqli_query($con, ‘insert into product(name, price, quantity, description) values(“‘.$name.'”,’.$price.’,’.$quantity.’,”‘.$description.'”)’);
header(‘Location: index.php’);
}
?>
*/

mentre per il nostro aggiornamento dati UPDATE la pagina edit.php conterrà:

/*
<?php
if(isset($_POST[‘submitSave’])){
$id = $_POST[‘id’];
$name = $_POST[‘name’];
$price = $_POST[‘price’];
$quantity = $_POST[‘quantity’];
$description = $_POST[‘description’];
mysqli_query($con, ‘update product set name=”‘.$name.'”, price=’.$price.’, quantity=’.$quantity.’, description=”‘.$description.'” where id=’.$id);
header(‘Location: index.php’);
}
?>
*/

web developer umbriaA questo punto abbiamo ottenuto qualcosa che già funziona, e che potremmo abbellire in seguito magari usando bootstrap, per esempio inserendo una barra superiore con dei menù, ma per ora abbiamo centrato l’obiettivo: se qualche squadra zebrata avrà bisogno di una direzione di gioco molto flessibile per non dire altro, potrà consultare il database e aggiornarlo e anche cancellare quei nominativi che nel frattempo dopo un lungo periodo di psicoanalisi sono tornati sulla retta via e non potranno prendere decisioni discutibili durante la partita! Al prossimo applicativo con il codice spiegato passo passo con Umbriaway Consulting! Importante: essendo alcuni campi settati per ospitare numeri interi, non potranno funzionare nell’ inserimento o nell’ aggiornamento dei dati se abbiamo la pessima idea di inserire delle stringhe! Da notare che avendo insrito nella struttura del DB anche la codifica dei caratteri UTF-8 anche gli apostrofi che in genere creano problemi con PHP sono permessi. Per girare in locale il gestionale arbitri venduti avrà bisogno di un applicativo come XAMPP da scaricare dalla rete. See you later con il prossimo applicativo




Come si costruisce un tema WordPress? Chiedilo a un albero!

Che cos’è un ambiente di sviluppo per wordpress?

Per un albero un ambiente di sviluppo é un luogo ottimale dove crescere sano e quindi una location approvvigionata da aria, acqua, sole e sostanze nutritive che gli arrivano dalla terra. Anche per WordPress l’ambiente di sviluppo per un aspirante developer ha queste caratteristiche. Si lavora localmente e solo dopo si finisce nell’ ambiente di produzione, i vantaggi sono evidenti, nell’ ambiente pubblico tutto deve essere funzionale per l’utente mentre localmente andando a sviluppare funzionalità che non sono complete le cose sono volatili e temporanee. In locale lavoriamo sul nostro computer non sul cloud. Un server lontano 400 km non è il nostro computer locale, semmai solo il computer ufficiale che ospiterà il nostro ambiente di produzione, attivo 24 ore al giorno, che ospiterà fisicamente i nostri files fisici. Lavorando in locale non ho necessità di una connessione internet per esempio. Il tuo progetto in locale quindi sarà visibile solo da te, questo per accendere la luce sulle differenze sostanziali tra l’ambiente di sviluppo e quello di produzione. E’ buona prassi salvare localmente e lavorare solo al di fuori dell’ ambiente di produzione perchè i refusi sono visibili solo a noi stessi e non ho la necessità ogni volta di fare il famoso FTP per trasferire i dati. Quindi la domanda adesso é wordpress di che risorse ha bisogno per funzionare, esattamente come un albero che attinge alla luce del sole e alle risorse idriche del terreno? Un server Apache su cui fare girare PHP e un database in genere MySql. Localmente ci sono vari tools che assolvono a questa mission come xampp per esempio o l’interessante strumento di configurazione https://localbyflywheel.com/ che guida velocemente l’utente per mettere insieme le funzionalità base. Il download non é immediato ma la procedura guidata poi aiuta avviando l’eseguibile dalla cartella di download. Avvierà virtual box e i servizi di hosting in locale, dopo la configurazione verrà richiesto di settare i parametri di collegamento, con utente, pwd e mail, dopodiché verranno importati i file del nostro progetto in locale nel percorso c:/utenti/nomeutente/local sites. A questo punto abbiamo dato all’ albero tutta la linfa vitale per iniziare le modalità di sviluppo e nutrirlo e non ci resta che sperimentare con una prima pagina in php la correttezza del nostro setup di configurazione. Dentro la cartella Local Sites avrò una cartella di progetto che conterrà APP che aperta presenterà una cartella PUBLIC, ed é qui dove risiede come si dice in gergo tutto l’ambaradan per lo sviluppo. Procuriamoci quindi un editor per creare e modificare codice come Atom, SUblime Text o Visual Studio Code per esempio. Dopodiché creiamo un file vuoto con estensione php e possiamo fare i nostri esperimenti, tipo settare una variabile, stamparla a video tra blocchi di codice html o compiere semplici operazioni matematiche di prova per visualizzarle nel sito. Ora che sappiamo dove si trovano tutti i file dell’ applicazione non sarà certo un problema mettere in piedi questo file vuoto nella root del nostro progetto e visualizzarlo nella url del sito sleshato con il nome del file appena creato, dopo aver attivato il nostro server in locale, questo solo per capire il funzionamento di base di come php svolge le sue mansioni all’ interno di un server apache attivo e funzionale con tanto di db per il proseguo. Tutto ciò ci permetterà di familiarizzare con la struttura delle directory e con il funzionamento di base di tutto il nostro wordpress in locale che presenta tutta una serie di potenzialità di personalizzazione, tali da consentirci di mettere in piedi progetti complessi. PHP come linguaggio di programmazione lato server porta già una bellissima notizia: trattasi di una serie di istruzioni non tipicizzate, ossia senza l’obbligo di dichiarare il tipo di variabili, in quanto il sistema le riconosce in automatico. Posso mescolare php direttamente nell’ html , l’importante è che ciò avvenga all’ interno di pagine con estensione php, in modo da imporre delle direttive di comportamento al mio wordpress e indurlo a fare quello che noi vogliamo che faccia. A questo punto il passo successivo é quello di creare il nostro vestito wordpress il cosidetto tema. Niente paura, è meno complicato di quello che sembra perché la famosa cartella wp-content dove sono presenti tutti i temi di configurazione è facile da trovare dalla root del nostro progetto. All’ interno troviamo Themes e qui dentro creeremo una cartella con il nostro tema specifico che verrà visto in automatico nella dashboard. All’ interno di questo vestito metteremo in piedi due file, il classico index.php e lo style.css; nel primo ho il tema da visualizzare e nel secondo tramite la sintassi /* e */ posso inserire le informazioni generali del tema come la versione o il nome dell’ autore per la dashboard, semplificando il file style.css contiene, oltre alle informazioni del tema, anche il codice css che ne gestisce l’aspetto, per esempio la parte visibile nella dashboard:

/*
Theme Name: Guercio-demo
Theme URI: http://www.guercio.com/guercio
Author: Guercio author
Author URI: http://www.guercio.com
Description: Guercio, un progetto didattico che sviscera il potenziale wordpress
Version: 1.0.5
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: white, two-columns, right-sidebar, responsive-layout, flexible-header, custom-header, custom-menu, editor-style, featured-images, post-formats, sticky-post, translation-ready, custom-background
Text Domain: guercio
*/

attivando il tema si vedrà il contenuto della nostra pagina index.php e nella dashboard nel menù apparence-themes si vedrà anche l’icona del tema di selezione se nella cartella predefinita per il nostro vestito abbiamo inserito il nostro screenshot.pgn, che verrà rilevato in automatico nella modalità di visualizzazione e scelta presente dopo il login da url http://nomeprogetto.local/wp-admin

A questo punto abbiamo familiarizzato con il nostro primo tema, non ci resta che fare un passo ulteriori verso le funzioni di wordpress prima notiamo che cancellando le directory con i temi che non mi servono da file system, in automatico scompariranno dal menù apparence-themes del pannello di controllo di wordpress. Andando sul pannello di controllo, voce di menù generali, abbiamo delle voci tipo il TITLE e il TAG che corrispondono a funzioni predefinite di wordpress che estrapolano e stampano sulla pagina il valore del NOME e della nostra DESCRIPTION come argomenti della funzione bloginfo() nella nostra pagina, è proprio qui che risiede la forza del cms, nel fatto che non devo creare funzioni generali che sono già incluse per tutti i nostri usi, pronte per la riusabilità. Oltre a lavorare con le funzioni lavoriamo anche con gli array, grandi armadi pieni di cassetti che raccolgono informazioni coerenti e raggruppate per categoria da memorizzare e richiamare all’ occorrenza. Lavorare con gli array, collection di oggetti, è fondamentale per cui non ci resta che dare un occhiata a questo aspetto. Gli array possono contenere anche altri array e possono anche essere multidimensionali (molto complessi) e associativi, quando andiamo all’ ikea abbiamo come scelta diversi tipi di armadio da acquistare, ognuno con le sue caratteristiche e il proprio uso. Torniamo però a wordpress che hai dei post e quindi dei contenuti da ciclare al posto di numeri e nomi. Da qui l’importanza dei loop nello scorrimento degli array, cosa che si ottiene per esempio come mostrato in figura con un ciclo while, più prezioso del marmo di Carrara. Sicuramente questo è un argomento cruciale da affrontare, ma prima di andare avanti con una analisi generica sulle potenzialità di wordpress per gli sviluppatori, dobbiamo parlare degli editor di testo in wordpress e in particolare del rilascio delle ultime versioni che aggiornano il front end della compilazione del testo. Per tornare all’ interfaccia classico molto più immediato e incisivo come fare quindi? Si addiziona il plug-in CLASSIC EDITOR, cercandolo dai tools messi a disposizione da wordpress, niente di complicato quindi. La particolarità di questo plug-in é che si porta dietro direttamente dal team di sviluppo dieci anni di consolidamenti rispetto alla nuova versione 5 proposta nel dicembre 2018, è chiaro che gli utenti forse potranno trovarsi meglio con questa interfaccia, trovandosi disorientati con i nuovi pannelloni di testo proposti nelle ultime versioni. Non a caso la discussione su questo nuovo editor é molto accesa e più di un milioni di utenti preferiscono non stravolgere nulla tornando all’ antico anche se c’è da precisare che tutte le funzionalità del nuovo non intaccano nulla della vecchia rappresentazione. E’ bene chiarire subito che WP utilizza una sua ricerca redefinita sulle pagine, nel senso che deve avere nella root del tema pagine come single.php o page.php oltre alla index che farà ruotare i post con il link di approfondimento, che una volta eseguito porterà sulla pagina dei contenuti senza ulteriori link. Nella index tra i tag php di apertura e chiusura del codice, scriveremo (senza i commenti) con il ciclo while segmentato intorno all’ HTML:

/*
<?php

get_header();

while(have_posts()) {
the_post(); ?>
<h2><a href=”<?php the_permalink(); ?>”><?php the_title(); ?></a></h2>
<?php the_content(); ?>
<hr>
<?php }

get_footer();

?>
*/

e qui abbiamo un sacco di funzioni predefinite di WP come get_header(); o get_footer(); o have_posts() o anche the_permalink(); e ancora the_title(); e the_content();. Va da se proprio l’utilità di funzioni già incorporate che assolvono al compito imposto senza dover riscrivere nulla. Dalla index si passerà quindi per il criterio di ricerca sulle pagine alla single.php che avrà questo contenuto:

/*

<?php

get_header();

while(have_posts()) {
the_post(); ?>
<h2><?php the_title(); ?></h2>
<?php the_content(); ?>

<?php }

get_footer();

?>

*/

che é come la precedente ma senza la funzione the_permalink(); che fa esplodere i dettagli della notizia. Il get_header(); rimanda a questo contenuto con la funzione di richiamo wp_head():

/*

<!DOCTYPE html>
<html>
<head>
<?php wp_head(); ?>
</head>
<body>
<h1>Guercio University</h1>

*/

mentre il get_footer(); avrà la sua bella funzione incorporata wp_footer():

/*

<p>Greetings from footer.php</p>

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

*/

Da notare come sono stati modellati i tag body per raccogliere i contenuti delle pagine nel corpo del documento sia nell’ header che nel footer. Ovviamente tutto ciò serve a cambiare rapidamente una sola volta l’area del header o del footer senza riscrivere tutto per mille pagine e avremo la certezza che il nostro intero sito sarà aggiornato. A questo punto abbiamo il problema di incorporare il nostro foglio stile nel tema come fare? Dobbiamo creare un file function.php e scrivere al suo interno:

/*

<?php

function university_files() {
wp_enqueue_style(‘university_main_styles’, get_stylesheet_uri());
}

add_action(‘wp_enqueue_scripts’, ‘university_files’);

?>

*/

le funzioni vanno richiamate ma qui tramite l’istruzione add_action dico che WP deve caricare la funzione university_files senza bisogno di invocarla. Ovviamente adesso la modellazione della pagina CSS dovrà assorbire la nostra prossima azione. Qui possiamo solo concludere che nella funzione sopra university_main_styles e university_files che é anche il nome della funzione sono nomi arbitrari tutto il resto richiama dei comandi specifici di WP.




Social Media Marketing: Twitter overview

Tra i social media https://twitter.com/ è sicuramente il servizio meno indicato per influenzare una propria autopromozione intensiva, anche se in una strategia di 100 comunicazioni stringate da 140 caratteri, dieci twitt (questo termine per inciso che combatte con il famoso tweet è preferibile secondo gli esperti rispetto al suo antagonista troppo “dolce sintatticamente” per la sua volontà di anonimato, coerente con il medium analizzato) dedicati alla promozione di se stessi sono tollerabili. Pensiamo solo a come le notizie arrivino prima su Twitter e poi sui media tradizionali, televisioni e radio. Pensiamo ai politici che fanno dichiarazioni ufficiali a caldo sfruttando questo canale o agli sportivi che plasmano la loro comunicazione con battute efficaci su questo media. Ma di che cosa stiamo parlando esattamente? Lo strumento di marketing nasce nel 2006 ed è famoso per il suo cinguettio dal verbo inglese to tweet, Nell’ ottobre del 2017 è stata messa in piedi una sperimentazione ufficiale per prolungare la stringa di caratteri a 280, raddoppiando il setting di default. Sicuramente twitter è un canale più idoneo per professionisti che intendono allacciare relazioni con settori nevralgici o migliorare la comunicazione con i loro clienti. In questo senso bisogna sapersi destreggiare dentro questo immenso labirinto per coglierne tutte le potenzialità proposte, in modo da capire bene che cosa si intende per follower, per followers o per il famoso simbolo #hashtag. E per ritwittare cosa si intende? Andiamo con ordine. Twitter è quindi una piattaforma ideale per chi vuole tenersi aggiornato prima degli altri, a questo proposito è bene dire che essendo le API pubbliche sono utilizzate da terze parti per arricchire il servizio con applicativi molto utili, tipo dashboard personalizzate dove è possibile monitorare diversi contenuti provenienti da diversi social media. Certamente valorizza il brand della propria azienda anche se il tutto deve avvenire senza politiche di spam ma semplicemente limitandosi ad essere se stessi come individui unici che partecipano a discussioni pubbliche portando il loro contributo di contenuti. Aumenttando la nostra credibilità di interlocutori siamo così in grado di reclutare automaticamente FOLLOWER (coloro che mi seguono) svincolandomi dalla logica del FOLLOWING (cioè coloro che sto seguendo). Mentre il famoso simbolo # indica per l’appunto l’HASHTAG, un tipo di etichetta che ci consentirà di “taggare” le parole chiave più appropriate e performanti per arricchire il bacino relativo a quel topic. Per esempio l’hashtag #smm sta ad indicare la parola chiave social media marketing dove confluiranno tutti i nostri contenuti creati come tipologia di argomento. Come piattaforma veloce che nel giugno del 2017 contava circa 328 milioni di utenti, ne consegue che i TWITT, i famosi cinguettii, hanno vita breve rispetto ad altri social, per cui si ha a che fare con una maggiore frequenza di pubblicazione, essendo per caratteristica i post lunghi per l’appunto solo 140 caratteri. Dalle aziende viene spesso usato come strumento provocatorio per stimolare risposte da parte degli utenti, in modo da avere un feedback tematico. Ovviamente esistono anche servizi a pagamento, tipo i famosi twitt ads, dove i parametri in gioco sono i click, i retwitt e le risposte. La piattaforma si contraddistingue anche per la presenza di aziende pubbliche che devono fornire comunicazioni ufficiali al cittadino in tempi celeri, pertanto parliamo di uno strumento decisamente più professionale rispetto a un FB per esempio, dove le interferenze fake e i filtraggi sulla credibilità della fonte sono spesso viziati da difetti di forma. Certamente si possono ottenere grandi risultati du Twitter, in primis essendo semplicemente se stessi, mostrando la propria credibilità da professionisti così come é nel mondo reale e in secondo luogo alimentando strategie di circolo vizioso basate sulla pianificazione degli obbiettivi, l’ascolto dell’ “audience“, passando per una fase di networking in cui le ralazioni anche peer to peer vanno alimentate, per approdare alla fine al Tweet vero e proprio e all’ analisi dei risultati, strumento essenziale messo a disposizione dalla piattaforma per monitorare le proprie influenze in rete e migliorarle. Per fare la differenza si tratta in ultima analisi di fornire valore aggiunto nella condivisione, cosa che automaticamente porta benefici sul proprio vessillo sventolato nel profilo, che deve essere completo ed aggiornato. Essendo Umbriaway Consulting attenta alla formazione e al digital divide, la cosa migliore è sfruttare come al solito le potenzialità della rete per usufruire di servizi di formazione appropriati, anche su Twitter GRATUITI, passando per UDEMY per esempio, indirizzo internet https://www.udemy.com/ , come per esempio l’ottima esposizione proposta da https://www.udemy.com/come-ottenere-il-massimo-da-twitter/ . Twitter dopo aver svolto il corso non avrà più segreti e la tua presenza in rete verrà amplificata.




Project APP Android: Colle di Nocera Umbra sezione history

UBICAZIONE

Considerando i criteri geografici e orografici, elementi fondamentali per chi doveva spostarsi a piedi o a dorso di cavallo,considerando la caratteristica comune costante ovvero il ritrovamento di resti e tombe in prossimità di sorgenti ubicate in posizioni tali da consentire attività pastorale ed agricola, Colle aveva tutte queste caratteristiche. Infatti aveva la sorgente della ” Fonte Vecchia”, la possibilità di Pascoli e di terreni arabili e una posizione leggermente elevata rispetto alla valle sottostante che nel passato doveva essere alquanto umida.

Fonte: https://castrumcollis.wordpress.com/
IN PRINCIPIO ERAT VERBUM

Quando la via, che porta il nome del console Romano Caio Flaminio ha oltrepassato Nocera e la salita del Picchio, si immette in una vallata ampia e lunghissima, segnata a sinistra da una catena di semi montagne in cui i boschi si alternano a campi coltivati e nel mezzo si erige il monte Subasio, sul versante opposto del quale ” pende” Assisi e inizia l ampio piano che le si stende ai piedi. L altro lato della vallata, sulla destra della via Flaminia, è delimitato dalla catena montuosa che fa da spartiacque tra i tributari Tirreno e quelli dell’Adriatico. E nel ”greve giogo” che collega ” nocera con Gualdo” C è Colle, ma è ” greve come il giogo di una bella donna innamorata e contraccambiata. In mezzo a questi due, e perpendicolarmente ad essi, si insinua il monte Cervaia, ricoperto di uliveti nella sua fascia occidentale è che degradando termina in un grande dosso, cioè in un colle, cioè in Colle, ai piedi del quale scorre la maestosa via Flaminia. Nel punto in cui finisce il monte ed inizia il dosso C è una sorgente, a fianco della quale vi costruirono una fonte, che ora chiamiamo la “Fonte Vecchia”. Da questa fonte si svilupperà la vita di Colle prima e del Castelo dopo.

Fonte: https://castrumcollis.wordpress.com/
ERA PRECRISTIANA

I paesi umbri sono dal punto di vista storico ricchi di tutte le fasi cronologiche che hanno caratterizzato l’era moderna. A Colle ci sono tombe antichissime che testimoniano un era precristiana, ci sono ruderi romani localizzati nella via Flaminia, c’è un castello dove é simboleggiato il potente simbolo dei Signori di Firenze, ci sono a poca distanza segni e testimonianze di antichi antenati dei moderni postini (Gaifana) e tanto altro che il bravo Sante Cioli ha saputo cogliere con la sua vena affabulatoria nei due libri capolavoro dedicati al territorio. Colle é il luogo ideale per uno scrittore di mistery, antiche leggende narrano di gesta mirabili e tremende e un fascino millenario accompagnata da location da sogno e da acque che sgorgano limpide dalle rocce di montagna stimolano voli pindarici nel Tempo! Una vacanza a Colle rigenera corpo e spirito!

Fonte: https://castrumcollis.wordpress.com/

LA VIA FLAMINIA

Come la via Appia era la principale via del Mezzogiorno, così la Flaminia era considerata come la grande arteria di comunicazione del Nord e dell’Est della penisola. Essa infatti attraversava territorî ricchi e popolosi come l’agro Falisco, l’Umbria, il Piceno, e quindi scendeva al litorale adriatico a Fano, proseguendo fino a Pesaro e Rimini. Le principali stazioni sono così indicate dall’itinerario di Antonino, con le rispettive distanze da Roma: Villa Rostrata (Casale di Morolo) miglia 23; Ocriculum (Otricoli), m. 44; Narnia (Narni), m. 56; Interamna (Terni), m. 65; Spolitium (Spoleto), m. 83; Forum Flaminii (S. Giovanni Profiamma), m. 101; Helvillum (Sigillo), m. 128; Calle (Cagli) m. 151; Forum Sempronii (Fossombrone) m. 169; Fanum Fortunae (Fano) m. 185; Pisaurum (Pesaro) m. 193; Ariminum (Rimini) m. 217. Gli altri itinerari che ci sono conservati, cioè la Tabula Peutingeriana, l’itinerario Gerosolimitano e le celebri coppe votive di Vicarello, ci dànno presso a poco le stesse stazioni, ma la distanza varia da miglia 215 nei vasi di Vicarello a m. 223 nell’itinerario Gerosolimitano. Che questa ultima indicazione sia più corrispondente alla verità lo attesta un cippo miliare trovato nei pressi di Rimini che porta il n. 222. Tale differenza degl’itinerarî si spiega col fatto che in una certa epoca, forse dopo la distruzione di Carsulae, all’antico percorso per Bevagna e Foligno, un po’ disagevole, fu preferito l’altro più lungo, ma più comodo, per Terni, Spoleto e Trebiae, fino al Forum Flaminii. Il costruttore della via fu il censore Caio Flaminio, che l’iniziò nel 220 a. C. e l’ultimò nel 219, cioè poco prima della calata di Annibale in Italia. Non dobbiamo credere che i numerosi manufatti che si trovano lungo il percorso risalgano tutti a Caio Flaminio. Questi deve avere soltanto riuniti alcuni tratti di strade gia esistenti fra le principali città in un unico percorso, provvedendo alla selciatura nei punti più cedibili del terreno. Forse alle origini risale il taglio della rupe presso Narni, ove due falli abbinati, scolpiti nella roccia viva, come scongiuro, avvertono i viandanti del pericolo che li minaccia se non prestano attenzione al precipizio che è sul fianco verso il fiume; ma tutti i ponti ad arco, come anche il famoso tratto di viadotto, noto col nome di Muro del peccato, presso la stazione ferroviaria di Civita Castellana, sono opera più tarda, forse del tempo di Augusto, che restaurò a sue spese tutta la via. La via guadagnò in splendore ed ebbe opere colossali, come il citato Muro del peccato, lunga sostruzione attraverso una valle, per evitare il dislivello di essa, il famoso ponte di Narni, che è incerto se fosse a tre o quattro arcate, di cui le mediane raggiungevano l’altezza di circa trenta metri, altri ponti presso Otricoli, (pile di Augusto), Carsulae (Ponte Calamone e Ponte Cardaro) Calle e il famoso traforo detto Ad intercisa o Petra Pertusa (Passo del Furlo) tra i monti di Fabriano. La via Flaminia usciva dalle mura serviane per la Porta Fontinalis, situata nella depressione fra l’arce capitolina e il Quirinale, e presso la quale sorgeva il sepolcro di Bibuln, ancora oggi conservato in parte a fianco del monumento a Vittorio Emanuele; quindi in linea retta traversava il Campo Marzio, rasentando le pendici del Pincio, usciva dalle mura di Aureliano per la porta omonima (oggi Porta del popolo) e quindi, sempre nella stessa direzione, passava il Tevere nella grande ansa che esso forma fra i colli dei Parioli e quelli di Tor di Quinto: il ponte Milvio, mirabile opera romana fondata cento anni circa avanti l’era volgare, serviva al passaggio del fiume per essa e per la via Cassia, che si biforcava subito dopo, proseguendo in direzione nord, mentre la Flaminia voltava ad est per riprendere poco dopo il suo percorso verso nord a fianco del Tevere. Nella località detta Prima Porta si staccava a destra la via Tiberina che costeggiava il Tevere passando per Procoio, Fiano e Ponzano, e si ricongiungeva alla Flaminia a sud di Otricoli. Sulla collina che domina il Tevere si vedono ancora gli avanzi della villa ad Gallinas albas che fu già di Livia, moglie di Augusto: in essa desta particolare ammirazione una stanza adorna con pitture di giardini, di raro pregio artistico. Nella località adiacente verso Roma, detta ad Saxa rubra, avvenne la celebre battaglia fra Costantino e Massenzio (312). Il tracciato della via è chiaramente indicato dagli antichi sepolcri, tra cui quello dei Nasoni presso Grotta Rossa, ed altri anonimi, lungo quasi tutto il percorso. Al XII miglio si trova l’arco quadrifronte, oggi trasformato in casale di Malborghetto, eretto da Costantino in ricordo della sua vittoria; un altro bell’arco è ancora in piedi fra le rovine di Carsulae e celebri sono i due di Fano e di Rimini. Rovine medievali interessanti sono presso Civita Castellana, chiamate il Borgo di S. Leonardo, antico castello edificato forse dagli abati di S. M. di Falleri nel sec. XII. Questo tratto della via fu più volte restaurato dai papi: Paolo V, Urbano VIII e Clemente XI rifecero il tratto lungo la valle del Treia; Sisto V iniziò la costruzione del grande ponte Felice sul Tevere sopra Orte, ultimato nel 1603 da Clemente VIII; Clemente XI eresse nel 1709 il ponte Clementino sul Rio maggiore, Benedetto XIV restaurò la via nei pressi di Narni, conducendola per mezzo di grandi costruzioni lungo il bordo della Nera, e Paolo V rifece il ponte sullo stesso fiume prima di entrare in Terni. A Narni avveniva la già detta biforcazione dei due rami che si riunivano a Foro Flaminio, mentre a ponente partiva un braccio traverso per Amelia (via Amerina) e all’altezza della stazione ad Martis (Massa Martana) un altro per Todi. Al passo della Somma, fra Terni e Spoleto, la via raggiungeva la massima altezza del suo percorso (m. 869). Da Bevagna si avevano comunicazioni dirette per Bettona e la via Amerina, e da Foligno per Spello, Assisi e Perugia. Dopo la valle del Clitunno cominciava la traversata dell’Appennino, che avveniva all’altezza di Nocera, Gualdo Tadino, Sigillo, donde partivano bracci secondarî, verso il litorale adriatico; al passo della Scheggia, la via scendeva l’opposto versante della catena, percorrendo le valli dei torrenti Burano e Candigliano fino alla confluenza di questo col Metauro. Varî ponti si notano in questa parte del percorso (ponte di Scheggia, ponte Voragine, ponte Grosso, ponte Alto, ponte Taverna, ponte Mallio, ecc.) che si svolge quasi sempre a mezza costa e quindi su una spalla artificialmente sostruita da un muro in opera quadrata. Il punto più difficile e più pittoresco è al passo del Furlo, in cui la via corre incassata nel monte a notevole altezza sul burrone, finché, non avendo più spazio per passare all’aperto, entra in una galleria detta Intercisa, o Petra Pertusa, o Forulum, che fu restaurata da Vespasiano, come attesta l’iscrizione che si legge sull’imboccatura orientale. Poco dopo comincia la discesa verso il piano: sul Metauro la via passa sopra un grande ponte romano a 3 fornici, detto ponte di Colmazzo; qui avvenne la battaglia fra i Romani e i Cartaginesi di Asdrubale. Seguendo sempre il corso del fiume la via giunge a Fano (Fanum Fortunae). Quivi un arco commemorativo ricorda l’epoca del grande imperatore che nel 10 d. C. compì il restauro della via. Da Fano a Rimini, lungo il mare, la via moderna segue il tracciato dell’antica, ed è notevole solo per l’attraversamento di Pesaro e per un ponte a tre archi poco prima di Rimini, sul fiume Ansa. Quivi un altro arco, di elegante fattura, segna il termine della via, portando sull’attico un’iscrizione dedicata dal Senato ad Augusto, il restauratore delle “celeberrime vie” d’Italia.

Fonte: http://www.treccani.it/enciclopedia/via-flaminia_%28Enciclopedia-Italiana%29/

INSEDIAMENTO

Questa costa del monte Cervaia doveva essere molto popolata e chi vi abitava era raggruppato o in un unico grande paese o in più villaggi molto vicini tra loro, i quali avevano in comune i pascoli ed i luoghi di culto; tali luoghi erano un tempi etto della Dea Cupra sulla Cupa, e delle aree sulle cime dei monti Merlana, Cervaia e sul giogo. La vallata sottostante, alquanto acquitrinosa, doveva essere in parte utilizzata per la coltivazione della canapa che si è protratta fino ai giorni nostri ed i toponimi ne sono testimonianza ” Via Filo”, ” Cordaia”, ” le canapine”. con la conquista romana ( 295 a.c.) Colle inizio pian piano ad ampliarsi verso il basso dove nel frattempo era stata costruita la Strada Consolare Flaminia. Su queste colline e nei terreni adiacenti, asciutti e salubri, Colle dovette prosperare sia per l attività agricola sia per la confluenza del diverticolo stradale per le Marche. Con l avvicinarsi dell anno mille si risvegliarono molte attività, tra cui l edilizia, e si costruirono molti Castelli, tra cui quello di Colle. La data precisa non la conosciamo però nel 1034 esisteva già poiché in quel anno fu costruita la Chiesa di S.Ilario, sulle cui mura venne edificata nel 1610, l’ attuale Chiesa Parrocchiale dedicata a San Gregorio e a San Romano.

CASTELLO DI COLLE

Dall’ovvio significato di altura, rilievo, il toponimo “Collis” è usato nella stessa forma in tutte le fonti consultate. Colle, distante da Nocera 7 km in direzione nord, è posto sulla cima di un piccolo poggio a 520 m s.l.m. ai piedi del monte Merlana (m 1133). Sotto il castello si stende la valle lungo la quale corre la via Flaminia, poco distante, a sud, si trova il fosso del Pinaiale affluente del torrente Caldognola. Partendo da nord verso ovest i collegamenti visivi sono con i castelli di Maccantone, di Montecchio, di Lanciano, di Serpigliano, di Isola, di Postignano e di Poggio. All’abitato si sale dalla Flaminia per mezzo di un breve tratto, il castello è posto all’imbocco di uno dei valici per la Marca, la strada attraverso il passo degli Scannelli raggiunge Salmaregia sul versante opposto della montagna. Il borgo sviluppatosi al di fuori delle mura nasconde alla vista il “castrum” rimasto comunque isolato e staccato al centro dello stesso come è evidenziato nella mappa catastale. La pianta del castello è rettangolare con una prospicienza sul lato ovest. Molto compatto e fittamente edificato il “castrum” ha poco spazio libero al suo interno. Le mura coincidono per tutta la loro lunghezza di circa 150 metri con le pareti esterne degli edifici. Nel corso dei secoli queste si sono trasformate nelle facciate principali delle abitazioni operando così una sorta di apertura del “castrum” verso il borgo, il cui risultato è stato il completo cambiamento del suo aspetto. Si sono aperte finestre e porte, si sono costruiti terrazzi e tutte le pareti sono state intonacate. Di originale rimane solo parte di un edificio ancora in pietra con una feritoia. Va aggiunto che ad est, dove la pendenza del colle è minima, era presente un fossato come testimonia l’avvallamento del terreno, avvallamento più evidente fino al 1954 anno in cui furono effettuati lavori di sistemazione della strada. Attualmente si accede al “castrum” sul lato sud della prospicienza posta sull’angolo nord-ovest; questo ingresso però risale al 1601, come risulta da un mattone posto sulla sommità dell’arco a memoria dei restauri effettuati. L’ingresso originale si trova invece sul lato ovest della stessa prospicienza da dove giungeva direttamente la strada proveniente dalla Flaminia. Questa porta ora è murata e coperta da un’aggiunta posteriore, probabilmente lo spostamento fu dovuto alla necessità di eliminare la pendenza eccessiva della salita. La porta originale presenta un arco a tutto sesto in pietra, mentre quella secentesca è in mattone. Superato questo primo accesso, si arriva in un’area rettangolare coperta che prelude ad un’ulteriore porta che immette dentro al castello. I cambiamenti subiti dall’edificio, in cui è inglobata la doppia porta descritta, ne rendono difficile l’interpretazione, in ogni caso sull’angolo nord-ovest risalta quella che doveva essere una torre, poi riabbassata, che difendeva l’accesso. A piano terra di questo edificio in una stanza ora cantina sono ancora visibili due feritoie. Attualmente si accede al “castrum” anche per mezzo di una scala in muratura tra due edifici sulla cui presenza in origine non si possono fare affermazioni. Il cassero, è al centro dell’insediamento, leggermente spostato a sud, attualmente è attaccato ad un edificio, ma in origine era isolato dalle altre costruzioni. Di pianta rettangolare misura m 7 X 7 ed è alto attualmente circa dieci metri anche se probabilmente in origine la sua altezza era maggiore. Ad ovest sono presenti tre porte una a pianterreno e due al primo piano, una delle quali posteriore, come la scala esterna costruita per raggiungerla. L’altra invece è originale con arco a sesto acuto ed attualmente chiusa, caratteristiche simili a questa presenta l’accesso al piano terra. Sempre su questo lato si aprono una feritoia e una finestra posta proprio sotto il tetto. Sul lato sud si contano due feritoie una delle quali all’interno presenta ancora l’aspetto originale. Sui lati est e nord non sono presenti aperture. Internamente il cassero è stato modificato con la creazione di un piano intermedio raggiungibile per mezzo della scala prima citata, ma in origine il pianoterra era costituito da un unico ambiente molto alto con volta a botte. Il piano superiore alla volta di notevole presenta un camino e tracce di un altro solaio a riprova della maggiore altezza originale del cassero. La torre è costruita in pietra calcare bianca e gli spigoli sono sottolineati con bugnature a rilievo. Per quanto riguarda gli altri edifici del “castrum”, dei rifacimenti subiti dalle facciate esterne del castello, corrispondenti alle sue mura, si è già detto, ma anche all’interno le troppe manomissioni ne hanno compromesso la struttura primitiva. Solo alcuni elementi rimangono originali insieme ad alcuni ambienti interni in cui sono presenti le antiche volte. Il borgo, di cui si parla anche nei rogiti notarili del sec. XV , presenta elementi in alcuni edifici che fanno pensare a case-torri alle quali furono poi costruite aggiunte e sopraelevazioni. Riesce però difficile la lettura della sua struttura di base e del suo sviluppo che raggiunge una dimensione notevole e che meriterebbe uno studio a parte.

Fonte: I luoghi del silenzio, http://www.iluoghidelsilenzio.it/castello-di-colle-nocera-umbra-pg/, da una tesi di laurea di Francesco Sorbelli – ” I castelli del contado nocerino: tipologie insediative e problemi di recupero ”
GIGLIO DI FIRENZE

A Colle il giglio fiorentino è di casa ma oltre al significato dell’ affiliazione a un Potente Signore ha anche una valenza mariana. Ecco alcune info recuperate dalle fonti canoniche di rete: nel borgo collegiano la simbologia del giglio compare spesso tramandato dai tempi ecco come ci illumina Wikipedia in proposito. Il giglio di Firenze Giglio bottonato o a volte anche Giglio di Firenze è un termine utilizzato in araldica per indicare il giglio sbocciato (fiore dell’iris simile al lilium) . Il giglio bottonato ha la «caratteristica prima quella di essere disegnato da cinque petali superiori (tre principali e due stami più sottili e bocciolati) e delle ramificazioni inferiori, tutte disposte in modo simmetrico» Il giglio è oggi usato come simbolo della città di Firenze. Lo è stato anche nei tempi remoti ma non ne è conosciuta con certezza l’origine, si può supporre che sia dovuto al fatto che nei dintorni di Firenze cresce numerosa e florida la specie Iris germanica var. florentina (Giglio di Firenze o Giaggiolo bianco). Un’altra teoria vede derivare l’abbinamento della città (Florentia) con il fiore perché la sua fondazione da parte dei romani avvenne nell’anno 59 a.C., durante le celebrazioni romane per l’avvento della primavera, i festeggiamenti in onore alla dea Flora (Ludi Florales o Floralia – giochi e competizioni pubbliche) che si svolgevano dal 28 aprile al 3 maggio. L’associazione tra i festeggiamenti e il nome venne spontanea come accadde successivamente tra il nome e i fiori numerosi che crescevano intorno. Inizialmente il giglio era bianco in campo rosso ma nel XIII secolo i Guelfi scelsero il giglio con i colori invertiti per differenziarsi dai Ghibellini e quando, nel 1251, i primi cacciarono i secondi il simbolo di Firenze divenne quello che conosciamo oggi. Ai tempi della Repubblica di Firenze, il giglio era il simbolo della città, talvolta rappresentato su uno scudo retto dalla zampa di un leone (il cosiddetto marzocco).

Fonte: wikipedia
CONCILIO DI TRENTO e riorganizzazione sul territorio: nasce la parrocchia collegiana

Il Concilio di Trento riorganizzò le risorse della chiesa su tutto il territorio nazionale e da questo importante evento nacque la fusione organizzativa dei Santissimi Gregorio e Romano che segnarono un nuovo corso storico per la parrocchia di Colle di Nocera Umbra che rinasce in seguito alle decisioni prese dal Concilio. Il Concilio di Trento è la risposta della Chiesa cattolica alla riforma protestante di Lutero. Con il termine contro-riforma si intende l’insieme delle scelte compiute dalla chiesa contro la riforma protestante. Viene convocato nel 1542 da Papa Paolo III a Trento,perché era una città indipendente da Roma ma appartenente all’Impero tedesco,per far capire che si vuole trovare un compromesso con i protestanti. I vescovi protestanti però non partecipano al concilio di Trento perché non riconoscono l’autorità del Papa;così il concilio diventa un’occasione per riorganizzare la chiesa cattolica. Nel 1548 il concilio di Trento viene trasferito a Bologna a causa della peste,e viene sospeso a febbraio. Tra il 1551 e il 1552 viene spostato nuovamente a Trento,ma poi viene sospeso fino al 1562 a causa delle guerre politiche in Europa,al quale il Papa vuole partecipare. Riprende nel 1562 fino al 1563 a Trento. Nel concilio di Trento vengono prese decisioni dottrinarie e organizzative. Dottrinarie: Viene ribadito il valore dei sette sacramenti e l’inesistenza del sacerdozio universale,perché per diventare preti bisogna essere consacrati con l’”ordine”.La Chiesa viene dichiarata come unica e insostituibile forza che interpreta la sacra scrittura,che è la Bibbia di S. Gerolamo. Viene inoltre riaffermato che la salvezza si ottiene solo tramite la fede e le azioni buone. Organizzative: nel concilio di Trento viene ribadito l’obbligo del celibato ecclesiastico,l’obbligo per tutti gli ecclesiastici di risiedere nella zona ad essi affidata e l’obbligo di visite pastorali regolari. La Chiesa rinuncia al cumulo dei benefici perché la dignità di un sacerdote non dipende dalla sua ricchezza e viene imposto il latino come lingua universale. -Istituzione del catechismo: i preti hanno l’obbligo di insegnare ai fedeli. -Istituzione del santo uffizio: è una congregazione di 9 cardinali che ha il compito di vigilare sul tribunale dell’inquisizione. L’indice dei libri proibiti: comprende tutte le opere la cui lettura è proibita per ragioni morali e filosofiche,ed è scritta e aggiornata dalla congregazione dell’indice dei libri proibiti. Accanto a queste decisioni nascono anche nuovi ordini religiosi,che erano delle associazioni caritative e assistenziali: 1528 – ordine dei cappuccini,che assistevano gli appestati 1533- ordine dei barnabiti 1540- ordine delle orsoline,che vengono riconosciute ufficialmente dal Papa nel 1546 1572- fate bene fratelli,che è un’associazione che assiste i malati.

Fonte:
CHIESA S GREGORIO E S ROMANO

L’edificio dell’attuale chiesa, più volte gravemente colpita dai vari terremoti succedutesi nei secoli e poi restaurata, era in origine molto più piccolo e ricostruito più lungo e più largo dal vescovo Virginio Florenzi nel sec. XVII dopo un altro disastroso terremoto. La forma originale è ancora intuibile e il bel portale che si trova ad ovest ne rappresentava l’ingresso principale. Lo stemma del vescovo murato sulla parete ricorda i lavori effettuati. In epoca successiva venne poi aggiunto il campanile quadrato. La chiesa riunisce al titolo originario di S. Romano, quello di S. Gregorio che apparteneva ad una chiesa diruta non distante dal castello verso sud. S. Romano è ricordata sia nelle “Rationes decimarum” del 1333-1334 che nel “Liber beneficiorum” del 1528

Fonte: I luoghi del silenzio, http://www.iluoghidelsilenzio.it/castello-di-colle-nocera-umbra-pg/

CHIESA SS TRINITA’

L’edificio, poco più di una cappella, risale all’incirca alla metà del 1500 e sorge a ridosso delle mura del castello di Colle di Nocera, è l’unica sopravvissuta, mentre altre due dislocate sulle pendici del monte sono definitivamente scomparse, una era dedicata San Romano ed è stata in piedi fino all’inizio del nostro secolo. La chiesa è stata assorbita dalle case adiacenti e osservando le pietre della fiancata si può presumere che precedente alla stessa il sito doveva ospitare una qualche struttura precedente, infatti durante i lavori per la realizzazione della casa adiacente sono venute alla luce due blocchi di conglomerato ben squadrati di origine presumibilmente romana, ora in mostra nel cortile della stessa, simili ad un altro murato alla base dell’angolo sinistro della chiesa. Si presenta strutturalmente in buono stato di conservazione essendo stata ristrutturata di recente. La facciata ha un piccolo oculo sopra la porta e due piccole finestrelle alte ai fianchi della stessa. Ha un piccolo campanile a vela sulla parete di fondo. All’interno presenta degli affreschi, qualcuno di buona mano, ma mal conservati e sbiaditi, quello dell’abside è stato in gran parte coperto da un’altro più recente e di scarsissimo valore. Da un’osservazione sommaria da quel che si vede dietro l’intonaco recente si può supporre che l’affresco originale dell’abside sia molto simile a quello presente nella chiesa di San Giovanni a Boschetto, in quanto in entrambi compare la figura dell’Eterno in alto e sotto una crocifissione; sarebbe auspicabile un intervento di restauro che riporti alla luce l’originale perché molto più interessante della sovrapposizione posticcia. Alla parete destra partendo dall’abside c’è una Madonna con Bambino molto rovinata, ma straordinaria grazia, dopodiché troviamo una piccola immagine di Sant’Orsano, Sant’Elena, un San Bernardino da Siena (?) datato 1580 e un Sant’Antonio abate con ai piedi il maialino di “Cinta senese” . Sulla parete sinistra partendo dall’abside troviamo una Madonna con Bambino datata 1550, un’immaginetta di Santa Bibiana, una Santa Lucia e un’altra Madonna con Bambino poco rifinita e che sembra un ricopiaticcio dell’immagine precedente, perché identica. Le immagini della parte destra e sinistra sono simmetriche nelle loro fattezze e speculari nelle dimensioni. Tutti i dipinti sono molto deteriorati e necessiterebbero di un sollecito intervento di restauro.

Fonte: I luoghi del silenzio, http://www.iluoghidelsilenzio.it/chiesa-della-ss-trinita-colle-di-nocera-umbra-pg/

FONTE VECCHIA

La fonte vecchia di Colle ha tenuto in vita il paese per decine e decine di anni visto che la portabilità come la conosciamo noi in stile condominio entra in voga approssimativamente solo negli anni ’50. L’acqua dà la vita alla popolazione locale, che attinge alla fonte per lavare e abbeverarsi ma non solo, durante la seconda guerra mondiale molte famiglie hanno protetto i loro figli sotto la costruzione muraria della fonte vecchia oggi rimodernata e ristrutturata secondo le esigenze dei tempi. Per capire l’importanza dell’ acqua in un paese come Colle e tante altri dell’ indotto appenninico tra Gualdo Tadino e Nocera Umbra rimandiamo alle numerose fonti presenti in rete

Fonte:



Umbriafiere e Confidustria: idee, persone, strumenti per la trasformazione digitale!

web marketing UmbriaGrazie Confidustria del supporto dato in dta stellare 9 novembre 2017 a web marketing Umbria per il magnifico evento organizzato a Umbriafiere di Bastia sul tema del market place e innovazione! Non tanto per l’omaggio fisico immortalato da qualche parte nel post che ha anche un valore e un costo ma per mezza giornata di formazione memorabile che ha finito per dare ulteriore sostanza e valore aggiunto a un corso interessante che si sta consumando in questi giorni presso la sede Umana Forma di Perugia centrato sui social media e sulla cyber security, cui Umbriaway Consulting sta partecipando. Non a caso il corriere dell’ Umbria ha subito colto la portata dell’ evento specificando in prima pagina il titolo “una vetrina aperta sul futuro!”. Con Umbria Business Matching non solo Confidustria e la sua macchina organizzativa hanno fotografato quello che é il tessuto produttivo dell’ Umbria allo stato dell’ arte, ma anche il potenziale non appieno sfruttato da cogliere grazie alle nuove risorse dinamiche della rete senza contare le opportunità di business B2B e B2C messe sul piatto per rivitalizzare l’economia delle aziende locali ma anche per dare un segnale importante per i giovani che cercano un lavoro e che grazie all’ evento capiscono da che parte tira il vento! Non solo quindi un occasione per creare relazioni di affari, ma idee e progetti ed eleborazioni cerebrali da parte di chi avuto la fortuna di partecipare all’ evento per trasformare i problemi in opportunità e per vedere magari cose conosciute da prospettive inedite insolite. In questo marasma caleidoscopico di risorse messe a disposizione da Confidustria alla fine quello che se ne ricava uscendo é semplice e puro arricchimento totale, l’unica cosa che Umbriaway doveva fare era valutare la portata di un misterioso limone che gli era stato offerto dinnanzi per decidere se andava lanciato contro un tifoso di calcio ternano o perugino o se invece ottimizzarlo per farci una bella limonata performante! Oltre all’ aziende del tessuto locale non poteva mancare l’eccellenza rappresentata dai dipartimenti dell’ università di Perugia. web design umbriaCertamente uno dei grandi temi é quello dell’ industria 4.0 (sviluppato come programmazione nel pomeriggio) senza trascurare quelle che sono i supporti all’ imprenditoria, compresi gli strumenti a supporto finanziario messi a disposizione dall’UE, ma in tutta questo marasma caotico che squarcia un velo su un futuro sempre più ipertecnologico quello che premeva spremere al sottoscritto erano i quattro appuntamenti vitali della mattinata (diventati poi tre), visto che erano perfettamente congruenti con quelle che sono le materie affrontate dal corso di Umana Forma che mi vede come partecipante coinvolto. Risultato: ulteriori importanti informazioni da sfruttare al massimo per perseguire i propri obiettivi! Ma proviamo a dire senza dire, a raccontare se stiamo parlando di fuffa o se dentro a tutto questo interesse ce sta anche la carne sulla brace (pazienza per i vegani, ndr aggiunge la redazione romana). Per il digital Transformation Talk web marketing Umbria ha assistito, con la fortuna di avere un posto a sedere, oltre alle cuffie e all’ omaggio, all’ appuntamento delle 10 e 30 sul marketing non convenzionale di Igrowith hacking, con analisi di case history di successo (o presunti tali a seconda di come la si vuole vedere). Appuntamento gestito da Giacomo Arcaro di cui parleremo in seguito. Altra spremuta vitale e rivitalizzante piena di vitamine C in tempi di influenza con Cristiano Gallinelli, marchio strateg.ee, che ha ripreso il filo conduttore degli sconsacrati (questo termine non é casuale ma indica proprio che il team black marketing guru, staziona proprio a una attuale chiesa sconsacrata come location romagnola il che rappresenta da sola una operazione di marketing vincente visto che l’idea del gruppo é quella di sfidare con aggressività la forza di gravità sulle logiche del web marketing) ragazzi ereticizzati precedenti. Gallinelli é stato molto bravo a sfatare i falsi miti e a mostrare la parte peggiore delle convinzioni popolari sul versante web in modo da redimere la platea nella seconda parte mostrando come applicando semplice buon senso si possono ottenere risultati edificanti per lo spirito! Mentre i ragazzi sconsacrati di black marketing Guru in occasione del primo intervento si sono messi in evidenza per la loro spregiudicatezza e per la loro genialità nell’ applicare il pensiero laterale a casi reali di web marketing, ossia proponendo interventi non convenzionali per centrare l’obiettivo, Gallinelli é stato altrettanto bravo a mostrare come solo con la gradualità dei piccoli passi senza bombe fuffogene (e puzzolenti!) lanciate cruente si possano ottenere risultati soddisfacenti. Ok solo questi due interventi valevano il prezzo del biglietto per il sottoscritto (che ricordiamo era gratuito) ma Confindustria aveva ancora pallottole in canna. Alle 12 Massimo Santamicone di città in Internet, entrava nelle complicazioni mai raccontate dei social media in funzione della ricerca del cliente perfetto mostrando come Nostradamus nella palla di cristallo cosa sta accadendo realmente ora e quali saranno gli scenari futuri di FB, che preferiamo non raccontare qui perché questi contenuti inediti danno un vantaggio competitivo rispetto a quei competitor assenti (ah, ah). Sicuramente dentro questi 45 minuti di trattazione ho spremuto e rispremuto un sacco di informazioni che nessuno mai mi era venuto a raccontare e che costituiscono però il motore a curvatura portante (per restare in tema futuristico con il lessico di Star Trek) di questa nuova figura professionale che il social media marketing molto richiesta dal mercato! web marketing umbriaForti di tutta questa conoscenza e felicemente appagati dopo aver scritto in questo intermezzo di tempo per oltre due ore con il rischio di tunnel carpale e ormai esausto dopo aver scarabocchiato nove pagine e mezzo di informazioni sintetizzate di quadernone, dovevo abbandonare la sede prima dell’ intervento “sulle trasformazioni digitali” finanziate dal gruppo San Paolo che però sembravano più a supporto dell’ imprenditoria potenziale piuttosto che foriero di ulteriori conoscenze tecniche in grado di fare la differenza. A questo punto web marketing Umbria dovrebbe riprendere la sintesi di queste ore trascorse in mattinata nello spazio evento illustrando nei dettagli la marea di informazioni e spulciando nelle casistiche affrontate tutta roba fresca e genuina ma perché verrebbe da chiedere? Ardua impresa! Visto che stiamo parlando di roba importante che non si può liquidare in una veloce sintesi nella sintesi, ci congediamo con la scusa che non é possibile a causa dei problemi di attenzione scaturiti da post troppo lunghi raccontare tutto nei dettagli anche se il vero motivo dietro a questo facile alibi é un altro e legato a un vantaggio competitivo di umbriaway consulting rispetto ai suoi competitor: i relatori hannno detto cose estremamente importanti rispetto a chi per pigrizia o necessità ha preferito dormire o dedicarsi al make-up delle unghie! Quando ti danno un limone a costo zero che é pieno di polpa e di succo forse é il caso che valuti anche di spremerlo, conclude web marketing Umbria, ringraziando Confidunstria non solo per l’omaggio molto gradito, ma per la competenza e la professionalità dei relatori interpellati che stanno dimostrando in rete come influencer di suggerire visioni inedite e performanti sul web che verrà. Va bene te sei capito da solo dicono a Roma, te la sei suonata e cantata per far rosicare i rosiconi  ma a questo punto diamo anche una bella notizia a chi non ha potuto seguire questi appuntamenti di formazione al top: Umbriaway Consulting ha notato numerose telecamere che riprendevano l’evento il che vuol dire che da qualche parte in rete gli interventi dei relatori saranno sicuramente disponibili dopo il delitto, quindi armatevi di pazienza e cercate, magari sul sito di confindustria i prossimi giorni, chissà!  Per capire meglio la portata dell’ evento leggere questo interessante articolo del Corriere dell’ Umbria!




Web developer Umbria e l’uso delle media query

web developer UmbriaInsieme a web developer Umbria abbiamo provato a risolvere un quesito che é nello specifico: ma come faccio a ESCLUDERE alcuni elementi dalla visualizzazione del mobile? Va bene in primo luogo bisogna ripassare con Faraoni Enrico CEO di Umbriaway Consulting il concetto di risoluzione usando la nostra bibbia del web: la risoluzione indica il grado di qualità di un’immagine. In genere, si usa questo termine riguardo a immagini digitali, ma si può parlare di “risoluzione” anche con riferimento a qualunque fotografia o immagine trasferita o riprodotta su un determinato supporto mediante un processo di stampa, di visualizzazione, o di proiezione. La risoluzione grafica indica la quantità dei punti elementari di stampa (es. inchiostro) presenti in uno spazio lineare (1 centimetro, 1 pollice, etc.); in modo analogo, la risoluzione fotografica indica quella dei punti elementari di luce (es. pixel); in questo modo si misura la densità di un’immagine stampata o da proiettare. Le misure della risoluzione vengono fornite generalmente in dpi (dot per inch = punti per pollice), ppi (pixel per inch = pixel per pollice) e l/mm (linee per millimetro); ad esempio, 280 dpi corrispondono a 11 l/mm e rappresentano un valore medio (10/10) dell’acutezza visiva umana binoculare, alla distanza di 25 cm. Una fotografia 15×10 cm, osservata generalmente alla distanza di lettura (convenzionata a 25 cm), dovrà essere stampata almeno alla risoluzione di 280 dpi; la stessa immagine osservata a 250 cm di distanza, dovrà essere ingrandita 10 volte (10x) e la risoluzione di stampa potrà essere ridotta a 28 dpi….ok ad esempio verrebbe da chiedersi il mio samsung 5 NEO che risoluzione ha? Web developer Umbria poco cortesemente potrebbe rispondere: quelle indicate dal produttore sul manuale di accompagnamento del prodotto ossia 480 x 800 pixel, va bene e invece la risoluzione di un monitore che tela da dipingere mi presenta? Ad esempio 1980 per 1028. Deetto questo anche le nostre creazioni che hanno visualizzazioni diverse al loro interno hanno bisogno di essere gestite per una corretta visualizzazione su dispositivi voluti. Ad esempio all’ indirizzo http://www.farwebdesign.com/bookproject/ abbiamo una bella pagina che vista su dispositivo mobile usando un framework come bootstrap non ci darebbe problemi na che mostrerebbe in testa una serie di link cghe corrispondono alla barra laterale sinistra che non vorremmo vedere, cosa fare in questo caso per ESCLUDERE dalla visualizzazione del mobile quella classe=”list-group”? Bootstrap ci aiuta perché ha all’ interno delle sue soluzioni delle classi che servono a settare la visualizzazione per varie risoluzioni: classe col-lg (large) che porterà tutto di blocco sotto i 1200px di larghezza; classe col-md (medium) che porterà tutto di blocco sotto i 992px di larghezza; classe col-sm (small) che porterà tutto di blocco sotto i 768px di larghezza; classe col-xs (extra small) che non porterà mai la situazione di blocco ma manterrà sempre in linea. All’ indirizzo https://getbootstrap.com/docs/3.3/css/ web developer Umbria fa notare che si possono reperire importanti informazioni al riguardo. Ora il problema legato all’esempio specifico di progetto libri di Umbriaway Consulting é stato risolto traversalmente usando puro css senza le classi. Le interrogazioni multimediali sono utili quando si desidera applicare stili CSS specifici che dipendono dal tipo generale (ad esempio la stampa rispetto alla schermata), caratteristiche specifiche (come la larghezza della visualizzazione del browser) o l’ambiente (ad esempio condizioni ambientali) di un dispositivo. Poiché il numero e la varietà di dispositivi collegati a Internet continuano ad espandersi, le query multimediali stanno diventando sempre più importanti per costruire siti e applicazioni robuste.  Tipi di supporto descrivono la categoria generale di un determinato dispositivo. Sebbene gli utenti siano generalmente in qualche tipo di hardware con uno schermo, ad esempio un computer desktop o uno smartphone, è possibile creare stili speciali che mirano a dispositivi più specializzati, quali stampanti o lettori di schermo audio. Tuttavia, poiché i tipi di supporti sono destinati a descrivere dispositivi in ​​termini molto ampi, solo pochi sono disponibili. Per specificare gli attributi più specifici, è possibile utilizzare un’ampia varietà di funzioni multimediali. Le funzionalità multimediali descrivono le caratteristiche specifiche di un dato agente utente, dispositivo di output o ambiente. Ad esempio, è possibile applicare stili specifici per monitor a schermo intero, dispositivi che utilizzano topi o per condizioni ambientali in condizioni di scarsa illuminazione. Molte caratteristiche del supporto sono caratteristiche di gamma notifica web developer Umbria, il che significa che possono essere prefisso con “min-” o “max-” per esprimere vincoli “condizioni minime” o “condizione massima”. Ad esempio, questo CSS applica stili solo se la visualizzazione del tuo browser è uguale o più stretto di 12450 pixel:

@media (max-width: 12450px) { … }

se si crea una funzionalità di media senza specificare un valore, l’espressione risolve a true se il valore della funzionalità non è zero. Se una funzionalità multimediale non si applica al dispositivo su cui è in esecuzione il browser, le espressioni che coinvolgono la funzionalità multimediale sono sempre false. Ad esempio, la seguente query sarà sempre falsa:

@media only speech and (aspect-ratio: 11/5) { … }

Come al solito web developer Umbria segnala un link interessante per approfondire queste tematiche:
https://developer.mozilla.org/en-US/docs/Web/CSS/@media#Media_features

È possibile comporre complesse query multimediali utilizzando gli operatori logici, compresi quelli non e, e solo. L’operatore e l’operatore vengono utilizzati per combinare insieme più funzionalità multimediali in una singola interrogazione multimediale, che richiede che ciascuna funzionalità a catena venga restituita true affinché la query sia vera. L’operatore non è utilizzato per negare un’intera query multimediale. L’unico operatore è utilizzato per applicare uno stile solo se l’intera query corrisponde, utile per impedire ai browser più vecchi di applicare stili selezionati. Se si utilizzano gli operatori non o solo, è necessario specificare un tipo di supporto esplicito. È inoltre possibile combinare più query multimediali in un elenco separato da virgole; se una delle query multimediali nell’elenco è vera, l’intera istruzione media restituisce true. Questo equivale a un operatore oa un operatore.

AND

La parola chiave e le parole chiavi vengono utilizzate per combinare più funzionalità multimediali insieme a combinare le funzionalità multimediali con i tipi di supporti. Una query multimediale di base, una singola funzionalità multimediale con il tipo implicito di tutti i tipi di supporti, potrebbe essere simile a questa:

@media (min-width: 700px) { … }

Se, tuttavia, si voleva che ciò venisse applicato solo se il display è in orizzontale, è possibile utilizzare un operatore e un operatore per collegare insieme le funzioni multimediali:

@media (min-width: 700px) and (orientation: landscape) { … }

Ora la query media sopra riportata restituirà solo se la visualizzazione è larga 700px o larga e il display è in orizzontale. Se, tuttavia, voleste solo che questo si applicasse se il display in questione era del tipo di tipo TV, è possibile catene queste funzionalità con un tipo di supporto utilizzando un operatore e un operatore:

@media tv and (min-width: 700px) and (orientation: landscape) { …

In realtà qui con web developer Umbria abbiamo visto solo l’operatore logico AND ma l’uso é molto esteso e variegato e web developer Umbria consiglia di visionare articvoli come https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries per visionare nello specifico tutte le varie opzioni. Ritornando al caso dell’ applicativo libri menzionato da Umbriaway Consulting con il suo alias Faraoni Enrico la soluzione per l’esclusione della list group é stata la seguente. Prima abbiamo creato una media query con un range per i criteri di visualizzazione con i valori max e minimo e poi gli abbiamo detto tramite CSS tramite il selettore DISPLAY e la proprietà NONE di NON visualizzare l’elemento all’ interno di quel range ovviamente senza mettere in questo caso l’ID corrispondente sull’ elemento specifico che rimarrà invariato nelle sue UL / LI come struttura html mentre lo stile applicato sulla pagina root sarà:

<style>
@media (min-width: 200px) and (max-width: 520px) {
.list-group{ display:none;}
}
</style>

Una particolarità provando a linkare questo stile su un foglio esterno tramite il tag link e l’attributo src non sio ottiene lo stesso effetto e su questo potrebbero esserci varie soluzioni alla CSI o NCIS: ipotesi uno sbagli qualcosa, ipotesi due non fai la cosa giusta, ipotesi tre non sei stato attento oppure c’è una spiegazione tecnica che in questo caso web developer Umbria non vuole disquisire visto che l’applicativo libri contiene al suo interno anche libri di fantasmi? Ai poster …pardon posteri l’ardua sentenza! Certamente su questo tema delle risoluzioni e degli adattamenti a vari dispositivi c’è una vasta letteratura e il materiale di sicuro in rete non manca! Ricordiamo che un web developer Umbria autonomo e propositivo quando non ha la risposta e la soluzione a un problema se la va a cercare!