SlideShare a Scribd company logo
1 of 44
Download to read offline
Juzu framework
Web framework for portlet development




                                        Kien Nguyen
                                          Portal team
                                           May 2012
Agenda


1   −Concepts in Juzu framework
     − Introduction
     − Main concepts



2
    −Develop portlets based Juzu framework
     − Features
     − How to develop portlets



3   −Demonstrate building portlets
     − Setup environment
     − Build, deploy, Test



4   −Some comparision to others
     − Webui portlets
     − Spring, Strut portlet




                   www.exoplatform.com - Copyright 2012 eXo Platform   2
Introduction

- What is the juzu framework?

- MVC model

- Request life cycle
 + View, Action, Resource phases

- Juzu Controllers

- Juzu Application

- Juzu running mode

- Type safe parameters




                         www.exoplatform.com - Copyright 2012 eXo Platform   3
Introduction




               www.exoplatform.com - Copyright 2012 eXo Platform   4
What is the Juzu?

- Juzu is an open source project developed on GitHub project licensed under
the LGPL 2.1 license

- Source repository: https://github.com/juzu/juzu

- Website: http://juzuweb.org/

- Author: Julien Viet




                        www.exoplatform.com - Copyright 2012 eXo Platform     5
What is the Juzu?

- Juzu is a web framework based on MVC concepts for developing Portlet
applications.

- Develop powerful web applications

- Emphasises on simplicity and type safety




                      www.exoplatform.com - Copyright 2012 eXo Platform   6
Concepts in Juzu
MVC - Model-View-Controller




                    www.exoplatform.com - Copyright 2012 eXo Platform   7
Concepts in Juzu
MVC - Model-View-Controller




→ Spring, Struts,.. and Juzu


                      www.exoplatform.com - Copyright 2012 eXo Platform   8
Request lifecycle in Juzu

- View phase: Produce markup output aggregated within a page

- Action phase: Process an action

- Resource phase: produce any kind of output as a full response (i.e not in a
page)




                      www.exoplatform.com - Copyright 2012 eXo Platform         9
Request lifecycle in Juzu

View phase
- View phases are mapped on GET requests
- Idempotent
- View parameters are identified to query parameters




                      www.exoplatform.com - Copyright 2012 eXo Platform   10
Request lifecycle in Juzu

Action phase
- Processing a link
- The action phase is mapped on POST requests
- Not idempotent
- Action parameters are identified to form parameters
- Action phase and POST requests should not be invoked more than one time




                     www.exoplatform.com - Copyright 2012 eXo Platform      11
Request lifecycle in Juzu

Resource phase
- GET request
- Entire response
- Use for Ajax, static resources like image, javascript, etc




                       www.exoplatform.com - Copyright 2012 eXo Platform   12
Juzu Controllers

Controller is part C of MVC model
- They are annotated methods of juzu application
- Kinds of controllers are mapped to phases (View, Action, Resource)
     + @org.juzu.View
     + @org.juzu.Action
     + @org.juzu.Resource




                      www.exoplatform.com - Copyright 2012 eXo Platform   13
Juzu running mode


- prod: production

- dev: development




                     www.exoplatform.com - Copyright 2012 eXo Platform   14
Juzu Application


Juzu app is a portlet application

- Package info
Store application information

- Controllers

- Templates

- Models




                      www.exoplatform.com - Copyright 2012 eXo Platform   15
Type safe parameters


Say about expression parameters in templates:
- Easily to pass parameters from Controllers to templates
- type safe with error checking automatically
- By Annotation processor and Eclipse code completion




                      www.exoplatform.com - Copyright 2012 eXo Platform   16
Develop portlets based Juzu framework

- Simple demo

- Overview JuzuPortlet

- Define fragments with #insert, #decorator, #include, #title

- Template type safe parameters with #param

- Actions

- Bean mapping

- Scope

- Ajax

- Portlet preferences

- I18n

- etc

                          www.exoplatform.com - Copyright 2012 eXo Platform   17
Develop portlets based Juzu framework


                Demo simple Juzu portlet




              www.exoplatform.com - Copyright 2012 eXo Platform   18
JuzuPortlet


- Is known as front controller of Juzu application

- Navigate to Controllers

- Navigate to running mode

- Navigate to dependency injection container

     ...




                            www.exoplatform.com - Copyright 2012 eXo Platform   19
Define UI fragments

- #{insert/}
Insert a template into a template

<div class="ShindigOAuth">
     <div class="ONavigation">
        <a href="@{OAuthStore.index()}"><<< Back to List</a>
     </div>
     <br />

     #{insert/}
</div>

- #{decorator}
Hook a template into a template

#{decorate path=main.gtmpl/}




                         www.exoplatform.com - Copyright 2012 eXo Platform   20
Define UI fragments

- #{include path=.../}
Include a template

<div id="myTabContent" class="tab-content">
       <div class="tab-pane fade active in" id="settings">
        #{include path=settings.gtmpl/}
       </div>
       <div class="tab-pane fade" id="layout">
        #{include path=layout.gtmpl/}
       </div>
       <div class="tab-pane fade" id="permission">
         #{include path=permission.gtmpl/}
       </div>
</div>

- #{title value=...}
Set portlet title

#{title value='Hello Juzu'/}


                           www.exoplatform.com - Copyright 2012 eXo Platform   21
Template type safe parameters

- Means errors checking during compile time

- Use tag #param in template
#{param name=location/}
#{param name=temperature/}

The weather temperature in ${location} is ${temperature} degrees.

- Use paramters in controller
  @Path("index.gtmpl")
  @Inject
  org.exoplatform.example.templates.index index;

 @View
 public void index()
 {
   index.with().location("Ha Noi").temperature("30").render();
 }



                         www.exoplatform.com - Copyright 2012 eXo Platform   22
Actions

Actions are method annotated by the @Action annotation

- In Templates:
   @{...}

- In Controllers:
   @Action
   public Response add(String location)
   {
   }

Example:
<form action="@{add()}" method="post">
  <input type="text" name="location" value=""/>
  <input type="submit"/>
</form>




                        www.exoplatform.com - Copyright 2012 eXo Platform   23
Form and Bean mapping

- org.juzu.Param
@Param
public class Setting
{
  private String path;
  public String getPath()
  {
    return path;
  }
  public void setPath(String path)
  {
    this.path = path;
  }
}
- Submit parameter meet to properties of @Param object
<input type="text" name="path" value="" />




                       www.exoplatform.com - Copyright 2012 eXo Platform   24
Scope


- Flash
      @FlashScoped

- Request
     @RequestScoped

- Session
     @SessionScoped




                      www.exoplatform.com - Copyright 2012 eXo Platform   25
Portlet preferences


- Every portlet will be provided a PortletPreferences object

@Inject
PortletPreferences preferences;

String grade = preferences.getValue("grade", "c");

preferences.setValue("grade", grade);




                         www.exoplatform.com - Copyright 2012 eXo Platform   26
Portlet mode and Window state


- By default, Juzu injects Portlet mode/Window state as a property in request context
object: JuzuPortlet.PORTLET_MODE, JuzuPortlet.WINDOW_STATE

Example:
@View
 public void index()
 {
   if (Request.getCurrent().getContext().getProperty(JuzuPortlet.PORTLET_MODE) ==
PortletMode.VIEW)
   {
      index.with().location("Ha Noi").temperature("30").render();
   }
   else
   {
      edit.render();
   }
 }



                         www.exoplatform.com - Copyright 2012 eXo Platform              27
Assets plugin


- Javascript

- Stylesheet




                www.exoplatform.com - Copyright 2012 eXo Platform   28
Assets plugin

@Application(defaultController =
org.sample.booking.controllers.Application.class)
@Portlet
@Assets(
  scripts = {
     @Script(id = "jquery", src = "/public/javascripts/jquery-1.7.1.min.js"),
     @Script(src = "/public/javascripts/jquery-ui-1.7.2.custom.min.js", depends =
"jquery"),
     @Script(src = "/public/javascripts/booking.js", depends = "ajax.app")
  },
  stylesheets = {
     @Stylesheet(src = "/public/stylesheets/main.css")
  }
)
package org.sample.booking;




                      www.exoplatform.com - Copyright 2012 eXo Platform             29
Ajax Plugin / Jquery extension
- Resource method
 @Ajax
 @Resource
 public void addGadgetURIToKey(String gadgetURI, String keyName){...}

- Jquery javascript api request
  var root = $(this).jz();
  root.find(".uris").jzLoad(
                 "OAuthStore.addGadgetURIToKey()",
                 {gadgetURI : gadgetURI,
                 keyName : keyName},
                 function() {});
- web.xml
<servlet>
   <servlet-name>AssetServlet</servlet-name>
   <servlet-class>org.juzu.impl.asset.AssetServlet</servlet-class>
   <load-on-startup>0</load-on-startup>
  </servlet>
  <servlet-mapping>
   <servlet-name>AssetServlet</servlet-name>
   <url-pattern>/assets/*</url-pattern>
  </servlet-mapping>

                         www.exoplatform.com - Copyright 2012 eXo Platform   30
Others

- I18n - #[foo.bar]
- Bean Validation – JSR 303
- Errors
- Taglibs
- Portlet events
- Less compilation
- etc




                        www.exoplatform.com - Copyright 2012 eXo Platform   31
Demonstrate building portlets


- Setup environment
- Build
- Deploy




                      www.exoplatform.com - Copyright 2012 eXo Platform   32
Create Juzu Application

- Maven archetype

mvn archetype:generate 
 -DarchetypeGroupId=org.juzu 
 -DarchetypeArtifactId=juzu-archetype 
 -DarchetypeVersion=0.4.5-SNAPSHOT 
 -DgroupId=org.juzu 
 -DartifactId=juzu-sample 
 -Dversion=1.0




                       www.exoplatform.com - Copyright 2012 eXo Platform   33
Setup Eclipse environment




              www.exoplatform.com - Copyright 2012 eXo Platform   34
Setup Eclipse environment




              www.exoplatform.com - Copyright 2012 eXo Platform   35
Setup Eclipse environment




              www.exoplatform.com - Copyright 2012 eXo Platform   36
Setup Eclipse environment




              www.exoplatform.com - Copyright 2012 eXo Platform   37
M2E APT for Juzu portlet

Install m2e-apt plugin on Eclipse
http://download.jboss.org/jbosstools/updates/m2e-extensions/m2e-apt




See detail blog here:
https://community.jboss.org/en/tools/blog/2012/05/20/annotation-processing-support-in-
m2e-or-m2e-apt-100-is-out




                        www.exoplatform.com - Copyright 2012 eXo Platform                38
Annotation processor log

- target/generated/org/juzu/processor.log




                         www.exoplatform.com - Copyright 2012 eXo Platform   39
Demonstration




                www.exoplatform.com - Copyright 2012 eXo Platform   40
[Disscussion] comparision to others


- Webui
- Spring 3
- Strut 2
- Stripes
- Wicket
- Tapestry
- JSF
...




              www.exoplatform.com - Copyright 2012 eXo Platform   41
Criteria


- Speed to build: IDE tools
- Clearly extensible/plugable
- Documentation
- Testability
- Built-in features: Ajax, Validation, i18n, etc
- Page decorator
- Designer support
- Portability




                           www.exoplatform.com - Copyright 2012 eXo Platform   42
Resources
   Documentations and Screenshots



- https://github.com/juzu/juzu
- http://juzuweb.org/
- https://github.com/vietj/gatein-people
- https://github.com/kiennguyen/portlet-examples
Thank You
Questions?
Contact: kienna@exoplatform.com

More Related Content

What's hot

JavaServer Faces 2.0 - JavaOne India 2011
JavaServer Faces 2.0 - JavaOne India 2011JavaServer Faces 2.0 - JavaOne India 2011
JavaServer Faces 2.0 - JavaOne India 2011Arun Gupta
 
Hyperproductive JSF 2.0 @ JavaOne Brazil 2010
Hyperproductive JSF 2.0 @ JavaOne Brazil 2010Hyperproductive JSF 2.0 @ JavaOne Brazil 2010
Hyperproductive JSF 2.0 @ JavaOne Brazil 2010Arun Gupta
 
Java Portlet 2.0 (JSR 286) Specification
Java Portlet 2.0 (JSR 286) SpecificationJava Portlet 2.0 (JSR 286) Specification
Java Portlet 2.0 (JSR 286) SpecificationJohn Lewis
 
Headless Drupal en pratique
Headless Drupal en pratiqueHeadless Drupal en pratique
Headless Drupal en pratiqueSimon Morvan
 
Introduction to java standard portlets
Introduction to java standard portletsIntroduction to java standard portlets
Introduction to java standard portletsRohan Faye
 
Symfony2, Backbone.js &amp; socket.io - SfLive Paris 2k13 - Wisembly
Symfony2, Backbone.js &amp; socket.io - SfLive Paris 2k13 - WisemblySymfony2, Backbone.js &amp; socket.io - SfLive Paris 2k13 - Wisembly
Symfony2, Backbone.js &amp; socket.io - SfLive Paris 2k13 - WisemblyGuillaume POTIER
 
Spring MVC
Spring MVCSpring MVC
Spring MVCyuvalb
 
Beyond DOMReady: Ultra High-Performance Javascript
Beyond DOMReady: Ultra High-Performance JavascriptBeyond DOMReady: Ultra High-Performance Javascript
Beyond DOMReady: Ultra High-Performance Javascriptaglemann
 
Ionic tabs template explained
Ionic tabs template explainedIonic tabs template explained
Ionic tabs template explainedRamesh BN
 
Jetpack, with new features in 2021 GDG Georgetown IO Extended
Jetpack, with new features in 2021 GDG Georgetown IO ExtendedJetpack, with new features in 2021 GDG Georgetown IO Extended
Jetpack, with new features in 2021 GDG Georgetown IO ExtendedToru Wonyoung Choi
 
Enjoy the vue.js
Enjoy the vue.jsEnjoy the vue.js
Enjoy the vue.jsTechExeter
 
How to Webpack your Django!
How to Webpack your Django!How to Webpack your Django!
How to Webpack your Django!David Gibbons
 
Angular JS blog tutorial
Angular JS blog tutorialAngular JS blog tutorial
Angular JS blog tutorialClaude Tech
 
Building an app with Google's new suites
Building an app with Google's new suitesBuilding an app with Google's new suites
Building an app with Google's new suitesToru Wonyoung Choi
 
Using Renderless Components in Vue.js during your software development.
Using Renderless Components in Vue.js during your software development.Using Renderless Components in Vue.js during your software development.
Using Renderless Components in Vue.js during your software development.tothepointIT
 

What's hot (20)

JavaServer Faces 2.0 - JavaOne India 2011
JavaServer Faces 2.0 - JavaOne India 2011JavaServer Faces 2.0 - JavaOne India 2011
JavaServer Faces 2.0 - JavaOne India 2011
 
Angular js
Angular jsAngular js
Angular js
 
Hyperproductive JSF 2.0 @ JavaOne Brazil 2010
Hyperproductive JSF 2.0 @ JavaOne Brazil 2010Hyperproductive JSF 2.0 @ JavaOne Brazil 2010
Hyperproductive JSF 2.0 @ JavaOne Brazil 2010
 
Java Portlet 2.0 (JSR 286) Specification
Java Portlet 2.0 (JSR 286) SpecificationJava Portlet 2.0 (JSR 286) Specification
Java Portlet 2.0 (JSR 286) Specification
 
Headless Drupal en pratique
Headless Drupal en pratiqueHeadless Drupal en pratique
Headless Drupal en pratique
 
Introduction to java standard portlets
Introduction to java standard portletsIntroduction to java standard portlets
Introduction to java standard portlets
 
Extend sdk
Extend sdkExtend sdk
Extend sdk
 
Symfony2, Backbone.js &amp; socket.io - SfLive Paris 2k13 - Wisembly
Symfony2, Backbone.js &amp; socket.io - SfLive Paris 2k13 - WisemblySymfony2, Backbone.js &amp; socket.io - SfLive Paris 2k13 - Wisembly
Symfony2, Backbone.js &amp; socket.io - SfLive Paris 2k13 - Wisembly
 
Spring MVC
Spring MVCSpring MVC
Spring MVC
 
Java Server Faces
Java Server FacesJava Server Faces
Java Server Faces
 
Sane Async Patterns
Sane Async PatternsSane Async Patterns
Sane Async Patterns
 
Beyond DOMReady: Ultra High-Performance Javascript
Beyond DOMReady: Ultra High-Performance JavascriptBeyond DOMReady: Ultra High-Performance Javascript
Beyond DOMReady: Ultra High-Performance Javascript
 
Ionic tabs template explained
Ionic tabs template explainedIonic tabs template explained
Ionic tabs template explained
 
Jetpack, with new features in 2021 GDG Georgetown IO Extended
Jetpack, with new features in 2021 GDG Georgetown IO ExtendedJetpack, with new features in 2021 GDG Georgetown IO Extended
Jetpack, with new features in 2021 GDG Georgetown IO Extended
 
Enjoy the vue.js
Enjoy the vue.jsEnjoy the vue.js
Enjoy the vue.js
 
How to Webpack your Django!
How to Webpack your Django!How to Webpack your Django!
How to Webpack your Django!
 
Angular JS blog tutorial
Angular JS blog tutorialAngular JS blog tutorial
Angular JS blog tutorial
 
Building an app with Google's new suites
Building an app with Google's new suitesBuilding an app with Google's new suites
Building an app with Google's new suites
 
Jsf presentation
Jsf presentationJsf presentation
Jsf presentation
 
Using Renderless Components in Vue.js during your software development.
Using Renderless Components in Vue.js during your software development.Using Renderless Components in Vue.js during your software development.
Using Renderless Components in Vue.js during your software development.
 

Viewers also liked

Guidelines notetaking
Guidelines notetakingGuidelines notetaking
Guidelines notetakingligo178
 
iOS UX by iMakeit4U
iOS UX by iMakeit4UiOS UX by iMakeit4U
iOS UX by iMakeit4UiMakeit4U
 
Guidelines for Beginning Your Thesis Paper
Guidelines for Beginning Your Thesis PaperGuidelines for Beginning Your Thesis Paper
Guidelines for Beginning Your Thesis Paperligo178
 
STIHL Southeast Direct Mail
STIHL Southeast Direct MailSTIHL Southeast Direct Mail
STIHL Southeast Direct MailOJ Graczyk
 
Guidelines Note taking
Guidelines Note takingGuidelines Note taking
Guidelines Note takingligo178
 
Library orientation bayshore
Library orientation bayshoreLibrary orientation bayshore
Library orientation bayshoreligo178
 

Viewers also liked (7)

Guidelines notetaking
Guidelines notetakingGuidelines notetaking
Guidelines notetaking
 
Presentazione musella non vi dice ver b
Presentazione musella non vi dice ver bPresentazione musella non vi dice ver b
Presentazione musella non vi dice ver b
 
iOS UX by iMakeit4U
iOS UX by iMakeit4UiOS UX by iMakeit4U
iOS UX by iMakeit4U
 
Guidelines for Beginning Your Thesis Paper
Guidelines for Beginning Your Thesis PaperGuidelines for Beginning Your Thesis Paper
Guidelines for Beginning Your Thesis Paper
 
STIHL Southeast Direct Mail
STIHL Southeast Direct MailSTIHL Southeast Direct Mail
STIHL Southeast Direct Mail
 
Guidelines Note taking
Guidelines Note takingGuidelines Note taking
Guidelines Note taking
 
Library orientation bayshore
Library orientation bayshoreLibrary orientation bayshore
Library orientation bayshore
 

Similar to Juzu framework

How to develop nice portlet with Juzu framework
How to develop nice portlet with Juzu frameworkHow to develop nice portlet with Juzu framework
How to develop nice portlet with Juzu frameworkNguyễn Tuyến
 
Rich Portlet Development in uPortal
Rich Portlet Development in uPortalRich Portlet Development in uPortal
Rich Portlet Development in uPortalJennifer Bourey
 
CRaSH: the shell for the Java Platform
CRaSH: the shell for the Java PlatformCRaSH: the shell for the Java Platform
CRaSH: the shell for the Java Platformjviet
 
JMP103 : Extending Your App Arsenal With OpenSocial
JMP103 : Extending Your App Arsenal With OpenSocialJMP103 : Extending Your App Arsenal With OpenSocial
JMP103 : Extending Your App Arsenal With OpenSocialRyan Baxter
 
IBM Connect 2014 - JMP103: Extending Your Application Arsenal With OpenSocial
IBM Connect 2014 - JMP103: Extending Your Application Arsenal With OpenSocialIBM Connect 2014 - JMP103: Extending Your Application Arsenal With OpenSocial
IBM Connect 2014 - JMP103: Extending Your Application Arsenal With OpenSocialIBM Connections Developers
 
Job Managment Portlet
Job Managment PortletJob Managment Portlet
Job Managment Portletriround
 
MVC & SQL_In_1_Hour
MVC & SQL_In_1_HourMVC & SQL_In_1_Hour
MVC & SQL_In_1_HourDilip Patel
 
Java EE 7 - Novidades e Mudanças
Java EE 7 - Novidades e MudançasJava EE 7 - Novidades e Mudanças
Java EE 7 - Novidades e MudançasBruno Borges
 
Batch Applications for the Java Platform
Batch Applications for the Java PlatformBatch Applications for the Java Platform
Batch Applications for the Java PlatformSivakumar Thyagarajan
 
夜宴42期《Gadgets》
夜宴42期《Gadgets》夜宴42期《Gadgets》
夜宴42期《Gadgets》Koubei Banquet
 
Mobile App Development: Primi passi con NativeScript e Angular 2
Mobile App Development: Primi passi con NativeScript e Angular 2Mobile App Development: Primi passi con NativeScript e Angular 2
Mobile App Development: Primi passi con NativeScript e Angular 2Filippo Matteo Riggio
 
AtlasCamp 2015: Connect everywhere - Cloud and Server
AtlasCamp 2015: Connect everywhere - Cloud and ServerAtlasCamp 2015: Connect everywhere - Cloud and Server
AtlasCamp 2015: Connect everywhere - Cloud and ServerAtlassian
 
Protractor framework architecture with example
Protractor framework architecture with exampleProtractor framework architecture with example
Protractor framework architecture with exampleshadabgilani
 
securing-portlets-with-spring-security.pdf
securing-portlets-with-spring-security.pdfsecuring-portlets-with-spring-security.pdf
securing-portlets-with-spring-security.pdfjcarrey
 

Similar to Juzu framework (20)

How to develop nice portlet with Juzu framework
How to develop nice portlet with Juzu frameworkHow to develop nice portlet with Juzu framework
How to develop nice portlet with Juzu framework
 
Servlet 3.0
Servlet 3.0Servlet 3.0
Servlet 3.0
 
Jquery
JqueryJquery
Jquery
 
Rich Portlet Development in uPortal
Rich Portlet Development in uPortalRich Portlet Development in uPortal
Rich Portlet Development in uPortal
 
CRaSH: the shell for the Java Platform
CRaSH: the shell for the Java PlatformCRaSH: the shell for the Java Platform
CRaSH: the shell for the Java Platform
 
JMP103 : Extending Your App Arsenal With OpenSocial
JMP103 : Extending Your App Arsenal With OpenSocialJMP103 : Extending Your App Arsenal With OpenSocial
JMP103 : Extending Your App Arsenal With OpenSocial
 
IBM Connect 2014 - JMP103: Extending Your Application Arsenal With OpenSocial
IBM Connect 2014 - JMP103: Extending Your Application Arsenal With OpenSocialIBM Connect 2014 - JMP103: Extending Your Application Arsenal With OpenSocial
IBM Connect 2014 - JMP103: Extending Your Application Arsenal With OpenSocial
 
Job Managment Portlet
Job Managment PortletJob Managment Portlet
Job Managment Portlet
 
MVC & SQL_In_1_Hour
MVC & SQL_In_1_HourMVC & SQL_In_1_Hour
MVC & SQL_In_1_Hour
 
Java EE 7 - Novidades e Mudanças
Java EE 7 - Novidades e MudançasJava EE 7 - Novidades e Mudanças
Java EE 7 - Novidades e Mudanças
 
Batch Applications for the Java Platform
Batch Applications for the Java PlatformBatch Applications for the Java Platform
Batch Applications for the Java Platform
 
Banquet 42
Banquet 42Banquet 42
Banquet 42
 
夜宴42期《Gadgets》
夜宴42期《Gadgets》夜宴42期《Gadgets》
夜宴42期《Gadgets》
 
Mobile App Development: Primi passi con NativeScript e Angular 2
Mobile App Development: Primi passi con NativeScript e Angular 2Mobile App Development: Primi passi con NativeScript e Angular 2
Mobile App Development: Primi passi con NativeScript e Angular 2
 
AtlasCamp 2015: Connect everywhere - Cloud and Server
AtlasCamp 2015: Connect everywhere - Cloud and ServerAtlasCamp 2015: Connect everywhere - Cloud and Server
AtlasCamp 2015: Connect everywhere - Cloud and Server
 
Introduction to struts
Introduction to strutsIntroduction to struts
Introduction to struts
 
Protractor framework architecture with example
Protractor framework architecture with exampleProtractor framework architecture with example
Protractor framework architecture with example
 
Jsf
JsfJsf
Jsf
 
Advance jquery-plugin
Advance jquery-pluginAdvance jquery-plugin
Advance jquery-plugin
 
securing-portlets-with-spring-security.pdf
securing-portlets-with-spring-security.pdfsecuring-portlets-with-spring-security.pdf
securing-portlets-with-spring-security.pdf
 

Recently uploaded

From Family Reminiscence to Scholarly Archive .
From Family Reminiscence to Scholarly Archive .From Family Reminiscence to Scholarly Archive .
From Family Reminiscence to Scholarly Archive .Alan Dix
 
WordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your BrandWordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your Brandgvaughan
 
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024BookNet Canada
 
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks..."LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...Fwdays
 
H2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo Day
H2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo DayH2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo Day
H2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo DaySri Ambati
 
Unleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding ClubUnleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding ClubKalema Edgar
 
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024BookNet Canada
 
Developer Data Modeling Mistakes: From Postgres to NoSQL
Developer Data Modeling Mistakes: From Postgres to NoSQLDeveloper Data Modeling Mistakes: From Postgres to NoSQL
Developer Data Modeling Mistakes: From Postgres to NoSQLScyllaDB
 
Commit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyCommit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyAlfredo García Lavilla
 
DevoxxFR 2024 Reproducible Builds with Apache Maven
DevoxxFR 2024 Reproducible Builds with Apache MavenDevoxxFR 2024 Reproducible Builds with Apache Maven
DevoxxFR 2024 Reproducible Builds with Apache MavenHervé Boutemy
 
Gen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdfGen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdfAddepto
 
Unraveling Multimodality with Large Language Models.pdf
Unraveling Multimodality with Large Language Models.pdfUnraveling Multimodality with Large Language Models.pdf
Unraveling Multimodality with Large Language Models.pdfAlex Barbosa Coqueiro
 
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage CostLeverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage CostZilliz
 
SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024Lorenzo Miniero
 
Streamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project SetupStreamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project SetupFlorian Wilhelm
 
How to write a Business Continuity Plan
How to write a Business Continuity PlanHow to write a Business Continuity Plan
How to write a Business Continuity PlanDatabarracks
 
Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!Commit University
 
Advanced Test Driven-Development @ php[tek] 2024
Advanced Test Driven-Development @ php[tek] 2024Advanced Test Driven-Development @ php[tek] 2024
Advanced Test Driven-Development @ php[tek] 2024Scott Keck-Warren
 
"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii Soldatenko"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii SoldatenkoFwdays
 

Recently uploaded (20)

From Family Reminiscence to Scholarly Archive .
From Family Reminiscence to Scholarly Archive .From Family Reminiscence to Scholarly Archive .
From Family Reminiscence to Scholarly Archive .
 
WordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your BrandWordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your Brand
 
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
Transcript: New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
 
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks..."LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...
"LLMs for Python Engineers: Advanced Data Analysis and Semantic Kernel",Oleks...
 
H2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo Day
H2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo DayH2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo Day
H2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo Day
 
Unleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding ClubUnleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding Club
 
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
 
Developer Data Modeling Mistakes: From Postgres to NoSQL
Developer Data Modeling Mistakes: From Postgres to NoSQLDeveloper Data Modeling Mistakes: From Postgres to NoSQL
Developer Data Modeling Mistakes: From Postgres to NoSQL
 
Commit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyCommit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easy
 
E-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptx
E-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptxE-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptx
E-Vehicle_Hacking_by_Parul Sharma_null_owasp.pptx
 
DevoxxFR 2024 Reproducible Builds with Apache Maven
DevoxxFR 2024 Reproducible Builds with Apache MavenDevoxxFR 2024 Reproducible Builds with Apache Maven
DevoxxFR 2024 Reproducible Builds with Apache Maven
 
Gen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdfGen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdf
 
Unraveling Multimodality with Large Language Models.pdf
Unraveling Multimodality with Large Language Models.pdfUnraveling Multimodality with Large Language Models.pdf
Unraveling Multimodality with Large Language Models.pdf
 
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage CostLeverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
 
SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024
 
Streamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project SetupStreamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project Setup
 
How to write a Business Continuity Plan
How to write a Business Continuity PlanHow to write a Business Continuity Plan
How to write a Business Continuity Plan
 
Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!
 
Advanced Test Driven-Development @ php[tek] 2024
Advanced Test Driven-Development @ php[tek] 2024Advanced Test Driven-Development @ php[tek] 2024
Advanced Test Driven-Development @ php[tek] 2024
 
"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii Soldatenko"Debugging python applications inside k8s environment", Andrii Soldatenko
"Debugging python applications inside k8s environment", Andrii Soldatenko
 

Juzu framework

  • 1. Juzu framework Web framework for portlet development Kien Nguyen Portal team May 2012
  • 2. Agenda 1 −Concepts in Juzu framework − Introduction − Main concepts 2 −Develop portlets based Juzu framework − Features − How to develop portlets 3 −Demonstrate building portlets − Setup environment − Build, deploy, Test 4 −Some comparision to others − Webui portlets − Spring, Strut portlet www.exoplatform.com - Copyright 2012 eXo Platform 2
  • 3. Introduction - What is the juzu framework? - MVC model - Request life cycle + View, Action, Resource phases - Juzu Controllers - Juzu Application - Juzu running mode - Type safe parameters www.exoplatform.com - Copyright 2012 eXo Platform 3
  • 4. Introduction www.exoplatform.com - Copyright 2012 eXo Platform 4
  • 5. What is the Juzu? - Juzu is an open source project developed on GitHub project licensed under the LGPL 2.1 license - Source repository: https://github.com/juzu/juzu - Website: http://juzuweb.org/ - Author: Julien Viet www.exoplatform.com - Copyright 2012 eXo Platform 5
  • 6. What is the Juzu? - Juzu is a web framework based on MVC concepts for developing Portlet applications. - Develop powerful web applications - Emphasises on simplicity and type safety www.exoplatform.com - Copyright 2012 eXo Platform 6
  • 7. Concepts in Juzu MVC - Model-View-Controller www.exoplatform.com - Copyright 2012 eXo Platform 7
  • 8. Concepts in Juzu MVC - Model-View-Controller → Spring, Struts,.. and Juzu www.exoplatform.com - Copyright 2012 eXo Platform 8
  • 9. Request lifecycle in Juzu - View phase: Produce markup output aggregated within a page - Action phase: Process an action - Resource phase: produce any kind of output as a full response (i.e not in a page) www.exoplatform.com - Copyright 2012 eXo Platform 9
  • 10. Request lifecycle in Juzu View phase - View phases are mapped on GET requests - Idempotent - View parameters are identified to query parameters www.exoplatform.com - Copyright 2012 eXo Platform 10
  • 11. Request lifecycle in Juzu Action phase - Processing a link - The action phase is mapped on POST requests - Not idempotent - Action parameters are identified to form parameters - Action phase and POST requests should not be invoked more than one time www.exoplatform.com - Copyright 2012 eXo Platform 11
  • 12. Request lifecycle in Juzu Resource phase - GET request - Entire response - Use for Ajax, static resources like image, javascript, etc www.exoplatform.com - Copyright 2012 eXo Platform 12
  • 13. Juzu Controllers Controller is part C of MVC model - They are annotated methods of juzu application - Kinds of controllers are mapped to phases (View, Action, Resource) + @org.juzu.View + @org.juzu.Action + @org.juzu.Resource www.exoplatform.com - Copyright 2012 eXo Platform 13
  • 14. Juzu running mode - prod: production - dev: development www.exoplatform.com - Copyright 2012 eXo Platform 14
  • 15. Juzu Application Juzu app is a portlet application - Package info Store application information - Controllers - Templates - Models www.exoplatform.com - Copyright 2012 eXo Platform 15
  • 16. Type safe parameters Say about expression parameters in templates: - Easily to pass parameters from Controllers to templates - type safe with error checking automatically - By Annotation processor and Eclipse code completion www.exoplatform.com - Copyright 2012 eXo Platform 16
  • 17. Develop portlets based Juzu framework - Simple demo - Overview JuzuPortlet - Define fragments with #insert, #decorator, #include, #title - Template type safe parameters with #param - Actions - Bean mapping - Scope - Ajax - Portlet preferences - I18n - etc www.exoplatform.com - Copyright 2012 eXo Platform 17
  • 18. Develop portlets based Juzu framework Demo simple Juzu portlet www.exoplatform.com - Copyright 2012 eXo Platform 18
  • 19. JuzuPortlet - Is known as front controller of Juzu application - Navigate to Controllers - Navigate to running mode - Navigate to dependency injection container ... www.exoplatform.com - Copyright 2012 eXo Platform 19
  • 20. Define UI fragments - #{insert/} Insert a template into a template <div class="ShindigOAuth"> <div class="ONavigation"> <a href="@{OAuthStore.index()}"><<< Back to List</a> </div> <br /> #{insert/} </div> - #{decorator} Hook a template into a template #{decorate path=main.gtmpl/} www.exoplatform.com - Copyright 2012 eXo Platform 20
  • 21. Define UI fragments - #{include path=.../} Include a template <div id="myTabContent" class="tab-content"> <div class="tab-pane fade active in" id="settings"> #{include path=settings.gtmpl/} </div> <div class="tab-pane fade" id="layout"> #{include path=layout.gtmpl/} </div> <div class="tab-pane fade" id="permission"> #{include path=permission.gtmpl/} </div> </div> - #{title value=...} Set portlet title #{title value='Hello Juzu'/} www.exoplatform.com - Copyright 2012 eXo Platform 21
  • 22. Template type safe parameters - Means errors checking during compile time - Use tag #param in template #{param name=location/} #{param name=temperature/} The weather temperature in ${location} is ${temperature} degrees. - Use paramters in controller @Path("index.gtmpl") @Inject org.exoplatform.example.templates.index index; @View public void index() { index.with().location("Ha Noi").temperature("30").render(); } www.exoplatform.com - Copyright 2012 eXo Platform 22
  • 23. Actions Actions are method annotated by the @Action annotation - In Templates: @{...} - In Controllers: @Action public Response add(String location) { } Example: <form action="@{add()}" method="post"> <input type="text" name="location" value=""/> <input type="submit"/> </form> www.exoplatform.com - Copyright 2012 eXo Platform 23
  • 24. Form and Bean mapping - org.juzu.Param @Param public class Setting { private String path; public String getPath() { return path; } public void setPath(String path) { this.path = path; } } - Submit parameter meet to properties of @Param object <input type="text" name="path" value="" /> www.exoplatform.com - Copyright 2012 eXo Platform 24
  • 25. Scope - Flash @FlashScoped - Request @RequestScoped - Session @SessionScoped www.exoplatform.com - Copyright 2012 eXo Platform 25
  • 26. Portlet preferences - Every portlet will be provided a PortletPreferences object @Inject PortletPreferences preferences; String grade = preferences.getValue("grade", "c"); preferences.setValue("grade", grade); www.exoplatform.com - Copyright 2012 eXo Platform 26
  • 27. Portlet mode and Window state - By default, Juzu injects Portlet mode/Window state as a property in request context object: JuzuPortlet.PORTLET_MODE, JuzuPortlet.WINDOW_STATE Example: @View public void index() { if (Request.getCurrent().getContext().getProperty(JuzuPortlet.PORTLET_MODE) == PortletMode.VIEW) { index.with().location("Ha Noi").temperature("30").render(); } else { edit.render(); } } www.exoplatform.com - Copyright 2012 eXo Platform 27
  • 28. Assets plugin - Javascript - Stylesheet www.exoplatform.com - Copyright 2012 eXo Platform 28
  • 29. Assets plugin @Application(defaultController = org.sample.booking.controllers.Application.class) @Portlet @Assets( scripts = { @Script(id = "jquery", src = "/public/javascripts/jquery-1.7.1.min.js"), @Script(src = "/public/javascripts/jquery-ui-1.7.2.custom.min.js", depends = "jquery"), @Script(src = "/public/javascripts/booking.js", depends = "ajax.app") }, stylesheets = { @Stylesheet(src = "/public/stylesheets/main.css") } ) package org.sample.booking; www.exoplatform.com - Copyright 2012 eXo Platform 29
  • 30. Ajax Plugin / Jquery extension - Resource method @Ajax @Resource public void addGadgetURIToKey(String gadgetURI, String keyName){...} - Jquery javascript api request var root = $(this).jz(); root.find(".uris").jzLoad( "OAuthStore.addGadgetURIToKey()", {gadgetURI : gadgetURI, keyName : keyName}, function() {}); - web.xml <servlet> <servlet-name>AssetServlet</servlet-name> <servlet-class>org.juzu.impl.asset.AssetServlet</servlet-class> <load-on-startup>0</load-on-startup> </servlet> <servlet-mapping> <servlet-name>AssetServlet</servlet-name> <url-pattern>/assets/*</url-pattern> </servlet-mapping> www.exoplatform.com - Copyright 2012 eXo Platform 30
  • 31. Others - I18n - #[foo.bar] - Bean Validation – JSR 303 - Errors - Taglibs - Portlet events - Less compilation - etc www.exoplatform.com - Copyright 2012 eXo Platform 31
  • 32. Demonstrate building portlets - Setup environment - Build - Deploy www.exoplatform.com - Copyright 2012 eXo Platform 32
  • 33. Create Juzu Application - Maven archetype mvn archetype:generate -DarchetypeGroupId=org.juzu -DarchetypeArtifactId=juzu-archetype -DarchetypeVersion=0.4.5-SNAPSHOT -DgroupId=org.juzu -DartifactId=juzu-sample -Dversion=1.0 www.exoplatform.com - Copyright 2012 eXo Platform 33
  • 34. Setup Eclipse environment www.exoplatform.com - Copyright 2012 eXo Platform 34
  • 35. Setup Eclipse environment www.exoplatform.com - Copyright 2012 eXo Platform 35
  • 36. Setup Eclipse environment www.exoplatform.com - Copyright 2012 eXo Platform 36
  • 37. Setup Eclipse environment www.exoplatform.com - Copyright 2012 eXo Platform 37
  • 38. M2E APT for Juzu portlet Install m2e-apt plugin on Eclipse http://download.jboss.org/jbosstools/updates/m2e-extensions/m2e-apt See detail blog here: https://community.jboss.org/en/tools/blog/2012/05/20/annotation-processing-support-in- m2e-or-m2e-apt-100-is-out www.exoplatform.com - Copyright 2012 eXo Platform 38
  • 39. Annotation processor log - target/generated/org/juzu/processor.log www.exoplatform.com - Copyright 2012 eXo Platform 39
  • 40. Demonstration www.exoplatform.com - Copyright 2012 eXo Platform 40
  • 41. [Disscussion] comparision to others - Webui - Spring 3 - Strut 2 - Stripes - Wicket - Tapestry - JSF ... www.exoplatform.com - Copyright 2012 eXo Platform 41
  • 42. Criteria - Speed to build: IDE tools - Clearly extensible/plugable - Documentation - Testability - Built-in features: Ajax, Validation, i18n, etc - Page decorator - Designer support - Portability www.exoplatform.com - Copyright 2012 eXo Platform 42
  • 43. Resources Documentations and Screenshots - https://github.com/juzu/juzu - http://juzuweb.org/ - https://github.com/vietj/gatein-people - https://github.com/kiennguyen/portlet-examples