Creare diagrammi di flusso

Creare diagrammi di flusso

Creare diagrammi di flusso con le istruzioni di selezione utilizzando Algobuild facilita la comprensione dei possibili errori.

Quindi, chi vuole può scaricare Algobuild al seguente link: Algobuild.

Creare diagrammi di flusso: esempio

Proponiamo un semplice diagramma di flusso che utilizza le istruzioni di selezione nidificate.

Ricevuto come input il prezzo P di un prodotto si deve:
– Se P è minore di 10 euro non applicare nessuna tassa;
– Se P è tra 10 e 100 compresi applicare una tassa del 16%;
– Infine se P è maggiore di 100 euro applicare una tassa del 21%.
Visualizzare il prezzo finale del prodotto tasse incluse.

Innanzitutto prendiamo in input solo il prezzo.

Dopo controlliamo se questo dato è minore di 10. Se la condizione è vera non facciamo nulla, altrimenti controlliamo se il prezzo è minore o uguale a 100.

Quindi inseriamo nella condizione prezzo<=100. Chiaramente non dobbiamo mettere che il prezzo è maggiore o uguale di 10 in quanto è scontato, dato che siamo nel ramo del falso.

Dunque se il prezzo è minore o uguale a 100 allora modifichiamo il prezzo esistente aumentandolo del 16%. Se invece il prezzo è maggiore, cioè siamo nel ramo del falso, aumentiamo il prezzo del 21%.

Ecco di seguito l’algoritmo creato con i diagrammi di flusso:

prezzo diagrammi

Abbiamo visto come creare diagrammi di flusso con la struttura di selezione nidificata, più avanti faremo altri esempi.

Alcuni link utili

Indice tutorial diagrammi a blocchi

1 – Diagramma a blocchi

2 – Primi esercizi con i diagrammi di flusso (perimetro triangolo; area di un trapezio)

3 – Altro semplice esercizio sui flow chart (calcolare uno sconto)

4 – Area del cerchio

5 – Precedente e successivo di un numero

6 – Introduzione agli algoritmi di selezione

7 – Minore tra due numeri

8 – Maggiore fra tre numeri

9 – Algoritmo di selezione sugli angoli

Esercizi diagrammi di flusso scuola secondaria

Esercizi diagrammi di flusso scuola secondaria

In questa lezione svolgeremo degli esercizi sui diagrammi di flusso per la scuola secondaria.

Esercizi diagrammi di flusso scuola secondaria

Sviluppiamo un semplice algoritmo di tipo sequenziale.

In un parco divertimenti i biglietti costano 25 euro per ogni bambino con età inferiore a 10 anni, e 10 euro in più per ogni altra persona.
Sapendo che i bambini che sono entrati al parco sotto i dieci anni sono 2000, calcolare il guadagno del parco divertimenti sapendo che le altre persone sono esattamente il doppio dei bambini.

In questo esercizio non ci sono dati in input ma occorre impostare delle costanti.

Ricordiamo sempre di dare dei nomi brevi e preferibilmente in minuscolo se si tratta di variabili e in maiuscolo se si tratta di costanti.

Impostiamo quindi i seguenti valori costanti:

BB costante che rappresenta il prezzo del biglietto per ogni bambino;

BA valore costante che rappresenta il prezzo del biglietto per ogni persona con età maggiore di 10;

NB costante che rappresenta la quantità di bambini entrati al parco;

NA costante che rappresenta la quantità di persone con età maggiore di 10 entrati al parco;

guadagno è la variabile che memorizza l’importo totale dell’incasso al parco.

Quindi dopo aver impostato le nostre costanti iniziali procedo calcolando il guadagno totale e lo visualizzo in output.

Ecco di seguito il diagramma di flusso:

Esercizi diagrammi di flusso

Nei prossimi tutorial vedremo altri esercizi sui diagrammi di flusso per la scuola secondaria.

Alcuni link utili

Indice tutorial diagrammi a blocchi

1 – Diagramma a blocchi

2 – Primi esercizi con i diagrammi di flusso (perimetro triangolo; area di un trapezio)

3 – Altro semplice esercizio sui flow chart (calcolare uno sconto)

4 – Area del cerchio

5 – Precedente e successivo di un numero

6 – Introduzione agli algoritmi di selezione

7 – Minore tra due numeri

8 – Maggiore fra tre numeri

9 – Algoritmo di selezione sugli angoli

Coding scuola primaria

Coding scuola primaria

Coding scuola primaria – Proponiamo una serie di esercizi che possono essere utili soprattutto alla didattica del coding nella la scuola primaria.

Coding scuola primaria – esempio di animazione

Questo esercizio è stato sviluppato da Lorenzo, il mio bimbo più piccolo e adesso lo presentiamo per consentire agli altri di prendere spunti e idee.

Vediamo subito la dimostrazione di quello che fa l’animazione:

La scena si svolge su una spiaggia e gli attori sono due giocatori.

Da un lato abbiamo quindi un calciatore che lancia una palla da basket e dall’altra parte l’altro giocatore che la prende. Il tutto si ripete tre volte e dopo la semplice animazione termina.

Coding scuola primaria – Procedimento

Per realizzare questo esercizio innanzitutto scegliamo uno sfondo e gli sprite necessari. Noi abbiamo scelto lo sfondo Beach Rio e gli sprite Ben, Andie e Basketball.

Quindi su Ben abbiamo inserito questo codice:

1. Scegliamo il blocco di inizio quando si clicca sulla bandiera verde

2. Dopo partiamo dal costume ben-d e diamo un messaggio di benvenuto.

3. Quindi con un ciclo che si ripete 3 volte cambiamo costume ogni secondo per mimare il movimento del calcio alla palla.

4. Quando il ciclo termina si passa al costume ben-c e si visualizza in output il messaggio che il gioco è finito.

5. Infine si inserisce il blocco ferma tutto.

scuola primaria coding

In maniera analoga costruiamo gli script sugli altri sprite.

Su Andie:

calcio coding

E infine sulla palla:

blocco per sempre

Inoltre inseriamo anche una musica sullo sfondo che dura per tutto il gioco:

musica coding

Ecco un semplicissimo progetto sul coding adatto anche ai bimbi della scuola primaria.

Questa sezione ‘Coding scuola primaria’ sarà ampliata con tanti altri esempi ed esercizi utili.

Alcuni link utili

Indice tutorial Scratch 3.0

Indice argomenti Scratch 2.0

Numeri primi in Scratch

Massimo fra tre numeri in Scratch

Minimo tra 3 numeri in Scratch

Numeri perfetti con Algobuild

Numeri amicabili

Selecion sort in Scratch

Esempio di successione di Fibonacci con Algobuild

La successione di Fibonacci in C++

Sviluppo con Algobuild della successione di Fibonacci

URL rewrite

URL rewrite

In questo articolo parleremo di URL Rewrite, utilizzando il mod_rewrite in htaccess.

Nella scorsa lezione abbiamo già visto come effettuare un redirect 301, ma se si ha l’esigenza di reindirizzare in modo definitivo le richieste da un vecchio dominio verso uno nuovo, è più corretto utilizzare il mod_rewrite.

Trovate la documentazione ufficiale al seguente link: mod_rewrite.

Questo modulo lo trovate già installato nei servizi di hosting.

Però è consigliabile utilizzare il blocco If Module mod_rewrite.c così, se per qualsiasi motivo il modulo non dovesse essere attivo, il codice digitato all’interno non viene considerato.

URL rewrite esempi

Facciamo quindi un esempio di URL Rewriting.

Supponiamo quindi di voler reindirizzare il vecchio sito alla nuova URL: www.nuovaurl.it.

Innanzitutto inseriamo il blocco If Module mod_rewrite.c e all’interno specifichiamo di attivare il RewriteEngine impostandolo ad On.

RewriteBase definisce il percorso di base da applicare alle regole di riscrittura.

Dopo inseriamo la RewriteRule, in cui specifichiamo l’URL Rewriting utilizzando le espressioni regolari (“regular expressions”, Regex).

Quindi RewriteRule definisce le regole di riscrittura, la forma dell’URL, i flag come lo status code HTTP da restituire, ed altri parametri.

<If Module mod_rewrite.c>
   RewriteEngine on
   RewriteBase /
   RewriteRule (.*) http://www.nuovaurl.it/$1 [R=301,L]
</IfModule>

Così tutte le richieste dell’intero sito web saranno reindirizzate verso la nuovaurl specificata.

Possiamo anche utilizzare il RewriteCond, ad esempio chiedendo che tutto il traffico che non arriva al nuovo dominio è reindirizzato comunque sul nuovo dominio.

Quindi utilizzo RewriteCond per impostare le condizioni da esaminare prima dell’applicazione di una regola di riscrittura.

RewriteEngine on
RewriteBase /
RewriteCond %{HTTP_HOST} !^www\.nuova-url\.it
RewriteRule (.*) http://www.nuova-url.it/$1 [R=301,L]


Espressioni regolari e flag

Analizziamo quindi alcune espressioni regolari utilizzate nell’esempio sopra:

Espressioni regolari Spiegazione
^ Sta ad indicare l’inizio di una stringa.
$ Indica la fine di una stringa.
(.*) L’asterisco indica una sequenza numerica qualsiasi in un URL. Le parentesi salvano la sequenza numerica in una variabile.
$1 Rappresenta una variabile che consente di accedere ai valori memorizzati temporaneamente, salvati utilizzando le parentesi.
?Indica 0 o 1 istanze di uno o una sequenza di caratteri.
. Indica un carattere qualsiasi.
* Indica 0 o N istanze di uno o una sequenza di caratteri.
\ Il backslash è utilizzato sia come carattere di escaping, sia per specificare abbreviazioni di sequenze di caratteri.

Vediamo anche il significato dei flag specificati dentro le parentesi quadre.

Flag:

R – Redirect – [R] indica al web server di eseguire un re-indirizzamento esterno di default tramite codice di stato 302. Quindi se dovesse venir inviato un altro codice, dobbiamo aggiungerlo: ad esempio [R=301].

F – Forbidden – [F] indica al web server di inviare al browser il codice di stato 403, cioè Forbidden. Indica dunque un accesso proibito.

G – Gone – [G] indica al web server di inviare al browser il codice di stato 410, Gone. Inoltre segnala che il sito richiesto non è più presente all’indirizzo inserito.

L – Last – [L] indica al web server di non eseguire altri comandi dopo la RewriteRule attuale. Nella maggior parte dei contesti, ciò significa che se la regola corrisponde allora non verranno elaborate ulteriori regole.

NC – Nocase – [NC] Indica di non prestare attenzione alle lettere maiuscole o minuscole, quando un URL rispetta le condizioni per il rewriting. 

C – Chain – [C] indica di considerare la RewriteRule successiva, solo se si verifica la condizione attuale. 


Riscrivere un URL dinamico

Supponiamo adesso di riscrivere un URL dinamico, come ad esempio questo: http://www.miodominio.it/a/prodotti.php?categoria=miacategoria

in un URL statico come questo: http://www.miodominio.it/categoria/miacategoria.

Ecco dunque il codice d’esempio:

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteRule ^/categoria/(.*)$ /a/prodotti.php?categoria=$1
</IfModule>

Cioè, se un utente inserisce l’URL statico http://www.miodominio.it/categoria/miacategoria, il web server lo riscrive grazie a quanto specificato nel mod_rewrite (gli utenti non lo vedono) in http://www.miodominio.it/a/prodotti.php?categoria=miacategoria.


URL Rewriting da non www a www

Facciamo adesso un altro esempio di re-indirizzamento dagli URL senza www alla versione con www:

<IfModule mod_rewrite.c>
RewriteEngine on 
RewriteCond %{HTTP_HOST} !^www\.miodominio\.it 
RewriteRule (.*) http://www.miodominio.it/$1 [R=301,L] 
</IfModule>

Togliere estensione .php dall’URL

In quest’altro esempio invece togliamo semplicemente l’estensione .php dagli URL.

<IfModule mod_rewrite.c>
    RewriteEngine On
    RewriteBase /
    RewriteRule ^(.*)index\.php$ /$1 [R=301,NC]
</IfModule>

Redirect 301 https

Infine, se vogliamo forzare la visualizzazione del sito con il protocollo https potremmo scrivere:

<IfModule mod_rewrite.c>
    RewriteEngine On
    RewriteCond %{HTTP_HOST} ^miodominio\.it [NC]
    RewriteCond %{SERVER_PORT} 80
    RewriteRule ^(.*)$ https://www.miodominio.it/$1 [R,L]
</IfModule>

Questi sono solo alcuni esempi di possibile uso dell’URL Rewrite utilizzando il metodo mod_rewrite del file htaccess.

Alcuni link utili

Indice tutorial JavaScript

Tutorial HTML 5

Tutorial CSS 3

Coding Natale

Coding Natale

Coding Natale – In questa lezione svilupperemo una semplice animazione in Scratch per augurare Buon Natale!

Utilizziamo una poesia di Madre Teresa di Calcutta.

È Natale ogni volta
che sorridi a un fratello
e gli tendi la mano.
È Natale ogni volta
che rimani in silenzio
per ascoltare l’altro.
È Natale ogni volta
che non accetti quei principi
che relegano gli oppressi
ai margini della società.
È Natale ogni volta
che speri con quelli che disperano
nella povertà fisica e spirituale.
È Natale ogni volta
che riconosci con umiltà
i tuoi limiti e la tua debolezza.
È Natale ogni volta
che permetti al Signore
di rinascere per donarlo agli altri.

Coding Natale con Scratch

Ecco la semplice animazione creata con Scratch.

Sviluppo del codice con Scratch

Per lo sviluppo dell’esempio ‘coding di Natale con Scratch’ utilizzeremo principalmente la tecnica dello scambio dei messaggi.

Infatti grazie a questa tecnica posso gestire la tempistica dei messaggi che ciascun personaggio recita.

Creare la scena

Prepariamo la scena inserendo lo sfondo e gli sprite necessari.

sfondo Natale

Scuriamo un pò il paesaggio utilizzando il riempimento.

Dopo inseriamo gli sprite:

Avery, Dani, Star e Heart.

Poi duplichiamo Dani altre due volte e ogni volta scegliamo un costume diverso.

sprite scratch

Aggiungiamo un’animazione alla stella prima di duplicarla.

Clicchiamo sullo sprite stella e lo rimpiccioliamo, scegliendo come dimensione 40.

Dopo clicchiamo su costumi. Quindi con il tasto destro scegliamo duplica in modo da ottenere un secondo costume che poi andremo a modificare, come da figura sotto.

star scratch

Modifichiamo dunque la seconda stella semplicemente ruotandola di poco, tramite la freccia di rotazione che compare in basso dopo averla selezionata, come da figura sotto.

stella scratch

Quindi inseriamo il seguente codice per creare una semplice animazione.

Innanzitutto scegliamo quando si clicca sulla bandierina verde e poi inseriamo subito dopo un ciclo per sempre. All’interno del ciclo ripetiamo le seguenti istruzioni:

1. Passa al costume star

2. Attendi 0.5 secondi

3. Passa al costume star2

4. Attendi 0.5 secondi

Come da figura sotto:

coding con scratch

Adesso duplicate le stelle quante volte desiderate.

Svilupperemo il resto del codice gestendo i messaggi.

Quindi facciamo parlare per prima Avery che, dopo un messaggio introduttivo, invia a tutti messaggio1, che rappresenta il via per un altro sprite.

Infatti facciamo partire Dani3 (scegliete pure uno sprite qualunque dal quale iniziare la poesia) quando riceverà messaggio1.

Dani3 una volta terminato il messaggio a sua volta invia a tutti messaggio2 che viene intercettato da un altro sprite, ad esempio Dani2 che farà lo stesso dopo aver terminato di recitare.

Codice Personaggi

Ecco dunque di seguito il codice di ciascun personaggio. Partiamo da Avery:

codice su Avery

Il codice su Dani:

codice su Dani1

Codice su Dani2:

codice su Dani2

Codice su Dani3:

codice su Dani3

Abbiamo inserito il codice nascondi perché al termine facciamo apparire un cuore che a mano a mano si ingrandirà nascondendo i personaggi.

Ecco il codice sul cuore:

cuore coding

Infine creiamo un sottofondo musicale aggiungendo la musica ciclicamente nello sfondo.

suono

Abbiamo sviluppato un semplice esempio di coding con Scratch con il tema del Natale.

Alcuni link utili

Indice tutorial Scratch 3.0

Indice argomenti Scratch 2.0

Numeri primi in Scratch

Massimo fra tre numeri in Scratch

Minimo tra 3 numeri in Scratch

Numeri perfetti con Algobuild

Numeri amicabili

Selecion sort in Scratch

Esempio di successione di Fibonacci con Algobuild

La successione di Fibonacci in C++