lunedì 22 ottobre 2012

Creare un'app per Google Chrome


Piuttosto sorprendentemente, non esiste in tutto il Chrome Web Store, un'app che aggiunga al browser di Google, la ricerca delle immagini attraverso il motore Google stesso.

Detto fatto, ne facciamo una noi. Con un solo, piuttosto importante limite: non potremo distribuirla sullo Store, poiché il sito in questione appartiene a Google.

La nostra "app" apparirà nella "Nuova Scheda" di default del browser, e assomiglierà all'icona col cerchio intorno:


Un "app" per Chrome è nel nostro caso - cioè se vogliamo tipicamente rendere un link - molto semplicemente l'unione di un file manifesto e di un'icona.

L'icona la potete scegliere liberamente tra le molte disponibili su Internet. Io ho scelto questa. Scaricatela come PNG e salvatela col nome di icon.png.

Create una cartella sul Desktop e nominatela "ImageSearch".

Adesso, occorre aprire un editor - a me ultimamente piace molto Sublime Text, ma il Notepad o Vim può andare lo stesso, e copiare il seguente testo.


 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
{

"name": "ImageSearch",
"version": "1.1",
"manifest_version": 2,
"description": "Google Images",

"icons": 
{
"128": "icon.png"
},


"app": 
{
"urls": ["http://www.google.net/"],
"launch": 
{
"web_url": "http://www.google.it/imghp?hl=it&tab=wi"
}
},

"permissions": [ "http://www.google.it" ]

}

Infine, salvate il testo di cui sopra come "manifest.json". (Notate che nella sezione "urls" ho messo un indirizzo falso. Questo serve se voleste pubblicare la app su un sito di vostra appartenenza).

Per usare l'app, basta aprire il Menù di Chrome (il tasto a destra a fianco della URL) e scegliere Strumenti/Estensioni.

Dopo aver spuntato l'opzione "Modalità Sviluppatore", si clicka su "Crea Pacchetto Estensione". A questo punto basta dare in input la directory che contiene il file json e l'icona, e il gioco è fatto.


venerdì 31 agosto 2012

Come ti rimpiazzo iGoogle


iGoogle è stato la mia home page per quasi dieci anni. Mi ci trovavo molto bene. Era veloce, gradevole da vedere, aveva la toolbar di search di Google (fondamentale) e insomma tutto quello che secondo me la home page deve avere.

iGoogle

Dopo anni di ottimizzazioni varie, ci avevo messo dentro tutte le cose che volevo vedere dal Web appena collegato. Per esempio ci avevo messo:
  • News feed dei principali giornali italiani (Corriere, Repubblica, Sole 24 Ore)
  • Feed dei principali siti di gaming (Kotaku, Gamespot...)
  • Feed dei principali siti di programming (MSDNStackOverflow, CodeProject...)
  • Un traduttore online (il migliore: Google Translate)
  • Il meteo di Milano e dintorni
  • Una lista dei miei cinque link web preferiti
  • I blog miei e dei miei amici
  • Ultimi tweet che seguo
Cosa invece volutamente non ci avevo messo:
  • News feed sportive (terribili se per caso ho un evento "in registrazione")
  • Mail (troppo disturbo: meglio andarci di proposito)
  • Facebook (come sopra)
Poi improvvisamente una tragica notizia: iGoogle chiude! Pare che sarà a Novembre (2013, v.commenti), comunque è irrevocabile, han detto quelli di Google che chiude.

Così ho cominciato a guardarmi intorno per rimpiazzarlo, e ogni prova che facevo mi convinceva che iGoogle era meglio. Ad esempio ho provato:
Nessuno mi soddisfaceva. Allora ho cominciato a riflettere: ma insomma, cos'ha iGoogle di così speciale? O meglio, cosa deve avere una Home Page per essere una buona Home Page?

Fondamentalmente deve avere 3 cose:
  • Una toolbar di search (quella di Google va benissimo)
  • Link ai siti utili (Translate / Calendar / Mail...)
  • News dal mondo
Poi mi sono reso conto di una cosa: i primi due punti sono implementati direttamente dalla quasi totalità dei browser moderni. Ad esempio in Chrome la toolbar che mostra la URL di un sito, è anche una toolbar di ricerca in Google. Sempre in Chrome, la Home Page di default è una collezione di icone (apps) che portano ai siti di maggior interesse: ad esempio la mia è così:


Le "news dal mondo" sono sostanzialmente dei feed RSS. Quindi mi rimaneva solo da scegliere un buon "news reader", cioè un programma che mi mostrasse i feed RSS nel modo giusto, cioè che mi permettesse di categorizzarli (news, gaming, programming, blog...) e visualizzarli in modo piacevole.

Ne ho provati un po'. Google Reader è un po' troppo spartano, altri erano troppo "barocchi" o mancavano di funzionalità. Alla fine ho scelto Feedly e lo trovo perfetto (un po' ostica l'interfaccia utente, ma dopo qualche tentativo si riesce a fare quello che si vuole). Ecco la mia page di News:


In definitiva così ho rimpiazzato iGoogle: il browser Chrome mi toglie la necessità di partire da un sito di ricerca come Google. Come Home Page (e New Tab) ho la pagina di apps di Chrome che mi porta alla mail, a Facebook, a quant'altro mi interessa; infine per leggere le news clicko su Feedly, anch'esso disponibile come "app" di Chrome.





venerdì 24 agosto 2012

Convenzione invece che Configurazione


Una delle rivoluzioni silenziose più importanti degli ultimi anni in informatica è l'avvento di strumenti, linguaggi e sistemi che sposano il concetto di

Convention over Configuration (CoC)

ovvero, in italiano, potremmo dire: seguire una convenzione piuttosto che configurare.

I più eclatanti risultati di questa impostazione - ovviamente solo tra quelli che ho potuto provare - sono, ad esempio:

  • Maven
    Un tool di management dei sorgenti, che effettua l'organizzazione e la compilazione del codice e della documentazione di un progetto software
  • Ruby On Rails
    Un famoso framework per scrivere applicazioni Web data-intensive.
  • SBT
    Un tool per la compilazione di codice sorgente in Scala (e non solo...)

Che cos'hanno di speciale questi oggetti software che implementano la CoC? Be' è presto detto: funzionano "da soli" come per magìa, senza bisogno di:

  • parametri a linea di comando
  • file di configurazione

Li scarichi, li lanci, e funzionano. Così, senza far niente, magicamente appunto! Chiaramente, dopo una prima fase in cui il tool si comporta in default, è sempre possibile arricchire e dettagliare in modo che esso faccia esattamente ciò di cui si ha bisogno.

Faccio un esempio. Comincio a scrivere il mio codice in Scala, un progettino, niente di che, ma comunque un bel po' di file sorgenti e documentazione. Ho bisogno di compilare, e scelgo un tool CoC come SBT. Lo scarico e lo lancio, così, nudo, senza alcun parametro!

> sbt

  1. Come prima cosa, SBT si rende conto che gli mancano delle librerie per partire. Ok, le scarica tutte dalla rete e le installa.
  2. Poi vede che non ho l'ultima versione di Scala: me la scarica e la mette "a fianco" alla versione che uso io.
  3. Si accorge che l'ho lanciato in una directory che contiene codice Scala: fa il parsing dei sorgenti e individua il file che contiene il metodo principale (Main)
  4. Compila tutti i miei file 
  5. Trova le dipendenze (Scala e Java), le compila e le mette in una directory di libreria
  6. Esegue il mio programma compilato!
Fantastico, no?

Cos'ho fatto io per permettere a SBT di funzionare così bene? Nient'altro che seguire delle "convenzioni": ad esempio, ovviamente, i miei file in Scala hanno estensione .scala, ma non molto più di questo.

Allo stesso modo, se scarico Ruby On Rails e ho il database Pippo, mi basta lanciare:

> rails pippo

perché "lui" mi sondi il database e mi costruisca un sito Web completo con tutte le funzioni di front-end per gestire il DB Pippo.

In maniera analoga, Maven, è in grado di scandagliare un progetto in Java, identificare le dipendenze, scaricarle da Internet, aggiornare il sistema e infine compilare e lanciare il progetto. Basta ovviamente che io segua delle "convenzioni" (ad esempio, le librerie sono in una directory /lib).

Questo è il futuro dei tool per lo sviluppo software, e sempre maggiormente la comunità di sviluppatori si aspetterà di avere a che fare con sistemi CoC che funzionano bene out-of-the-box, senza dover leggere quintali di documentazione o seguire passo passo noiosissimi esempi.



lunedì 30 luglio 2012

Non molto Agili... fin qui!

Navigando sul sito http://agilemanifesto.org mi sono accorto che sono passati otto anni da quando firmai il manifesto sullo sviluppo agile.



Cos'è successo in questi otto anni? Si fa un gran parlare, è vero, delle tecniche di sviluppo agili e termini come Scrum ed eXtreme Programming sono molto di moda, ma di fatto nella realtà enterprise - specie in quella italiana - continuano a non vedersi progetti sviluppati secondo la filosofia Agile dello sviluppo del software. Viceversa, nel mondo Open Source, l'Agile è di fatto la norma.

Spesso si vedono applicate le tecniche agili, come ad esempio Pair programming o Feature Driven Programming, ma in contesti che sono quelli tradizionali, e cioè quelli dello sviluppo waterfall, che nella realtà enterprise è tuttora l'unico modello supportato.

Frequentemente ho proposto di utilizzare un approccio Agile in diversi progetti reali, ma al di là di un qualche superficiale apprezzamento non si è mai andati.

Perché dunque, nonostante l'entusiasmo, specie degli addetti ai lavori, la metodologia Agile non ha preso piede? Io credo che le cause siano principalmente tre.

1. Il sistema non recepisce processi iterativi

Quello che caratterizza principalmente l'approccio Agile rispetto al Waterfall è il suo essere iterativo by design. Il progettista Agile sa che lo sviluppo software è spesso un processo "prima volta-primo uso", caratterizzato da un altissimo grado di incertezza, per affrontare il quale deve applicarsi una metodologia di gestione del rischio che non può che essere iterativa. L'iterazione tipica dell'Agile è quella indicata in figura:


Normalmente, in un progetto complesso, le iterazioni possono essere decine. Ma il "sistema" non è in grado di gestire le iterazioni! Se da una parte il Cliente vuole subito sapere quanto costerà il suo nuovo sistema informativo e quanto durerà il suo sviluppo, anche dall'altra il Fornitore ha tutta una serie di strumenti che funzionano solo se vengono immessi valori "a preventivo": quante risorse il progetto occuperà e per quanto tempo. Come ho riportato in altri post, la stima del costo (tempo, denaro e altre risorse) di un progetto "prima volta-primo uso" è un esercizio di fantasia destinato al fallimento. Tipicamente perciò chi fornisce un servizio di sviluppo software applica dei coefficienti di rischio molto alti proprio per cercare di assorbire questa incognita. Di fatto, nei sistemi dove è "necessaria" una stima dei costi a preventivo, il metodo Agile è escluso a priori.


2. Un processo che ricicla è considerato un processo di "serie B"

Nella concezione del Project Management classico,  il "riciclo" - quindi la re-iterazione - è considerato come un "difetto", o meglio come la "conseguenza di un difetto". Il progetto perfetto non presenta ricicli: viene eseguito così com'era stato pensato la prima volta. Per chi non possiede una cultura informatica (direi, una cultura informatica recente) l'idea stessa che una metodologia preveda molti ricicli è semplicemente orrenda. E' orrendo dover immaginare di avere stime riviste, nuove implementazioni e nuovi test ad ogni riciclo. Impensabile immettere ad ogni nuova iterazione nuove funzioni e quindi nuovi bug! Il Cliente percepisce il metodo Agile come una mancanza di professionalità (non sviluppano: provano a sviluppare!) e lo staff non tecnico del Fornitore la percepisce come una intollerabile mancanza di certezze: quanto ci costerà il progetto, quante risorse impiegherà e per quanto tempo.
Bisogna però fare i conti con la dura realtà: che è tanto più vera e documentata quanto più i progetti aumentano in complessità e novità: all'inizio nessuno può sapere quanto costerà il progetto, nemmeno a grandi linee. Si possono fare delle stime, sulle quali però non può essere calcolato il prezzo al Cliente. Proprio per la grande aleatorietà di queste stime "a-priori", il prezzo sarà o largamente esagerato per assorbire il rischio, o sottostimato destinato cioè ad andare in perdita. Come dicevo, i sistemi (finanziari, di controllo e gestione e via dicendo) aziendali prevedono che questo prezzo venga calcolato all'inizio, sulla base del quale verranno poi derivati tutti i driver economici dell'azienda. Un calcolo basato, il più delle volte, sulla fantasia.


3. La metodologia Agile presuppone il Time&Materials

Esistono tipicamente due modi per vendere un servizio informatico: a pacchetto (turn-key o fixed bid) o a tempo (time&materials, T&M). Nel primo, chi offre "scommette" su quanto effettivamente gli costerà il servizio: applica alla scommessa il proprio coefficiente di profitto e ottiene il prezzo. Nel secondo, semplicemente vengono erogati dei servizi e il Cliente paga "il tempo" di erogazione.
Per quanto abbiamo detto sin qui, la metodologia Agile presuppone la seconda opzione. Perché per poter vendere qualcosa turn-key occorre essere confidenti sulla stima dei costi, cosa che abbiamo visto è molto difficile nel caso di progetti complessi. E perchè l'Agile è iterativo di suo.
Il committente di un progetto informatico complesso è molto poco propenso a iniziare a lavorare T&M, perché anche lui deve fornire una stima di quali saranno i suoi costi/tempi, e questo a priori! La naturale conseguenza di questo stato di cose è che si formulerà un'offerta turn-key molto sovrastimata nei costi, ed esageratamente lunga nei tempi.


Io credo che queste tre siano le cause principali che hanno bloccato l'introduzione dei modelli Agili nella pratica dello sviluppo software a livello enterprise. Sono convinto che un approccio iterativo e T&M possa permettere significative economie sia per chi vende, sia per chi compra soluzioni software. Tuttavia, perché lo sviluppo Agile possa essere effettivamente utilizzato, occorrono notevoli cambiamenti in termini di cultura, processi e strumenti di supporto aziendali.



venerdì 13 luglio 2012

Ajax + Prototype + CoffeeScript

In rete abbondano gli esempi CoffeeScript per chiamate Ajax con la libreria jQuery. Se uno - come me - preferisce Prototype, è abbandonato al proprio destino.

Perciò pubblico qui sotto l'esempio di una pagina CoffeeScript con chiamate Ajax in Prototype.

//= require prototype

pe = null

invitations_args =
  method: 'get'
  onSuccess: (transport) ->
    inviter = transport.responseText
    if inviter.length > 1
      $('invitation').show()
      $('proposal').update
             (inviter + ' invites you to join a game:')
      pe.stop()
      return
  onFailure: ->
    $('invitation').show() 
    $('proposal').update('Error retrieving invitation')
    return

invitations = ->
  new Ajax.Request 
      '/player/lookforinvitations', invitations_args
  
main_loop = ->
  pe = new PeriodicalExecuter( invitations, 3 )

Event.observe(window, 'load', main_loop)


La parte principale (main_loop) è invocata sull' onLoad della pagina HTML. Qui, un PeriodicalExecuter esegue una chiamata Ajax ogni tre secondi ad un metodo (/player/lookforinvitations) che cerca se sul database qualcuno ci ha invitato a giocare. Se sì la pagina mostra un messaggio: ad esempio: Pippo ti invita a giocare con lui, e ferma il processo PeriodicalExecuter. Altrimenti la pagina continua ad inviare richieste Ajax al server finchè l'utente non cambia pagina.

(Una cosa interessante e che mi ha fatto perdere molto tempo è che anche in CoffeeScript l'ordine in cui vengono definite le funzioni è importante!! Se mettete ad esempio Event.Observe all'inizio del file, otterrete un errore di oggetto undefined: l'oggetto in questione è main_loop, che viene definito solamente più sotto!)




mercoledì 11 luglio 2012

CoffeeScript e le var locali


CoffeeScript è un linguaggio moderno, sintetico ed efficace che compila in JavaScript. Nei progetti web complessi, l'uso di CoffeeScript si sta via via imponendo, perché rende la creazione e la manutenzione del codice lato client molto più veloce e snella.

Una delle prime difficoltà, tuttavia, che si incontrano quando si comincia ad usare CoffeeScript è il fatto che per convenzione tutte le variabili (e quindi anche le funzioni, che in CoffeeScript sono anonime e associate ad un nome di variabile) sono locali.

Un esempio può chiarire meglio. Supponiamo di avere questa semplice pagina in HTML5:

<!DOCTYPE html>
<html>
<head>
    <title>CoffeeScript Palestra</title>
    <link rel="stylesheet" href="css/main.css">
    <script src="js/vendor/jquery-1.7.2.min.js"></script>
    <script src="js/script.js"></script>
</head>
<body>
    <h2>CoffeeScript Scripts</h2>
    <p>Premi <a href="#" onclick="run()">qui</a></p>
    <div id="pippo">&nbsp;</div>
</body>
</html>

Se l'utente preme il link "qui" vogliamo che accada qualcosa, ad esempio compaia la scritta "Ciao Mondo!"

La prima idea che ci viene in mente è quella di scrivere due funzioni, una che ritorna "Ciao Mondo" e una che aggiorna il contenuto del DIV "Pippo" appunto con "Ciao Mondo", in questo modo:

# COFFEESCRIPT SCRIPTS

run = ->
  $("#pippo").html(helloworld)
  null


helloworld = -> 'Ciao Mondo!'

Mettiamo questo codice nel file "script.coffee" e poi lo compiliamo con CoffeeScript. Otterremo script.js che viene poi richiamato dal nostro file HTML (sotto la riga che carica JQuery).

Peccato che una volta eseguito il tutto, quando l'utente preme "qui", non accade nulla.

Il motivo è che il compilatore CoffeeScript traduce le due funzioni "run" e "helloworld" come funzioni locali, quindi di fatto invisibili all'esterno dello stesso codice. Ecco il codice compilato:

// Generated by CoffeeScript 1.3.3
(function() {
  var run, helloworld;

  run = function() {
    $("#pippo").html(helloworld);
    return null;
  };

  helloworld = function() {
    return 'Ciao Mondo!';
  };

}).call(this);

E' giusto che sia così: infatti per evitare conflitti di nomi e variabili globali che rimangono inutilmente appese, mentre in JavaScript è buona norma dichiarare tutto con "var", in CoffeeScript questa diviene la regola.

Per "esportare" il nome di una variabile all'esterno si può agire in diversi modi. Quello che personalmente preferisco è di associare allo spazio dei nomi dello script un nome che espliciti la sua funzione di "esportatore" (ad esempio: exports), e poi di dichiarare le variabili da esportare come appartenenti a questo spazio.

# COFFEESCRIPT SCRIPTS

exports = this

exports.run = ->
  $("#pippo").html(helloworld)
  null


helloworld = -> 'Ciao Mondo!'

In questo modo, la funzione run() - o meglio, la variabile 'run' associata alla funzione anonima - diventa visibile all'interno del nostro file HTML e perciò direttamente utilizzabile.


// Generated by CoffeeScript 1.3.3
(function() {
  var exports, helloworld;

  exports = this;

  exports.run = function() {
    $("#pippo").html(helloworld);
    return null;
  };

  helloworld = function() {
    return 'Ciao Mondo!';
  };

}).call(this);


Come conseguenza non banale, le funzioni ancillari come per esempio la 'helloworld', non vengono esposte, diventando di fatto 'private'.

giovedì 5 aprile 2012

Perle di Gantt

I fautori delle teorie di Project Management, i vari aficionados dei diagrammi Gantt e CPM che ogni azienda come si deve sparacchia su vecchi template Powerpoint per giustificare ogni tipo di decisione, dovrebbero rileggersi con attenzione queste parole che Henry Gantt, che fu tra i padri delle moderne teorie di programmazione e inventore del diagramma omonimo, scrisse nel 1900:

  "La programmazione è una scienza empirica 
basata su teoremi inesatti 
che sviluppa algoritmi approssimativi
 costruiti su ipotesi sommarie. 
Le persone che la praticano
 tentano di concretizzare l’astratto 
attraverso l’impossibile. 
Per fare programmazione 
non è necessario essere pazzi, 
ma il fatto di esserlo aiuta"