Applicazioni Web ultra-performanti con Vue.js e DelphiMarco Breveglieri
Vue.js è un framework per creare interfacce utente estremamente performanti e che può essere introdotto progressivamente nelle vostre applicazioni Web, nel modo meno invasivo possibile. In questo talk scoprirete come utilizzarlo con Delphi creando una soluzione frontend e backend ad elevate prestazioni.
Applicazioni Web ultra-performanti con Vue.js e DelphiMarco Breveglieri
Vue.js è un framework per creare interfacce utente estremamente performanti e che può essere introdotto progressivamente nelle vostre applicazioni Web, nel modo meno invasivo possibile. In questo talk scoprirete come utilizzarlo con Delphi creando una soluzione frontend e backend ad elevate prestazioni.
Sviluppo Web con React e Delphi - Seminario Delphi Day 2016, PiacenzaMarco Breveglieri
Slide del seminario sull'uso di React con Delphi e confronto con altre tecnologie (es. ExtJS) per lo sviluppo Web, tenuto al Delphi Day 2016 a Piacenza.
I sorgenti sono disponibili qui:
https://github.com/marcobreveglieri/conferences/tree/master/2016/delphi_day_2016
I linguaggi del web - seconda edizione (3° giornata)Diego La Monica
Modulo 4 – AJAX
- Interazioni client/server
- Framework a confronto:
- jQuery
- Mootools
- YUI
- JAST
Modulo 5 – ARIA e l’accessibilità lato client
- Prendere un po' di ARIA
- Le tecnologie assistive
- Ruoli, stati e proprietà
- Strumenti per lo sviluppo accessibile
WordPress per siti scolastici a norma: motori di ricerca, utenti e gestione g...Marco Milesi
Motori di ricerca, utenti e gestione guasti per gestire al meglio il nuovo sito istituzionale della tua scuola
Slide del corso tenuto all'IPSSAR di San Pellegrino Terme - marzo 2016
El documento describe el problema del calentamiento global, explicando que la acumulación de gases de efecto invernadero en la atmósfera podría causar cambios catastróficos en los patrones climáticos de la Tierra. Luego proporciona contexto sobre la formación y características geológicas y atmosféricas de la Tierra, la aparición de la vida, la población humana y sus actividades económicas. Finalmente, detalla algunas de las principales religiones, deportes y zonas industriales del mundo.
Este documento presenta la introducción a un curso de comunicación científica. Explica los materiales que se usarán como lecturas, trabajos de investigación, exposiciones orales, entre otros. Detalla los criterios de evaluación como asistencia, participación, y esfuerzo. Establece que se requiere un mínimo de 6.5/10 en cada asignatura y 8/10 en el examen final para aprobar el curso. El objetivo del curso es desarrollar habilidades comunicativas orales y escritas en el marco científico.
Il Bottone all'attacco! Una buona prassi nella gestione di un Piccolo MuseoIlaria Pic
Presentazione del caso "Museo del Bottone di Giorgio Gallavotti, Santarcangelo di Romagna" in occasione del convegno "Musei Accoglienti" a Battaglia Terme il 27 Ottobre 2011.
sito web del Museo: bottone.art-italy.net
This document discusses several jQuery UI interactions including draggable, droppable, resizable, selectable, and sortable. It provides brief descriptions of each interaction's options, events, and methods. It then states that examples will be shown before thanking the reader.
Puja Gupta is a business analyst with 1 year of experience in telecom domain process delivery for clients like BTGS, P&G, and PepsiCo. She has expertise in requirements gathering, business analysis, process design, testing, and post-implementation support. Puja is skilled in understanding client needs, configuring applications to fulfill requirements, and delivering demos to stakeholders. She is proficient with tools like Siebel, Remedy, and ARIS and methodologies like Agile and Waterfall. Puja holds an MBA from IMED, Pune and a BBA from Sharda University with specializations in marketing, international business, and achievements including Chancellor Awardee and Gold Medalist.
Sviluppo Web con React e Delphi - Seminario Delphi Day 2016, PiacenzaMarco Breveglieri
Slide del seminario sull'uso di React con Delphi e confronto con altre tecnologie (es. ExtJS) per lo sviluppo Web, tenuto al Delphi Day 2016 a Piacenza.
I sorgenti sono disponibili qui:
https://github.com/marcobreveglieri/conferences/tree/master/2016/delphi_day_2016
I linguaggi del web - seconda edizione (3° giornata)Diego La Monica
Modulo 4 – AJAX
- Interazioni client/server
- Framework a confronto:
- jQuery
- Mootools
- YUI
- JAST
Modulo 5 – ARIA e l’accessibilità lato client
- Prendere un po' di ARIA
- Le tecnologie assistive
- Ruoli, stati e proprietà
- Strumenti per lo sviluppo accessibile
WordPress per siti scolastici a norma: motori di ricerca, utenti e gestione g...Marco Milesi
Motori di ricerca, utenti e gestione guasti per gestire al meglio il nuovo sito istituzionale della tua scuola
Slide del corso tenuto all'IPSSAR di San Pellegrino Terme - marzo 2016
El documento describe el problema del calentamiento global, explicando que la acumulación de gases de efecto invernadero en la atmósfera podría causar cambios catastróficos en los patrones climáticos de la Tierra. Luego proporciona contexto sobre la formación y características geológicas y atmosféricas de la Tierra, la aparición de la vida, la población humana y sus actividades económicas. Finalmente, detalla algunas de las principales religiones, deportes y zonas industriales del mundo.
Este documento presenta la introducción a un curso de comunicación científica. Explica los materiales que se usarán como lecturas, trabajos de investigación, exposiciones orales, entre otros. Detalla los criterios de evaluación como asistencia, participación, y esfuerzo. Establece que se requiere un mínimo de 6.5/10 en cada asignatura y 8/10 en el examen final para aprobar el curso. El objetivo del curso es desarrollar habilidades comunicativas orales y escritas en el marco científico.
Il Bottone all'attacco! Una buona prassi nella gestione di un Piccolo MuseoIlaria Pic
Presentazione del caso "Museo del Bottone di Giorgio Gallavotti, Santarcangelo di Romagna" in occasione del convegno "Musei Accoglienti" a Battaglia Terme il 27 Ottobre 2011.
sito web del Museo: bottone.art-italy.net
This document discusses several jQuery UI interactions including draggable, droppable, resizable, selectable, and sortable. It provides brief descriptions of each interaction's options, events, and methods. It then states that examples will be shown before thanking the reader.
Puja Gupta is a business analyst with 1 year of experience in telecom domain process delivery for clients like BTGS, P&G, and PepsiCo. She has expertise in requirements gathering, business analysis, process design, testing, and post-implementation support. Puja is skilled in understanding client needs, configuring applications to fulfill requirements, and delivering demos to stakeholders. She is proficient with tools like Siebel, Remedy, and ARIS and methodologies like Agile and Waterfall. Puja holds an MBA from IMED, Pune and a BBA from Sharda University with specializations in marketing, international business, and achievements including Chancellor Awardee and Gold Medalist.
Slides dalle lezioni del corso di Strumenti e applicazioni del Web per il corso di laurea magistrale in Teoria e tecnologia della comunicazione - Università di Milano Bicocca - Prof.R.Polillo (a.a.2014-15) - Lezione del 18 marzo 2015
Da un po' di tempo a questa parte quando uno sviluppatore software sente la parola "Clouds" non pensa più alle nuovole, ma a...? Durante l'intervento risponderò a questa domanda e mostrerò come una applicazione web sviluppata con Spring Framework, Apache Maven e OpenJPA può essere installata facilmente e (quasi)gratuitamente sulla piattaforma per il cloud computing messa a disposizione da Google.
Il codice di esempio della presentazione lo trovate su: http://code.google.com/p/gae-javaday10/
"Alla ricerca della formula magica". Presentazione usata per il ciclo di webinar su traduzione e adattamento di siti web per AITI Emilia Romagna, novembre-dicembre 2016.
Le slides della presentazione fatta per The Diligence il 24 marzo 2014.
Mostro due dei problemi che abbiamo riscontrato e di come li abbiamo risolti nella realizzazione del sito di Evoluzioen Telematica
2. About me (Interactive designer?)
2006 2007 2008 2010 2011
WordCamp Salvatore Laisa
Milano 2012 www.salvatorelaisa.net
3. Di cosa parleremo
1. Le basi e bla bla bla
2. Mettiamoci un po’ di Ajax in questo tema
3. Case histories
4. Risorse e altra “robbba giusta”
5. Domande
WordCamp Salvatore Laisa
Milano 2012 www.salvatorelaisa.net
4. Parte 1:
Le basi e bla bla bla
Quelle cose da sapere prima di
iniziare a fare sul serio...
WordCamp Foto:
Milano 2012 “A spot of magic” - JD Hancock
5. Rapidamente: cos’è AJAX
E’ quella tecnologia che permette di avere pagine web “multitasking”, ovvero in
grado di effettuare più caricamenti contemporaneamente e quindi più simili ad
applicazioni che a pagine nel senso stretto.
AJAX esiste da sempre, è in voga dal 2005 quindi ampliamente supportato dai
browser principali (sì, anche Internet Explorer <9) e non è assolutamento legato
alla specifica HTML5.
WordCamp Salvatore Laisa
Milano 2012 www.salvatorelaisa.net
6. Come inserire Javascript in un tema
“Non ci vuole mica tanto, basta fare così:”
Di funzionare funziona, ma così WordPress non è in grado di “monitorare” la
presenza di altri script simili.
Nel caso di librerie come jQuery ci si può ritrovare con più versioni incluse nella
pagina, spesso anche di versioni diverse!
WordCamp Salvatore Laisa
Milano 2012 www.salvatorelaisa.net
7. Il metodo giusto: register/enqueue script
All’interno di functions.php
Accetta 5 argomenti che sono
• handler: (stringa) nome che si assegna allo script
• src: (stringa) posizione fisica del file
• dependencies: (array) altri script da cui dipende
• version: (stringa) versione dello script
• in footer: (booleano) se deve essere inserito nel footer
WordCamp Salvatore Laisa
Milano 2012 www.salvatorelaisa.net
8. Qual’è l’azione giusta?
Fino a qualche mese fa si usava l’azione “init” per far scaturire il tutto, il problema
è che functions.php viene letto sia da backend e frontend e questa mossa può
generare pasticci.
Un recente aggiornamento del Codex suggerisce di usare un’altra azione per
caricare gli scripts:
WordCamp Salvatore Laisa
Milano 2012 www.salvatorelaisa.net
9. WordPress è una web-application!
La backend di WordPress è costruita con i tradizionali linguaggi web Html, Css,
PHP e anche Javascript, e già di suo include diverse librerie tra cui jQuery (e
tutto lo stack jQuery UI), Prototype, SWF Object e altre ancora.
Quindi se vogliamo usare una di queste ci basta semplicemente richiamarla
PS: da diverso tempo il team di WordPress sta lavorando per Ajaxare maggiormente la backend!
WordCamp Salvatore Laisa
Milano 2012 www.salvatorelaisa.net
10. Occhio a jQuery!
All’interno di WordPress è presente una copia di jQuery abbastanza recente ma
in modalità no-conflict ovvero dove il $ non viene riconosciuto come alias della
libreria, perché già usato da Prototype!
Le alternative possono essere:
• ri-registrare la copia interna di jQuery sostituendola con una “nostra” o presa
magari da un CDN (in genere quello di Google)
• ri-definire l’alias all’interno del file di Javascript in cui ci serve
Entrambi i metodi sono descritti nella pagina del Codex di wp_enqueue_script().
WordCamp Salvatore Laisa
Milano 2012 www.salvatorelaisa.net
11. Parte 2:
Mettiamoci un pò di
Ajax in questo tema!
E la cosa non dispiacerà neanche
ai plugin
WordCamp Foto:
Milano 2012 “Ajax for dummies” - Daveynin
12. Perché WordPress e Ajax sono una grande coppia
Tutti i caricamenti compiuti tramite Ajax avvengono lato client quindi un ipotetico
CMS basato completamente su questo sarebbe quasi invisibile per i motori di
ricerca.
WordPress al momento di pubblicazione di un articolo o pagina “crea” sempre
una definizione di essa lato server (e quindi indicizzabile). Possiamo sfruttare il
fatto che le pagine già esistono per caricarle con Ajax a rendere l’esperienza
utente più snella e reattiva!
WordCamp Salvatore Laisa
Milano 2012 www.salvatorelaisa.net
13. Cosa possiamo Ajaxare?
Volendo anche tutto! Ma come tutte le tecniche è importante applicare AJAX
solo quando lo riteniamo opportunamente efficace e non a sproposito!
I casi più diffusi in genere sono:
• caricamento pagine/articoli
• submit di informazioni in una form (anche i commenti!)
• importazione feed esterni (Rss, Flickr, Twitter, ecc.)
(PS: userò jQuery per i prossimi esempi!)
WordCamp Salvatore Laisa
Milano 2012 www.salvatorelaisa.net
14. Post casuali 1/2
Possiamo fare in modo che un template carichi in modo casuale dei post, a
livello di PHP il codice può essere:
Ora possiamo fare in modo che un pulsante “refreshi” in modo asincrono questa porzione di
pagina così da ottenere un nuovo post casuale.
WordCamp Salvatore Laisa
Milano 2012 www.salvatorelaisa.net
15. Post casuali 2/2
Da qualche parte nel HTML devo memorizzare l’url della pagina, poi con
Javascript e jQuery...
Ora possiamo fare in modo che un pulsante “refreshi” in modo asincrono questa porzione di
pagina così da ottenere un nuovo post casuale.
WordCamp Salvatore Laisa
Milano 2012 www.salvatorelaisa.net
16. Back to the future
Quando carichiamo pagine con Ajax entra in gioco il discorso di eventi su
elementi “futuri”, ovvero che non sono presenti dall’inizio nella pagina ma
arriveranno (forse più avanti) con una chiamata asincrona.
I normali gestori di eventi non funzionano, ma jQuery ha la funzione “on” per
agganciare eventi a questi elementi:
WordCamp Salvatore Laisa
Milano 2012 www.salvatorelaisa.net
17. Ajaxare una form 1/2
WordPress elimina gran parte del dolore nella creazione di form per commenti e
grazie ad alcuni plugin anche per form di contatti!
Validarle lato client ed evitare passaggi di pagine per invio dati rende l’esperienza
di compilazione delle form molto più piacevole e fluida.
Prima di tutto... andiamo a prendere il nome della form generata!
WordCamp Salvatore Laisa
Milano 2012 www.salvatorelaisa.net
18. Ajaxare una form 2/2 (il più è Javascript)
Possiamo usare la funzione wp_mail() per gestire manualmente gli invii!
WordCamp Salvatore Laisa
Milano 2012 www.salvatorelaisa.net
19. Parte 3:
Case histories
AKA - se gli altri si buttano da un
ponte lo fai anche tu?
Foto:
WordCamp “Ocean view branch” - Orange
Milano 2012 County Archives
20. Minimalista (tema)
Portofolio fotografico + pagine caricate in Ajax + Lightbox =
cari vecchi siti in Flash :-)
WordCamp Salvatore Laisa
Milano 2012 www.salvatorelaisa.net
21. AGT Noname (tema)
I caricamenti dei contenuti avvengono tramite Ajax (con icona animata di
caricamento).
WordCamp Salvatore Laisa
Milano 2012 www.salvatorelaisa.net
22. Jetpack - Statistiche sito (plugin)
Il caricamento dei dati di analitiche vengono importati e manipolati tramite Ajax
permettendo così di rimanere sempre nella stessa pagina della bacheca.
WordCamp Salvatore Laisa
Milano 2012 www.salvatorelaisa.net
23. Parte 4:
Risorse e altra
“robbba giusta”
Plugin, guide e tutorial utili e non!
WordCamp Foto:
Milano 2012 “Presents” - Msmorningtom
24. Plugin Ajaxosi di WordPress
• Post Ratings - Aggiunge un sistema di punteggio per post/pagine che si
aggiorna in tempo reale.
• Jetpack - Set di plugin by Automattic, tra cui: creazione form di contatto e
widget per Twitter.
• Contact Form 7 - Plugin per generare form direttamente da backend (e
risparmiare qualche mezzoretta!)
WordCamp Salvatore Laisa
Milano 2012 www.salvatorelaisa.net
25. Librerie Javascript da considerare con WP
• MicroAjax - se volete un comodo wrapper per Ajax (0.4 kb!) senza dover
includere librerie intere come jQuery o Prototype
• Fancybox - è un plugin di jQuery per creare gallerie, ma supporta anche il
caricamento di contenuti Html
• Mini JS | Notification - Utile per mostrare avvisi di operazioni eseguite
• jQuery UI Tabs - (ricordatevi è gia incluso in WP!) hanno una comoda modalità
Ajax facile da utilizzare!
WordCamp Salvatore Laisa
Milano 2012 www.salvatorelaisa.net
26. Tutorial, guide, libri
• WP Tuts+ - Abbastanza recente, ma si è già guadagnato una buona reputazione
ed è abbastanza tecnico! (mitici Envato)
• WPLift - spazia molto tra gli argomenti ma molto valido.
• WPMania & WordPress Italy - siti italiani di tutorial e reviews plugin/temi.
• jQuery Novice to Ninja 2nd Edition - Libro edito da Sitepoint.com, ha una
buona parte su Ajax!
• WordPress & Ajax - eBook sulla coppia che scoppia wpajax.com
WordCamp Salvatore Laisa
Milano 2012 www.salvatorelaisa.net
27. Ultima nota
Queste slide e un tema Ajaxoso con le tecniche affrontate in questo talk sono
disponibili da scaricare dal mio sito personale
www.salvatorelaisa.net
aggratis! e mi raccomando condividete!
WordCamp Salvatore Laisa
Milano 2012 www.salvatorelaisa.net
28. e a questo punto....
GRAZIE!
(e dateci dentro di domande!)
WordCamp Salvatore Laisa
Milano 2012 salvatorelaisa.net