JSUtils: il progetto si evolve

JSUtils continua ad evolversi con nuovi strumenti disponibili e una documentazione più chiara da consultare e più curata sotto il profilo grafico. Queste sono le migliorie introdotte con JSUtils 0.1.3 alpha, trovi la nuova versione già online su GitHub.

Una novità interessante sono le nuove sezioni vars ed extended primitives, la prima contiene una serie di valori predefiniti riutilizzabili mentre la seconda è un upgrade a tre delle strutture principali di JavaScript. Al momento è disponibile solo la struttura base, i contenuti saranno aggiunti via via con le prossime Alpha.

La libreria completa andrà inesorabilmente ad appesantirsi viste le nuove sezioni, per questo la nuova versione è stata scomposta in vari moduli, il developer potrà così decidere cosa importare scaricando solo il codice che utilizzerà. Naturalmente è ancora disponibile il modulo integrale che contiene tutte le utilities, sia in forma completa che compressa.

Questi sono tutti i sorgenti disponibili (src):

array.jsu.js
function.jsu.js
jsu.js J
number.jsu.js
string.jsu.js
vars.jsu.js

 

Questi sono tutti i sorgenti compressi disponibili (min-src):

array.jsu.min.js
function.jsu.min.js
jsu.js J
number.jsu.min.js
string.jsu.min.js
vars.jsu.min.js

 

Oltre a queste modifiche tecniche c’è anche una nuova veste grafica che ti aspetta nella documentazione che diventa più semplice da consultare. Trovi la documentazione online QUI. Aggiungendo complessità al codice è ovvio che anche la documentazione era da migliorare e questo è il lavoro che ha occupato principalmente la release 0.1.3. Dalle prossime si tornà alle novità fuzionali.

Da JSFiddle a CodePen

Per i demo e i test al volo sono passato recentemente da JSFiddle a CodePen, se hai seguito gli ultimi aggiornamenti del blog l’avrai già notato. La migrazione non mi ha entusiasmato ma devo dire che mi sto lentamente abituando all’interfaccia di CodePen per quanto la trovi confusa e complessa.

codepen logo

CodePen non mi ha mai attirato ma in realtà questa scelta ha un motivo validissimo: l’esperienza d’uso da mobile. Usare JSFiddle con iPad è sempre stato un cataclisma, è necessario usare un browser particolare per accedere alla console e muoversi tra le righe di codice è un operazione semi-impossibile anche da tastiera.

Con il suo accrocchio di finestre affiancate CodePen offre un esperienza completa, posso usarlo da safari/chrome accedendo senza problemi alla console e posso gestire il layout in modo più flessibile adattandolo al codice che sto scrivendo e al dispositivo che sto utilizzando.

Un altra cosa che apprezzo molto sono le possibilità di condivisione, esportazione e integrazione in altre pagine, una buona scelta di strumenti che permettono di fare qualsiasi cosa con gli snippet salvati su CodePen. Noiose da ricordare le scorciatoie da tastiera ma a quello sto facendo l’abitudine abbastanza rapidamente.

La versione PRO è interessante soprattutto per l’ Asset Hosting . . . la provo per un anno? Non lo so, devo ancora decidermi al riguardo.

Gestire la paginazione con JavaScript + Bootstrap

Gli indicatori di paginazione sono semplicissimi da gestire con Bootstrap, basta davvero poco codice per ottenere un effetto gradevole e usabile. In questo articolo quel poco codice necessario.

Per prima cosa dobbiamo creare un contenitore per la lista.

Questa è la parte più importante, la funzione elabora con un ciclo il numero delle pagine necessarie e aggiunge un elemento alla lista per ciascuna. Con show e hide si gestisce la visibilità della lista nel caso non ci sia più di una pagina.

Al click su ogni elemento viene richiamata una funzione che gestirà il cambio pagina, al momento è solo un placeholder che stampa un’inutile messaggio in console.

Su CodePen un esempio live di questo codice.

JSUtils 0.1.3 – RELEASE

Due new entry per la nuova versione di JSUtils che ho rilasciato da qualche ora. L’alpha 0.1.3 contiene una nuova funzione per iterare gli array e un logger che trovo utilissimo durante lo sviluppo.

Con loopOnArray() puoi applicare una funzione a tutti gli elementi di un array. Il primo argomento è l’array da iterare e il secondo la funzione da avviare che ha come unico argomento l’elemento sezionato dell’array. Si usa così:

 

Per rendere più leggibile l’output in console puoi usare la funzione logger() che migliora l’impostazione dei messaggi di log classificandoli in quattro classi principali.

  1. Log di base
  2. Log informativo
  3. Log di avvertimento (WARNING)
  4. Log di errore (ERROR)

La categoria è opzionale, se si indica solo i messaggio verrà considerato un log di classe 1. Questo è un esempio di utilizzo.

logger() sfrutta esclusivamente la funzione console.log() quindi ha un alta compatibilità con browser recenti e non. Questi sono i risultati dei vari livelli di log.

 

JSUtils 0.1.3 è open source, la trovi su GitHub.

[JavaScript] Aggiungere un elemento ad un array solo se non esiste già

Promezio: esempio JavaScript

 

La classe Array può essere estesa facilmente con prototype per aggiungere una serie di funzionalità utilissime durante lo sviluppo. Un’esigenza che si ripresenta regolarmente è quella di aggiungere un elemento ad un array solo se questo non esiste già, evitando i doppioni.

Il primo step è quello di scrivere una funzione exist(element) che controlli se l’array contiene o meno l’elemento in questione, ho scelto di usare una comparazione stretta per verificare che sia effettivamente lo stesso elemento.

 

Adesso possiamo sfruttare questo codice per scrivere l’exclusivePush(element) da utilizzare su qualsiasi array.

 

Per testare il tutto usiamo il classico array cars e stampiamo in console il risultato dell’elaborazione

 

Trovi un esempio live su CODEPEN . . . l’ho sostituito recentemente a JSFiddle ma non è questa l’occasione giusta per spiegarne i motivi, ci sarà un prossimo articolo al riguardo.

Come generare PDF in PHP

logo php fpdf - generare pdf in php

Uno dei punti cardine di un recente progetto targato :#/promezio è stata la generazione dinamica lato server (PHP) di un report scaricabile in formato PDF.  La soluzione più rapida per generare PDF in PHP è risultata fpdf, una libreria gratuita per PHP ≥ 5.1 utilizzabile liberamente anche per soluzioni commerciali.

 

Si inizia importando la libreria

Per creare la prima pagina con codifica testo in italiana bastano tre righe di codice, con la prima creiamo un nuovo oggetto di tipo FPDF() per poi aggiungere una nuova pagina con la localizzazione it_IT

Per la pagina di prova inseriamo soltanto un immagine e un testo. Con $pdf->Image si inserisce un immagine e con $pdf->Cell un campo di testo. Per impostare la posizione degli elementi prima dell’inserimento si regola il punto di inizio con $pdf->Cell. Iniziamo con il logo

Ora continuiamo inserendo un titolo subito sotto, si può utilizzare $pdf->GetY per recuperare l’ascissa corrente e posizionare il sottotitolo subito sotto il titolo.

Al termine non resta che generare un pdf pronto per essere scaricato

 

 

Questo è il risultato finale

 

[Nuova Release] JSUtils 0.1.2 alpha

 

Nuova release e nuova versione per JSUtils 0.1.2 che resta in alpha ma acquista una nuova funzionalità di cui abbiamo già discusso: la funzione clone per oggetti JavaScript.

La nuova funzione è perfetta per duplicare array, date e oggetti custom, in caso di errori di duplicazione viene generato un errore specifico. E’ stata progettata per essere quanto più leggera possibile senza sacrificarne la completezza, comunque essendo una funziona ricorsiva può essere bloccante in caso di oggetti con molti livelli di annidamento.

Anche la documentazione ha avuto un restyle, ora c’è un indice in ordine alfabetico per accedere più facilmente ai dettagli di ogni funzione disponibile. JSUtils 0.1.2 alpha come sempre è disponibile su GitHub con licenza open source per qualsiasi utilizzo.

Come clonare un oggetto JavaScript

Questa è in anteprima una new entry per JSUtils, una funzione che permette di copiare in modo efficace un oggetto JavaScript, funziona anche con Date e Array che necessitano di un’operazione dedicata.

 

 

Per clonare un oggetto JavaScript con questa funzione basta importare promezio.jsu.min.js dal repository GitHub.

Sei mesi (anche) con CodeAnywhere

Sei mesi sono il tempo necessario a farsi un opinione completa su uno strumento di sviluppo, quindi ora penso di poter dire la mia su CodeAnywhere, un editor di codice in cloud che funziona tramite un interfaccia web o da mobile tramite un applicazione Android/iOS.

 

codeanywhere recensione

 

La versione più adatta alle mie esigenze è la Freelancer, costa 7$ al mese se pagata annualmente e offre una DevBox sempre attiva insieme a 50 server FTP. Ci sono anche altre feature interessanti (collegamenti con servizi Cloud, ecc.) ma queste due sono quelle che utilizzo giornalmente e che mi hanno motivato ad acquistare la versione a pagamento.

 

DevBox
Le DevBox sono server virtuali per lo sviluppo, perfette per trasferire in cloud tutta la produzione software e sfruttare al meglio la versatilità di CodeAnywhere. Un plauso va alla consistenza del servizio, non ho lamentato mai un blocco, un malfunzionamento, una caduta, un guasto . . . nulla di tutto questo, davvero un ottima infrastruttura.

Le DevBox hanno un installazione LAMP standard e offrono di default phpmyadmin per la gestione dei database tramite interfaccia grafica. Ma questa è solo la configurazione standard, la macchina monta Ubuntu 14.04 con apt per la gestione dei pacchetti, grazie all’accesso SSH quindi si può configurare il server per adattarlo a qualsiasi tipo di progetto.

In questo periodo ho sfruttato parecchio la DevBox come server di staging, è uno strumento ottimo per prototipare al volo qualcosa, provare del codice, o anche per sviluppare una WebApp intera. Hai anche un sistema di revisions completo che è davvero molto utile in diverse situazioni potenzialmente problematiche.

 

Versione WEB
Pochi fronzoli e tanta sostanza per l’interfaccia web che da chrome  (parlo solo della versione Desktop) funziona sempre perfettamente, con Safari invece lamento qualche freeze temporaneo o qualche blocco totale della scheda di lavoro nel caso si abbiano molti documenti aperti.

Comodi i suggerimenti e utile il keybinding personalizzato (basta editare il relativo file di configurazione) che permette di risparmiare tempo e tedio. Layout e template sono configurabili a piacere per arrivare al massimo confort durante lo sviluppo.

Gli strumenti find/replace sono basici, fanno il loro dovere ma solo e soltanto quello, senza possibilità di ricerche avanzate che in molti casi risultano utili, implementare meglio questa feature sarebbe una buona idea. Una menzione se la meritano anche gli snippet personalizzabili in stile Sublime Text, serve qualche tempo per creare un set completo di blocchi di codice preconfezionati ma a lavoro ultimato si risparmia tempo.

 

Versione MOBILE
Uno schifo. E’ brutto da dire ma ci sono ben pochi altri termini per definire l’app e la versione mobile (da browser) di CodeAnywhere, la prima è ASSOLUTAMENTE IMPOSSIBILE da utilizzare mentre la seconda è appena passabile solo per qualche modifica al volo on-the-road.

Sviluppare da mobile non è affatto male se si hanno gli strumenti hardware e software giusti, l’iPad PRO da 12″ con relativa tastiera è un ottima macchina ma con CodeAnywhere diventa un fermacarte troppo ingombrante.

L’app va bene solo per i primi cinque secondi dall’apertura, poi restano solo blocchi e malfunzionamenti continui, basta scrivere qualche misera riga di codice o fare una selezione con la tastiera e va in crash perdendo irrimediabilmente il pochissimo lavoro svolto.

La versione mobile da browser non si blocca (con chrome per iOS) ma gestire il testo è da panico, anche una semplice selezione richiede ventordici tentativi prima di riuscire per non parlare dell’impossibilità di gestire correttamente la DevBox.

 

Insomma, l’esperienza da desktop è positiva ma quella da mobile è disastrosa e mi costringe ad usare editor meglio concepiti per il coding in mobilità dal mio iPad (GoCoEdit, FTP Client Pro, SSH Terminal in primis ma anche CodeToGo, CODEPad e altri visto che melius abundare quam deficere). Lo continuerò ad utilizzare? Si, fintanto che non si trovi una soluzione con annessa DevBox altrettanto consistente ma con un software mobile degno di tale nome.