• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Best Practices in Ext GWT
 

Best Practices in Ext GWT

on

  • 4,466 views

Ext GWT provides a solid foundation to build rich internet applications. In this session, you will learn the best practices used to build these applications. Topics include how to use HTML templates ...

Ext GWT provides a solid foundation to build rich internet applications. In this session, you will learn the best practices used to build these applications. Topics include how to use HTML templates and HtmlLayout, MVC / MVP, RPC, and managing data.

Statistics

Views

Total Views
4,466
Views on SlideShare
4,071
Embed Views
395

Actions

Likes
2
Downloads
100
Comments
0

2 Embeds 395

http://video-it.pl 394
http://webcache.googleusercontent.com 1

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Best Practices in Ext GWT Best Practices in Ext GWT Presentation Transcript

    • Ext GWT Best Practices in Ext GWT DARRELL MEYER, SENCHAMonday, November 29, 2010
    • Overview XTemplate & HtmlContainer Layouts RPC Dependency Injection MVPMonday, November 29, 2010
    • Conference AppMonday, November 29, 2010
    • Technology Stack Ext GWT 2.2.1 GWT 2.1 Java Persistence API (JPA) Google App Engine (GAE) RequestFactory GWT MVP Dependency Injection with Gin Download at http://dev.sencha.com/playpen/gxt/conference-app.zipMonday, November 29, 2010
    • IDE & Plugins Eclipse IDE for Java EE Developers (Helios 3.6.1) http://www.eclipse.org/downloads/ Plugins Maven Integration for Eclipse http://m2eclipse.sonatype.org/sites/m2e Maven Integration for Eclipse WTP Integration http://m2eclipse.sonatype.org/sites/m2e-extras Google Eclipse http://code.google.com/eclipse/Monday, November 29, 2010
    • XTemplate & HtmlContainerMonday, November 29, 2010
    • Templating in General Avoid using Widgets for layout Panels and Containers are slow Rendering HTML fragments is fast A small amount of HTML and CSS can go a long long wayMonday, November 29, 2010
    • XTemplate Advanced templating Apply HTML fragments to your data Features Formatting Auto filling lists using templates and sub-templates Conditional processing with basic comparator operators Basic math function support Execute arbitrary inline code with special built-in template variablesMonday, November 29, 2010
    • XTemplate Usage Direct support in Components ListView ComboBox RowExpander ColorPalette Generate content for any elementMonday, November 29, 2010
    • XTemplate ExampleMonday, November 29, 2010
    • HtmlContainer Inserts widgets into arbitrary HTML markup Supports three modes for container content Existing Element From Code RequestBuilderMonday, November 29, 2010
    • HtmlContainer ExampleMonday, November 29, 2010
    • LayoutsMonday, November 29, 2010
    • Layouts Use the fewest Layouts as possible Good for laying large sections of an application Not as good for showing detailed informationMonday, November 29, 2010
    • Layouts Hierarchy Layout Append Size Size & Position Anchor Border Box Column Fit Flow Row Table Absolute Form VBox HBox Accordian Card Fill TableRowMonday, November 29, 2010
    • Cascading Layouts Layouts are powerful as layout execution can cascade When containers are resized they execute their layout If a child of a container is resized by layout, it will execute its layout Viewport BorderLayout ContentPanel ContentPanel ContentPanel FitLayout RowLayout FlowLayout ToolBar TabPanel Grid Grid TabItem NOT RESIZEDMonday, November 29, 2010
    • Monitoring Layouts Inspect the DOM using tool such as Firebug Resize browser or panels Notice changes in DOM (width, height, top, left, etc)Monday, November 29, 2010
    • Monitoring LayoutsMonday, November 29, 2010
    • RPCMonday, November 29, 2010
    • RPC Best Practices RPC will return entire object graph Only return what you need for the given screenMonday, November 29, 2010
    • RPC Serialization Policy Always check GWT serialization file (*.gwt.rpc) Do not expose Object in RPC service interface BlacklistMonday, November 29, 2010
    • Dependency InjectionMonday, November 29, 2010
    • Dependency Injection Automatic dependency injection Avoid Factories Avoid use of new in your code GIN (client) and Guice (server) http://code.google.com/p/google-guice/ http://code.google.com/p/google-ginMonday, November 29, 2010
    • Without DI Avoid using “new” Avoid FactoriesMonday, November 29, 2010
    • GIN Example Extend Ginjector and define DI interfaceMonday, November 29, 2010
    • GIN Example Extend Ginjector and define DI interfaceMonday, November 29, 2010
    • GIN Example public class ConferenceModule extends AbstractGinModule { @Override protected void configure() { bind(EventBus.class).to(SimpleEventBus.class).in(Singleton.class); bind(ConferenceRequestFactory.class).toProvider(RequestFactoryProvider.class).in(Singleton.class); bind(PlaceController.class).toProvider(PlaceControllerProvider.class).in(Singleton.class); bind(DataLoaderAsync.class).toProvider(DataLoadControllerProvider.class).in(Singleton.class); bind(SessionListView.class).to(SessionListViewImpl.class).in(Singleton.class); bind(SessionDetailView.class).to(SessionDetailViewImpl.class).in(Singleton.class); } static class PlaceControllerProvider implements Provider<PlaceController> { private final EventBus eventBus; @Inject public PlaceControllerProvider(EventBus eventBus) { this.eventBus = eventBus; } public PlaceController get() { return new PlaceController(eventBus); } } }Monday, November 29, 2010
    • GIN Example public class ConferenceApp { private static final Logger log = Logger.getLogger(ConferenceApp.class.getName()); private ConferenceRequestFactory requestFactory; private EventBus eventBus; private PlaceController placeController; private ConferenceDesktopShell shell; private Place defaultPlace = new SessionListPlace(); private SessionListView sessionListView; private SessionDetailView sessionDetailView; private DataLoaderAsync service; @Inject public ConferenceApp(ConferenceDesktopShell shell, DataLoaderAsync service, ConferenceRequestFactory requestFactory, EventBus eventBus, PlaceController placeController) { this.shell = shell; this.service = service; this.requestFactory = requestFactory; this.eventBus = eventBus; this.placeController = placeController; }Monday, November 29, 2010
    • GIN Example Change implementation based on user agent / deviceMonday, November 29, 2010
    • GIN Example Change implementation based on user agent / deviceMonday, November 29, 2010
    • MVPMonday, November 29, 2010
    • MVP Example Presenters / Activities Views Places Place History Mappers Activity MappersMonday, November 29, 2010
    • Thanks! Twitter @darrellmeyer Portions of this presentation from the GWT documentation licensed under the Creative Commons Attribution 3.0 LicenseMonday, November 29, 2010