Google Web Toolkit  Введение в средство разработкипользовательского WEB интерфейса                                       A...
Содержание Трудности GWT решение Как работает GWT? Возможности GWT Паттерны и библиотеки
WEB приложение: трудности
GWT решение Дружественная для разработчиков – Совместимость с IDE,   отладка, рефакторинг,   строгая типизация… Не зависит...
GWT: основной принцип Пишем код на Java Компилируем Java код в JavaScript JavaScript выполняется в браузере
GWT: HelloWorldpublic class HelloWorld implements EntryPoint {  public void onModuleLoad() {     RootPanel panel = RootPan...
Более полезные приложения Google Wave – https://wave.google.com Google AdWords – https://adwords.google.com А так же много...
GWT Архитектураhttp://www.slideshare.net/dgirard/introduction-to-google-web-toolkit
Виджетыhttp://gwt.google.com/samples/Showcase/Showcase.html
Поддержка истории (back button)    Одностраничный интерфейс с поддержкой истории    GWT ShowCase - как примерHistory.addVa...
Декларативный интерфейс (UiBinder) Разделение Вида от Поведения XML вместо Java кода Шаблонизация виджетов и их взаимного ...
AJAX: RPC это простоprivate void getData() {   DataServiceAsync rpc = (DataServiceAsync) GWT.create(DataService.class);   ...
Сериализуемые типы java.io.Serializable совместимая* – Наследник java.io.Serializable – Конструктор без аргументов (или бе...
Мост из Java в JavaScript (JSNI) Возможность вызова JS методов из GWT Java кодаprivate native void someJSFunction(Date val...
JavaScript Overlay типыprivate native void registerGWTFunction() /*-{   var _this = this;   $wnd.registeredGWTFunction = f...
Оптимизация
Cross-browser поддержка Скомпилированный JavaScript оптимизирован Только необходимое API грузится браузером (пермутация) –...
Сборка ресурсов1 запрос вместо 12ClientBundle–   CSSResource–   ImageResource–   TextResource–   И т.д.    (http://code.go...
Разделение кода Отдельные части большого приложения загружаются по требованию GWT.runAsync(new RunAsyncCallback() {   publ...
Отладка
Отладка скомпилированного JS Это возможно! Достаточно изменить один параметр компилятора – -style pretty Зачастую в этом н...
JUnit тестирование Возможность тестирование не «родного» кода непосредственно с помощью JUnit GWTTestCase в противном случ...
MVP (GWT pattern) Model – Модель данных, бизнес модель View – Отображение данных (UiBinder widget, GWT plain widget, etc.)...
Activities & Places (GWT pattern) Место (Place)  – Состояние UI конвертируемое в/из URL hash (#...) Активность (Activity) ...
GWT паттерны и библиотеки MVP (Model View Presenter) GWT-Platform – http://code.google.com/webtoolkit/articles/mvp-archite...
Q&A
Gwt jug basic
Gwt jug basic
Gwt jug basic
Upcoming SlideShare
Loading in...5
×

Gwt jug basic

678

Published on

Gwt jug basic by Antonov Anton

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
678
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
2
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Gwt jug basic

  1. 1. Google Web Toolkit Введение в средство разработкипользовательского WEB интерфейса Anton Antonov anton.antonov@sigmaukraine.com 2011
  2. 2. Содержание Трудности GWT решение Как работает GWT? Возможности GWT Паттерны и библиотеки
  3. 3. WEB приложение: трудности
  4. 4. GWT решение Дружественная для разработчиков – Совместимость с IDE, отладка, рефакторинг, строгая типизация… Не зависит от реализации и платформы сервера – Java (Tomcat, Jboss, и т.д.) – PHP/CGI (Apache) – .Net (IIS)
  5. 5. GWT: основной принцип Пишем код на Java Компилируем Java код в JavaScript JavaScript выполняется в браузере
  6. 6. GWT: HelloWorldpublic class HelloWorld implements EntryPoint { public void onModuleLoad() { RootPanel panel = RootPanel.get(); Label message = new Label("Hello World!!!"); panel.add(message); Button button = new Button("Click ME"); panel.add(button); button.addClickHandler(new ClickHandler() { public void onClick(ClickEvent event) { Window.alert("Hello World!"); } }); }}
  7. 7. Более полезные приложения Google Wave – https://wave.google.com Google AdWords – https://adwords.google.com А так же много других – http://gwtgallery.appspot.com
  8. 8. GWT Архитектураhttp://www.slideshare.net/dgirard/introduction-to-google-web-toolkit
  9. 9. Виджетыhttp://gwt.google.com/samples/Showcase/Showcase.html
  10. 10. Поддержка истории (back button) Одностраничный интерфейс с поддержкой истории GWT ShowCase - как примерHistory.addValueChangeHandler(new ValueChangeHandler<String>() { public void onValueChange(ValueChangeEvent<String>stringValueChangeEvent) { //do something on history change } });
  11. 11. Декларативный интерфейс (UiBinder) Разделение Вида от Поведения XML вместо Java кода Шаблонизация виджетов и их взаимного расположения Интеграция с внешними ресурсами (CSS, картинки)
  12. 12. AJAX: RPC это простоprivate void getData() { DataServiceAsync rpc = (DataServiceAsync) GWT.create(DataService.class); rpc.getDataModel(5, 6, new AsyncCallback<DataModel>() { public void onFailure(Throwable throwable) { Window.alert("Unable get data from server" + throwable); } public void onSuccess(DataModel dataModel) { Window.alert("Server response:n" + dataModel.getDataString() + dataModel.getDataInt()); } });}
  13. 13. Сериализуемые типы java.io.Serializable совместимая* – Наследник java.io.Serializable – Конструктор без аргументов (или без конструктора) любой видимости – Все non-final и non-transient поля должны быть сериализуемы
  14. 14. Мост из Java в JavaScript (JSNI) Возможность вызова JS методов из GWT Java кодаprivate native void someJSFunction(Date value) /*-{ $wnd.someJSFunction(value);}-*/; Возможность вызова GWT методов из JS кода – Код на следующем слайде Существует множество обверток над существующими JS библиотеками (Google Charts, JQuery и т.д.) Можно легко писать свои обвертки
  15. 15. JavaScript Overlay типыprivate native void registerGWTFunction() /*-{ var _this = this; $wnd.registeredGWTFunction = function (v) { _this.@com.sigmaukraine.jug.jsni.client.JSNI ::jsAccessibleFunction (Lcom/sigmaukraine/jug/jsni/client/overlay/JSOverlay;) (v); };}-*/;private void jsAccessibleFunction(JSOverlay overlay) { Window.alert("Im GWT:nstr:" + overlay.getStr() + "nvalue:" + overlay.getValue());}
  16. 16. Оптимизация
  17. 17. Cross-browser поддержка Скомпилированный JavaScript оптимизирован Только необходимое API грузится браузером (пермутация) – IE грузит JS только для IE, FireFox – JS только для FF – Неиспользуемое API исключается из скомпилированного JS
  18. 18. Сборка ресурсов1 запрос вместо 12ClientBundle– CSSResource– ImageResource– TextResource– И т.д. (http://code.google.com/webtoolkit/doc/latest/DevGuideClientBundle.html#ClientBundle )
  19. 19. Разделение кода Отдельные части большого приложения загружаются по требованию GWT.runAsync(new RunAsyncCallback() { public void onFailure(Throwable reason) { Window.alert("Cant load script part"); } public void onSuccess() { //The following code will be loaded on demand root.add(new HelloWorldPanel(textCell.getValue())); } });
  20. 20. Отладка
  21. 21. Отладка скомпилированного JS Это возможно! Достаточно изменить один параметр компилятора – -style pretty Зачастую в этом нет необходимости* – * это пока единственный способ отладки JSNI методов
  22. 22. JUnit тестирование Возможность тестирование не «родного» кода непосредственно с помощью JUnit GWTTestCase в противном случае – Позволяет тестировать логику виджетов, которые используют DOM модель, DeferredBinding или JSNI. Интеграция с IDE
  23. 23. MVP (GWT pattern) Model – Модель данных, бизнес модель View – Отображение данных (UiBinder widget, GWT plain widget, etc.) Presenter – Поведение или логика
  24. 24. Activities & Places (GWT pattern) Место (Place) – Состояние UI конвертируемое в/из URL hash (#...) Активность (Activity) – Инкапсуляция действия пользователя • Wake up • Set up • Show up – Обычно приводит к смене «места»
  25. 25. GWT паттерны и библиотеки MVP (Model View Presenter) GWT-Platform – http://code.google.com/webtoolkit/articles/mvp-architecture.html – http://code.google.com/p/gwt-platform/ Activities & Places – http://code.google.com/webtoolkit/doc/latest/DevGuideMvpActivitiesAndPlaces.html Gin (Dependency injection for GWT, based on Guice) – http://code.google.com/p/google-gin/ Spring MVC RPC integration (gwt-widget SL) – http://gwt-widget.sourceforge.net/gwt-sl/reference-1.0/index.html
  26. 26. Q&A
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×