Se si desidera pro­gram­ma­re un sito web che risponda all’input dell’utente, è ne­ces­sa­rio af­fron­ta­re i linguaggi di pro­gram­ma­zio­ne. Anche lo sviluppo di un’app richiede, di solito, un lin­guag­gio di pro­gram­ma­zio­ne complesso. Anche se ormai esistono ottime risorse di­dat­ti­che per Python, Ja­va­Script, ecc., rimane difficile as­si­mi­la­re le routine e i comandi complessi. Il prin­ci­pian­te, che ha voglia di ci­men­tar­si con la pro­gram­ma­zio­ne, o chi ha solo bisogno di un piccolo script di solito si sente so­praf­fat­to dagli strumenti tra­di­zio­na­li.

Blockly entra in gioco proprio qui: Blockly è un progetto di Google che rap­pre­sen­ta lunghe righe di codice basate su testo in blocchi colorati. Questi blocchi possono essere tra­sci­na­ti e combinati per creare in pochi istanti una sintassi complessa. Blockly è una libreria che fornisce un editor di codice visuale. La sintassi dei programmi creati in questo modo rimane in back­ground. Se si utilizza Blockly, è possibile creare fa­cil­men­te ope­ra­zio­ni complesse senza pre­oc­cu­par­si dei comandi esatti di ogni lin­guag­gio di pro­gram­ma­zio­ne.

Perché uti­liz­za­re Blockly?

L’uso di Blockly può avere mo­ti­va­zio­ni e obiettivi diversi. Ad esempio, se de­si­de­ra­te creare un sito web re­spon­si­ve ma non disponete di com­pe­ten­ze di pro­gram­ma­zio­ne ap­pro­fon­di­te, questa raccolta vi consente di rag­giun­ge­re ra­pi­da­men­te il vostro obiettivo. Anche gli svi­lup­pa­to­ri di software pro­fes­sio­ni­sti possono uti­liz­za­re l’editor di codice visuale per creare ra­pi­da­men­te programmi più piccoli.

L’approccio ludico consente, inoltre, di com­pren­de­re ra­pi­da­men­te le relazioni durante la pro­gram­ma­zio­ne. È più facile com­pren­de­re l’af­fer­ma­zio­ne “repeat 5 times” che “for int i = 0, i < 5, i++”, anche se entrambi hanno lo stesso si­gni­fi­ca­to. Pertanto Blockly viene uti­liz­za­to prin­ci­pal­men­te in ambienti di ap­pren­di­men­to. Blockly è par­ti­co­lar­men­te indicato per i bambini che vogliono fare i primi passi nel mondo dello sviluppo di software. Rap­pre­sen­tan­do vi­si­va­men­te le parti del codice, è possibile ottenere risultati sor­pren­den­ti in modo semplice e rapido.

L’in­ter­fac­cia visiva rende la com­pren­sio­ne del codice chiara e semplice. Come i pezzi di un puzzle, i blocchi vengono ag­gan­cia­ti l’uno all’altro per poi essere con­ver­ti­ti in codice. Sebbene Blockly stesso sia una libreria Ja­va­Script, il codice sorgente può essere emesso di­ret­ta­men­te in linguaggi diversi. Per im­po­sta­zio­ne pre­de­fi­ni­ta, il codice è di­spo­ni­bi­le in Ja­va­Script, Python, PHP, Lua, Dart e XML. L’editor può essere usato fa­cil­men­te in un browser.

La pro­gram­ma­zio­ne visuale non è più una novità. Molti provider la stanno già uti­liz­zan­do per creare siti web. Come Blockly, anche i kit per siti web offrono un’in­ter­fac­cia semplice e intuitiva. Il codice scritto viene eseguito com­ple­ta­men­te in back­ground, in modo che prin­ci­pian­ti e ap­pas­sio­na­ti possano rag­giun­ge­re ra­pi­da­men­te i loro obiettivi.

N.B.

Blockly è molto simile a Scratch. Blockly è più fo­ca­liz­za­to sugli svi­lup­pa­to­ri pro­fes­sio­ni­sti in un contesto aziendale, mentre Scratch è prin­ci­pal­men­te inteso come strumento didattico.

Quali fun­zio­na­li­tà offre Blockly?

L’app Blockly, l’editor di codice visuale, offre otto categorie con diverse funzioni:

  • La categoria Logica descrive le azioni.
  • I Cicli sono strutture di controllo che si ripetono fino a quando non si verifica una de­ter­mi­na­ta azione.
  • La categoria Ma­te­ma­ti­ca pa­dro­neg­gia vari tipi di calcolo e può anche emettere numeri casuali.
  • La categoria Testo può accedere agli input e generare output in­di­vi­dua­li.
  • Gli Elenchi generano liste in com­bi­na­zio­ne con i blocchi delle categorie Testo o Ma­te­ma­ti­ca.
  • La categoria Colore può essere applicata al colore del testo o dello sfondo.
  • La categoria Variabili può essere uti­liz­za­ta per calcoli o funzioni.
  • La categoria Funzioni descrive il com­por­ta­men­to della pagina quando viene rilevato un par­ti­co­la­re input.

Le com­bi­na­zio­ni possibili tra i blocchi sono diverse. Cicli e Funzioni possono essere collegati alle categorie Logica e Variabili. Logica e Variabili in­cor­po­ra­no, a loro volta, le categorie Ma­te­ma­ti­ca, Testo, Elenchi e Colore. Queste poche com­bi­na­zio­ni coprono molte delle basi dei diversi linguaggi di pro­gram­ma­zio­ne.

Esempio di Blockly

Il fun­zio­na­men­to dei blocchi è molto intuitivo: si apre una categoria e con il mouse si trascina il blocco di codice de­si­de­ra­to nell’area di lavoro, dove i singoli blocchi possono essere rior­ga­niz­za­ti e quindi collegati tra di loro. Se una com­bi­na­zio­ne non è possibile, il blocco non scatta in posizione e quindi non viene incluso nel codice sorgente. Singole parti del puzzle o gruppi di blocchi possono anche essere fa­cil­men­te eliminati dall’area di lavoro. Le righe di codice cor­ri­spon­den­ti vengono quindi rimosse anche dal codice sorgente.

Ad esempio, se de­si­de­ra­te con­net­te­re un pop-up a un contatore dovete procedere come segue:

Questo semplice codice può ora essere tradotto anche nei diversi linguaggi di pro­gram­ma­zio­ne. In Ja­va­Script, il codice sorgente si pre­sen­te­reb­be così:

count var;
count = 1;
while (count <= 3) {
	window.alert('Hello World!');
	count = count + 1;
}

Questo è, ov­via­men­te, solo un esempio di codice molto primitivo. L’output di “Hello World!” co­sti­tui­sce comunque sempre la prima lezione quando si impara un lin­guag­gio di pro­gram­ma­zio­ne.

In quali settori si utilizza Blockly?

Anche se l’ap­pli­ca­zio­ne in sé è più destinata a studenti e prin­ci­pian­ti, la libreria vera e propria è rivolta agli svi­lup­pa­to­ri. Gli svi­lup­pa­to­ri possono creare fa­cil­men­te i propri blocchi con Funzioni e Logica e svi­lup­pa­re dalla libreria un’app in­di­pen­den­te.

Chi vuole svi­lup­pa­re i propri blocchi all’interno di Blockly, ha due opzioni: da un lato, c'è l’API di Ja­va­Script, che viene uti­liz­za­ta prin­ci­pal­men­te per le ap­pli­ca­zio­ni web, dall’altro, è di­spo­ni­bi­le un’in­ter­fac­cia JSON, che funziona anche su Android e iOS. Tuttavia, nel formato JSON, è possibile scegliere soltanto tra i blocchi più uti­liz­za­ti. Una do­cu­men­ta­zio­ne completa è di­spo­ni­bi­le su GitHub. Anche Google offre una guida det­ta­glia­ta sullo sviluppo e l’utilizzo di Blockly.

Su YouTube, Stack Overflow e GitHub sono ormai di­spo­ni­bi­li in­nu­me­re­vo­li tutorial e materiale in­for­ma­ti­vo su come uti­liz­za­re la libreria in modo ef­fi­cien­te. La pro­gram­ma­zio­ne di vari in­ter­rut­to­ri e ri­ce­vi­to­ri per il controllo nella Smart Home è solo una delle tante pos­si­bi­li­tà. Dal momento che il programma può essere combinato con un’ampia varietà di linguaggi, potete dare sfogo alla vostra crea­ti­vi­tà.

Con­clu­sio­ne: una buona al­ter­na­ti­va ai linguaggi di pro­gram­ma­zio­ne complessi

Se de­si­de­ra­te imparare i linguaggi di pro­gram­ma­zio­ne, amerete il fatto che il programma scrive solo sintassi corrette e non dimentica mai il punto e virgola o le vir­go­let­te. Il principio ludico rende più facile lavorare di­ret­ta­men­te su progetti anche da prin­ci­pian­ti, con­sen­ten­do quindi di fare espe­rien­za. Im­pa­re­re­te ra­pi­da­men­te le pos­si­bi­li­tà del lin­guag­gio di pro­gram­ma­zio­ne e potrete pro­get­ta­re istin­ti­va­men­te prototipi e modelli.

L’utilizzo di Blockly è molto semplice, ma può ve­lo­ciz­za­re si­gni­fi­ca­ti­va­men­te il flusso di lavoro. La libreria può essere fa­cil­men­te integrata nei progetti esistenti e rende la rea­liz­za­zio­ne di progetti di grandi di­men­sio­ni ancora più facile. Tuttavia, è im­por­tan­te fa­mi­lia­riz­za­re con le sue funzioni. Grazie alla sua grande varietà lin­gui­sti­ca, il codice sorgente creato con Blockly può essere integrato in molti progetti. Questo è il motivo per cui la soluzione open source non è in­te­res­san­te solo per i prin­ci­pian­ti.

Vai al menu prin­ci­pa­le