Web2 am Beispiel Google Mail, Text und Web Toolkit
-
Upload
gfu-cyrus-ag -
Category
Technology
-
view
999 -
download
0
description
Transcript of Web2 am Beispiel Google Mail, Text und Web Toolkit
© Markus Röder / IT Entwicklung : www.erex.de / Kommunikation & NLP: www.training-deluxe.de / Kontakt : [email protected]
WEB 2.0 für Entwickler
Neue Technologien und strategische Ansätze für eine moderne Architektur
am Beispiel :
Google Web Toolkit
© Markus Röder / IT Entwicklung : www.erex.de / Kommunikation & NLP: www.training-deluxe.de / Kontakt : [email protected]
Zu meiner Person• Klassischer Start: Dipl.Ing. Physik, OO Software Entwicklung,
Selbstständig in der IT seit 1993.
• Eigene Firma Erex Ebusiness Solutions
• Seit 2000 Trainer bei GFUSeit 2007 Aufsichtsratmitglied der Cyrus AG
• Nebenbei: Coach und Trainer in den Bereichen NLP und Kommunikation, TeamprozesseSeit 2006 Geschäftsführer von training.deluxe
• Seit 2007 Verbindung IT und Kommunikation in den Bereichen :Technik / Teams / Entwicklung / Infomanagement
© Markus Röder / IT Entwicklung : www.erex.de / Kommunikation & NLP: www.training-deluxe.de / Kontakt : [email protected]
Inhalte der Präsentation
• Neue Konzepte im Einsatz• AJAX• Java und Ajax• Google Web Toolkit• Rich Media Applications• Persönliche Einschätzung
© Markus Röder / IT Entwicklung : www.erex.de / Kommunikation & NLP: www.training-deluxe.de / Kontakt : [email protected]
Wettkampf der AmeisenMSOffice1
© Markus Röder / IT Entwicklung : www.erex.de / Kommunikation & NLP: www.training-deluxe.de / Kontakt : [email protected]
Neue Konzepte im Einsatz
• Das Web als Plattform
• Nutzung kollektiver Intelligenz
• Lightweight Programming Models
© Markus Röder / IT Entwicklung : www.erex.de / Kommunikation & NLP: www.training-deluxe.de / Kontakt : [email protected]
Beispiele
• Beispiele– Mashup : pageflakes– Social Tagging : XING– Single Page Applications
• Google Documents• Google Maps• Google Calendar• Google Startseite
© Markus Röder / IT Entwicklung : www.erex.de / Kommunikation & NLP: www.training-deluxe.de / Kontakt : [email protected]
Kollektive Intelligenz
• del.ici.ous ( Sozial Tagging ) • Wikipedia ( Kollektive• Cloudmark ( Social Spamfilter )• Blogging
© Markus Röder / IT Entwicklung : www.erex.de / Kommunikation & NLP: www.training-deluxe.de / Kontakt : [email protected]
Technische Realisierung
• Asynchrones Javascript mit XML
• AJAX• Datenübertragung
ohne Seitenaufruf• httpRequest Object
© Markus Röder / IT Entwicklung : www.erex.de / Kommunikation & NLP: www.training-deluxe.de / Kontakt : [email protected]
Einsatzbereiche Ajax
• Formularbasierte Interaktion• Navigation in hierarchischen Strukturen• Schnelle Interaktion User-User• Für Voting und Ranking• Filtern und Datenmanipulation• Hilfen Tipps Automatische Ergänzung.
© Markus Röder / IT Entwicklung : www.erex.de / Kommunikation & NLP: www.training-deluxe.de / Kontakt : [email protected]
Ajax - Nein danke
• Einfache Formulare• Suche• Navigation• Austausch von viel Text• Veränderung der Darstellung• SEO ?
© Markus Röder / IT Entwicklung : www.erex.de / Kommunikation & NLP: www.training-deluxe.de / Kontakt : [email protected]
Java und Ajax
Problem:• Entwicklung auf verschiedenen
Systemen• Versionsprobleme Server / Client• Kaum Testmöglichkeiten • Kein Einsatz von JUnit o.ä. im JS Code• Browserunterschiede
© Markus Röder / IT Entwicklung : www.erex.de / Kommunikation & NLP: www.training-deluxe.de / Kontakt : [email protected]
Lösungen
• Google Web Toolkit• DWR ( Direct Web Remoting )• JayJax ( in Entwicklung )
• Ähnlich Projekte sind in Entwicklungfür Ajax und JSF
© Markus Röder / IT Entwicklung : www.erex.de / Kommunikation & NLP: www.training-deluxe.de / Kontakt : [email protected]
Google Web Toolkit GWT
• August 2006• Jetzt unter Apache Lizenz V1.3 / 1.4• Entwicklung in Java• Testen in hosted Mode• Compile / Deploy nach Ajax JS
– inklusive Historymanagement– inklusive Html Wrapper
• Nutzung fertiger Widgets• Opensource Widgets verfügbar
– z.B ( GWT-Stuff ) code.google.com/p/gwt-stuff
© Markus Röder / IT Entwicklung : www.erex.de / Kommunikation & NLP: www.training-deluxe.de / Kontakt : [email protected]
© Markus Röder / IT Entwicklung : www.erex.de / Kommunikation & NLP: www.training-deluxe.de / Kontakt : [email protected]
Entwicklung mit GWT
• Vorteile– Schnelle Lernkurve dank Swing Komponents und
Events Ähnlichkeit– Entwicklung im hosted modus kapselt JS– Eclipse based Coding
• Nachteil– Noch relativ neue Technik,– kaum Erfahrungen mit größeren Client/Server
Entwicklungen
© Markus Röder / IT Entwicklung : www.erex.de / Kommunikation & NLP: www.training-deluxe.de / Kontakt : [email protected]
Development
• Hosted mode– Javacode läuft als echter Java code in einer emulierten Tomcat Umgebung
Gut für Entwicklung und Debug• Web mode
– Das Projekt wird compiliert und der Client Code in JS Code umgewandelt. Läuft in den meisten Browser ( Kritisch : Safari )
© Markus Röder / IT Entwicklung : www.erex.de / Kommunikation & NLP: www.training-deluxe.de / Kontakt : [email protected]
Entwicklungsschritte
• applicationcreator• projectcreator• Eclipse Java-Entwicklung im hosted mode
– Nutzen von Panels und Widgets– Rootpanel.get(„idscope“).add(...)– Remote Procedure Calls für Objektdaten– Javascript native Interface
© Markus Röder / IT Entwicklung : www.erex.de / Kommunikation & NLP: www.training-deluxe.de / Kontakt : [email protected]
Remote Procedure Calls• Gemeinsame
Schnittstelle für Client und Server
• Async Schnittstelle für Callback
• GWT.create(Service.class) erzeugt einen Proxy auf den Server
• Callback kann für Fehlerbehandlung genutzt werden
• Nutzt teilweise bereits bekannte Technologien
© Markus Röder / IT Entwicklung : www.erex.de / Kommunikation & NLP: www.training-deluxe.de / Kontakt : [email protected]
Und mehr ….
• Eine graphische Oberfläche– GWT Designer ( kostenpflichtig )
• Session Handling„Session state: a client not a server issue“
(Joel Webber)
• Browser History und Bookmarks– History : IFrame und Browser History Stack– Bookmarks: Noch nicht wirklich gelöst
• JSNI – Javascript Native Interface– Programmierung in Javascript immer noch möglich
© Markus Röder / IT Entwicklung : www.erex.de / Kommunikation & NLP: www.training-deluxe.de / Kontakt : [email protected]
Fazit• Konzentration auf Java Code – Problem im Detail
• Schnelle Lernkurve – einfacher Einstieg
• Webbased - statt Versionsverwaltung
• Überall einsetzbar -
• Trotzdem – Beobachten mit wachsamem Auge
„Taking the Pain out of Ajax Developmentwith GWT and Java“
(Orginaltext von Instantiations) MSOffice2
© Markus Röder / IT Entwicklung : www.erex.de / Kommunikation & NLP: www.training-deluxe.de / Kontakt : [email protected]
Weitere Ansätze
• Entwicklung mit Adobe FLEX 2.0–Rich Internet Applications auf Basis
von XML und Flash
• Open Lazlo ( Open Source Flex ) • Ajax mit JSF
© Markus Röder / IT Entwicklung : www.erex.de / Kommunikation & NLP: www.training-deluxe.de / Kontakt : [email protected]
Aktuelles• Kurse GWT bei GFU :
30.-31.08.2007 / 06.-07.12.2007
• Kurs auch Inhouse auf Anfrage (GFU)
• Entwicklung von GWT und RIA
• Kurs Kommunikation in IT Unternehmen im 29.10.-31.10.2007
• Direkte Beratung 0221 33777822
© Markus Röder / IT Entwicklung : www.erex.de / Kommunikation & NLP: www.training-deluxe.de / Kontakt : [email protected]
Wichtige Links zum Thema
• Google Web Toolkit– http://code.google.com/webtoolkit/– http://code.google.com/webtoolkit/documentation/– http://www.asquare.net/gwt/StaticStructure.jsp
( zeigt Klassenstruktur )• Addons für GWT
– http://code.google.com/p/gwt-stuff/– http://www.asquare.net/gwttk/– http://www.instantiations.com/gwtdesigner/
© Markus Röder / IT Entwicklung : www.erex.de / Kommunikation & NLP: www.training-deluxe.de / Kontakt : [email protected]
Beispiele Web 2.0• Atom• Creative Commons• Wikipedia• Backpack• Greasemonkey• REST• Google Maps• HousingMaps• alkemis local• Mappr!• Cadillac Ranch 02 on
Flickr• Plazes• Eventful• Podbop• Pandora• Last.fm• PandoraFM• ProgrammableWeb• Microformats• Structured Blogging
• del.icio.us/elisebauer/recipes
• La torre on Flickr• Popular Tags on Flickr• Flickr clusters• Flickr: Photos tagged
with squaredcircle• Collaborative Poster:
Giant Peach on Flickr• Flickr: Photos tagged
with adayinthelife• DILO Poster, 72dpi on
Flickr• Flickr: Explore
interesting photosaround Flickr
• The FlickrVerse, April 2005 poster on Flickr
• openBC• LinkedIn
• Lawrence Lessig: <freeculture>
• Ludwig Gatzke: Logo 2.0• Skype• Flickr• del.icio.us• Facebook• MySpace• YouTube• Read/WriteWeb• Flickr: Photos tagged
with whatsinyourbag• Tim O'Reilly: What Is
Web 2.0• Technorati• PubSub• IceRocket• Feedster• Google Blog Search• Reboot• RSS• SSE
FlockTim O'Reilly: The Architecture of ParticipationJames Surowiecki: The Wisdom of CrowdsDiggBitTorrentAdam Curry: Daily SourceCodeRocketboomJosh Leo's VlogGeek Entertainment TVthe show with zefrankAlfies Moblog: London Underground bombing, trappedWikipedia: 7 July 2005 London bombingsChris Anderson: The Long TailQYPEJotSpot37signals