Nessun risultato. Prova con un altro termine.
Guide
Notizie
Software
Tutorial

Compilare e condividere codice online

Undici servizi per compilare e condividere online codice di programmazione: lato client o lato server.
Undici servizi per compilare e condividere online codice di programmazione: lato client o lato server.
Link copiato negli appunti

In questo articolo analizzeremo alcune applicazioni Web che permettono di condividere e salvare online codice HTML, Css, JavaScript e alcuni linguaggi di programmazione lato server o per sistemi desktop. Alcune, le più raffinate, permettono anche di compilare il codice e di visualizzare il risultato ottenuto all'interno di una pagina Web. Cominceremo proprio da una di queste, dedicata a codice lato client per il Web: jsFiddle.

jsFiddle

jsFiddle è il servizio più diffuso servizio del suo genere. Permette, utilizzando esclusivamente il browser e un'unica pagina, di eseguire test su codice HTML, CSS e JavaScript allegando ad ogni snippet anche alcuni dei più noti framework JavaScript. La pagina è suddivisa in quattro pannelli: uno per includere codice HTML, uno per includere codice JavaScript e uno dedicato ai fogli di stile. Dopo aver incluso gli snippet nei punti dedicati, basta fare clic sul pulsante Run per eseguire il codice e visualizzare il risultato nel quarto pannello (chiamato Results).

Figura 1: jsFiddle
(clic per ingrandire)

Figura 1: jsFiddle

Dal menu di sinistra è possibile scegliere quale framework utilizzare (jQuery, Prototype, Mootolls e così via) e decidere in che punto dell'applicazione caricarlo. Dal pulsante Add Resources è anche possibile aggiungere del proprio codice se raggiungibile via Web. I Fiddle (così si chiamano le combinazioni di codice create con il servizio) possono essere condivise e integrate in un sito, blog o in qualsiasi altra pagina Web attraverso il semplice strumento di inclusione.

Ideone

Il secondo servizio che presentiamo ha un'interfaccia molto semplice, e molti linguaggi di programmazione supportati. A differenza di jsFiddle, con Ideone è possibile anche testare codice di programmazione lato server. Si può subito cominciare scrivendo nell'area centrale, ma il sito permette anche di registrarsi in modo da tenere salvati i propri lavori. Per quasi ciascun linguaggio esistono anche dei template di partenza.

Figura 2: Ideone
(clic per ingrandire)

Figura 2: Ideone

Cliccando su Submit il codice viene compilato, a quel punto si viene indirizzati sulla pagina dei risultati, che possono anche essere condivisi con gli altri. Tramite il menu superiore si possono inoltre vedere i recent codes, cioè gli ultimi esperimenti con parti di codice scritti dagli altri. Sono filtrabili per linguaggio di programmazione utilizzando l'elenco superiore.

Codepad

Anche Codepad ha la caratteristica di essere un servizio molto semplice e veloce da usare. Propone uno spazio centrale e sulla sinistra l'elenco dei linguaggi disponibili. Utilizzando Submit il codice viene compilato e in questo modo si ottiene un link nella forma codepad.org/codice da condividere con chi si vuole.

Figura 3: Codepad
(clic per ingrandire)

Figura 3: Codepad

Da notare che esiste anche una funzione di debugger per segnalare gli eventuali errori nella compilazione e un'esecuzione passo passo. La riga di codice interessata viene evidenziata di rosso, e l'errore è anche riportato nell'output. Per ciascun codice si può decidere se tenerlo pubblico o privato, cliccando in questo caso su private prima di compilarlo.

Pastebin

Pastebin si propone come un editor dall'aspetto semplice, ma allo stesso tempo con un numero abbastanza elevato di funzioni. Dopo aver inserito il proprio codice si può decidere, oltre ovviamente al linguaggio di programmazione, anche per quanto tempo debba rimanere visibile, e se tenerlo pubblico o privato. Quest'ultima funzione è però disponibile solo per gli utenti registrati.

Figura 4: Pastebin
(clic per ingrandire)

Figura 4: Pastebin

Una delle sue particolarità è che si tratta di un servizio molto frequentato, per cui si trovano numerosi esempi lasciati da altri programmatori. Bisogna anche fare attenzione ai numerosi intrusi che invece di codice usano il sito per i loro proclami, ma è chiaramente abbastanza semplice individuare quando si tratta di codice e quando no.

Compilr

Compilr è invece un servizio che propone qualcosa di più complesso. Qui intanto, per cominciare, bisogna per forza registrarsi creando un proprio account. Una volta dentro il servizio si presenta con la tipica barra degli strumenti in alto, e nel menu laterale la piattaforma offre un ambiente di sviluppo completo, dato che si possono creare diversi progetti, ognuno composto da più file eventualmente ordinabili in cartelle. C'è anche una funzione Build per compilare i singoli file insieme.

Figura 5: Compilr
(clic per ingrandire)

Figura 5: Compilr

Da notare che anche qui esiste un elenco di progetti consultabili pubblicamente, ovverosia quelli lasciati dagli altri utenti. Sono divisi per argomento, per una più facile individuazione. Il sito dispone anche di un forum, per confrontarsi su temi vari con gli altri utilizzatori del servizio.

Cloud9 IDE

Anche Cloud9 IDE si presenta come una piattaforma completa, con addirittura dei piani a pagamento, in questo caso per chi voglia tenere i propri progetti come privati.

Dopo aver eseguito il login si può cominciare un nuovo progetto andando sul + accanto a My Projects, e qui decidere se cominciare da zero o clonarne uno partendo da una URL. La parte di scrittura vera e propria è organizzata secondo tab associabili a ciascun progetto.

Figura 6: Cloud9 IDE
(clic per ingrandire)

Figura 6: Cloud9 IDE

I linguaggi a disposizione sono molti, e il servizio possiede inoltre funzioni di auto-compilazione di parole chiave e metodi.


Snipplr

Snipplr si propone maggiormente come una piattaforma di scambio, e funziona anzi quasi come un social network. Per cominciare bisogna registrarsi, e una volta fatto si possono anche preferire o commentare i codici lasciati dagli altri, che comunque possono essere visti anche senza registrazione.

Figura 7: Snipplr
(clic per ingrandire)

Figura 7: Snipplr

Per inserirne uno nuovo bisogna invece andare su New Snippet, e a quel punto scriverlo o copiarlo dai propri appunti. Ogni codice può avere un titolo, una descrizione, una URL, dei tag e chiaramente l'indicazione del linguaggio utilizzato.

Snipt.net

Anche Snipt.net ha un'impostazione più sociale, proponendo già dalla prima pagina i più recenti e i più popolari pezzi di codice inseriti dagli altri, elencati come fosse un blog. A lato, dei tag per individuarli meglio.

Figura 8: Snipt.net
(clic per ingrandire)

Figura 8: Snipt.net

Per contribuire al sito bisogna invece registrarsi. In questo modo si possono tenere salvati i propri appunti, che rimangono nell'area My snipts.

Snipt.org

Sito dal nome uguale al precedente, ma con diverso dominio di primo livello, Snipt.org è invece un servizio piuttosto semplice per inserire velocemente del codice ed eventualmente condividerlo, direttamente dalla homepage.

Figura 9: Snipt.org
(clic per ingrandire)

Figura 9: Snipt.org

Dopo aver cliccato su Snip It si accede a una successiva pagina nella quale si può copiare il codice negli appunti per poi incollarlo su una propria pagina web, oppure scaricarlo. Per modificarlo di nuovo basta cliccare su Edit in alto a destra.

Chop

Chop si presenta con una grafica semplice ed efficace, con uno spazio per incollare la parte di codice che si desidera ed eseguirla immediatamente cliccando su Chop It!. Sotto si può decidere il linguaggio di programmazione di riferimento.

Figura 10: Chop
(clic per ingrandire)

Figura 10: Chop

La particolarità è che una volta inserito il codice, si può facilmente commentare cliccando sulla riga interessata. In alto, la URL per condividerlo con chi si vuole.

Stypi

Vediamo infine un altro servizio non dedicato specificamente alla scrittura di codice, ma che possiede comunque questa funzione addizionale. Si chiama Stypi e permette di prendere appunti in testo puro, senza quindi possibilità di modifiche per quanto riguarda il carattere o le dimensioni.

Figura 11: Stypi
(clic per ingrandire)

Figura 11: Stypi

Premendo il pulsante < / > si accede alla parte riguardante i linguaggi di programmazione, che possono essere scelti utilizzando il menu a tendina. Interessante la funzione che consente di rivedere la storia delle proprie digitazioni. Si attiva facendo clic sul simbolo della videocamera.

Ti consigliamo anche