SlideShare a Scribd company logo
1 of 7
Implementation of GUI Framework
Masahiro Okubo @ HDE
Good evening everyone !
I am Masa.
The session of today, I will speak in English.
In order to develop an administrator screen
of our web application, we have
implemented the GUI framework.
I will describe its implementation.
My puppet. Please call me Masa-san
( Powered by google translate)
Table of Contents
Part1 : Overview of the GUI framework (Today’s session)
Part2 : How to use Bootstrap3
Part3 : Introduction of GUI Components using JavaScript
Part4 : Communitation with the server using Ajax and JSON
Part5 : How to convert a POJO (Plain Old Java Object) JSON
Part6 : Web application architecture on the server side
This is the table of contents.
I’ll do a Part1 today.
GUI Framework Architecture
This is the Graphical User Interface framework architecture.
We have implemented the part of the yellow. Blue is open source
products and Green is operating environment.
But … I think this is very complex ;-)
Modern Web Browsers (Ex. IE9,Firedox,Chome)
jQuery
Custom JavaScript Library (GUI Components)
Bootstrap3
Custom CSS
Application program
Apache Tomcat
JSONIC Apache Click
Service Framework
Data Access Framework
RDB
Client Side Server Side
Why did I make such a framework?
Web application development have to use various technology,
such as HTML, CSS, JavaScript, Ajax, Java, Servlet, and so on.
therefore that is essentially complex. But, Complexity cause a
bug.
We need the method of development. it hide complexity and
supply simple and unified programming interface.
Another, We want to be able to implement the Graphical User
Interface very cool.
Therefore, the goal of this framework is as follows.
1. Simple and unified programming interface.
2. Able to handle the data easily. (JSON <> POJO)
3. Able to make the cool GUI easily.
We have developed our product by using this framework.
The results
Please look at those pictures.
How is it ? Do not you think that it is verl cool ? :-P
Next
Part1 : Overview of the GUI framework (Today’s session)
Part2 : How to use Bootstrap3 (July)
Part3 : Introduction of GUI Components using JavaScript
Part4 : Communitation with the server using Ajax and JSON
Part5 : How to convert a POJO (Plain Old Java Object) JSON
Part6 : Web application architecture on the server side
Thank you for your attention.
Next month, I am going to describe Part2. This is how to make
the GUI very cool using Bootstrap3.
See you again :-)

More Related Content

What's hot

Google Polymer Introduction
Google Polymer IntroductionGoogle Polymer Introduction
Google Polymer IntroductionDavid Price
 
Harness jQuery Templates and Data Link
Harness jQuery Templates and Data LinkHarness jQuery Templates and Data Link
Harness jQuery Templates and Data LinkBorisMoore
 
Introduction to Browser Internals
Introduction to Browser InternalsIntroduction to Browser Internals
Introduction to Browser InternalsSiva Arunachalam
 
Levent-Gurses' Introduction to Web Components & Polymer
Levent-Gurses' Introduction to Web Components & PolymerLevent-Gurses' Introduction to Web Components & Polymer
Levent-Gurses' Introduction to Web Components & PolymerErik Isaksen
 
Nuxt.JS Introdruction
Nuxt.JS IntrodructionNuxt.JS Introdruction
Nuxt.JS IntrodructionDavid Ličen
 
Real World Web components
Real World Web componentsReal World Web components
Real World Web componentsJarrod Overson
 
Polymer and web component
Polymer and web componentPolymer and web component
Polymer and web componentImam Raza
 
Effective TDD - Less is more
Effective TDD - Less is moreEffective TDD - Less is more
Effective TDD - Less is moreBen Lau
 
Introduction to Web Components
Introduction to Web ComponentsIntroduction to Web Components
Introduction to Web ComponentsFu Cheng
 
Javascript ui for rest services
Javascript ui for rest servicesJavascript ui for rest services
Javascript ui for rest servicesIoan Eugen Stan
 
How to build a web application with Polymer
How to build a web application with PolymerHow to build a web application with Polymer
How to build a web application with PolymerSami Suo-Heikki
 
Cloud browser testing with Gradle and Geb
Cloud browser testing with Gradle and GebCloud browser testing with Gradle and Geb
Cloud browser testing with Gradle and GebDavid Carr
 

What's hot (20)

Google Polymer Introduction
Google Polymer IntroductionGoogle Polymer Introduction
Google Polymer Introduction
 
Harness jQuery Templates and Data Link
Harness jQuery Templates and Data LinkHarness jQuery Templates and Data Link
Harness jQuery Templates and Data Link
 
Introduction to Browser Internals
Introduction to Browser InternalsIntroduction to Browser Internals
Introduction to Browser Internals
 
Levent-Gurses' Introduction to Web Components & Polymer
Levent-Gurses' Introduction to Web Components & PolymerLevent-Gurses' Introduction to Web Components & Polymer
Levent-Gurses' Introduction to Web Components & Polymer
 
Nuxt.JS Introdruction
Nuxt.JS IntrodructionNuxt.JS Introdruction
Nuxt.JS Introdruction
 
Real World Web components
Real World Web componentsReal World Web components
Real World Web components
 
Os mobile
Os mobileOs mobile
Os mobile
 
Os mobile
Os mobileOs mobile
Os mobile
 
Polymer and web component
Polymer and web componentPolymer and web component
Polymer and web component
 
Effective TDD - Less is more
Effective TDD - Less is moreEffective TDD - Less is more
Effective TDD - Less is more
 
Introduction to Web Components
Introduction to Web ComponentsIntroduction to Web Components
Introduction to Web Components
 
Zk doc1
Zk doc1Zk doc1
Zk doc1
 
Nuxt Talk
Nuxt TalkNuxt Talk
Nuxt Talk
 
How browser work
How browser workHow browser work
How browser work
 
Javascript ui for rest services
Javascript ui for rest servicesJavascript ui for rest services
Javascript ui for rest services
 
How to build a web application with Polymer
How to build a web application with PolymerHow to build a web application with Polymer
How to build a web application with Polymer
 
Cloud browser testing with Gradle and Geb
Cloud browser testing with Gradle and GebCloud browser testing with Gradle and Geb
Cloud browser testing with Gradle and Geb
 
Jasmine 2.0
Jasmine 2.0Jasmine 2.0
Jasmine 2.0
 
DevPira2019 - Blazor
DevPira2019 - BlazorDevPira2019 - Blazor
DevPira2019 - Blazor
 
Coldfusion with Keith Diehl
Coldfusion with Keith DiehlColdfusion with Keith Diehl
Coldfusion with Keith Diehl
 

Viewers also liked

First impressions of Go
First impressions of GoFirst impressions of Go
First impressions of GoYusaku OGAWA
 
Studying Abroad in Cebu
Studying Abroad in CebuStudying Abroad in Cebu
Studying Abroad in Cebuetgjsv
 
Jun.27 fukutomi
Jun.27 fukutomiJun.27 fukutomi
Jun.27 fukutomiiyo16
 
Ui testing with splinter - Fri, 30 May 2014
Ui testing with splinter - Fri, 30 May 2014Ui testing with splinter - Fri, 30 May 2014
Ui testing with splinter - Fri, 30 May 2014Taizo Ito
 
A brief introduction to CentOS 7
A brief introduction to CentOS 7A brief introduction to CentOS 7
A brief introduction to CentOS 7Taizo Ito
 
Hello pivotal tracker
Hello pivotal trackerHello pivotal tracker
Hello pivotal trackersharu1204
 
Introducing chrome apps (ogura)
Introducing chrome apps (ogura)Introducing chrome apps (ogura)
Introducing chrome apps (ogura)Kazuhiro Ogura
 
Do not rm_log_files
Do not rm_log_filesDo not rm_log_files
Do not rm_log_filesMasato Bito
 
Introduction to bioinformatics
Introduction to bioinformaticsIntroduction to bioinformatics
Introduction to bioinformaticsphilmaweb
 
Implement server push in flask framework
Implement server push in flask frameworkImplement server push in flask framework
Implement server push in flask frameworkChi-Chia Huang
 
Introduction to systemd
Introduction to systemdIntroduction to systemd
Introduction to systemdYusaku OGAWA
 
Garbled text in email
Garbled text in emailGarbled text in email
Garbled text in emailtas-hiro
 
Self Created Load Balancer for MTA on AWS
Self Created Load Balancer for MTA on AWSSelf Created Load Balancer for MTA on AWS
Self Created Load Balancer for MTA on AWSsharu1204
 

Viewers also liked (20)

AWS Cost Visualizer
AWS Cost VisualizerAWS Cost Visualizer
AWS Cost Visualizer
 
First impressions of Go
First impressions of GoFirst impressions of Go
First impressions of Go
 
Studying Abroad in Cebu
Studying Abroad in CebuStudying Abroad in Cebu
Studying Abroad in Cebu
 
DockerCon 14
DockerCon 14DockerCon 14
DockerCon 14
 
Jun.27 fukutomi
Jun.27 fukutomiJun.27 fukutomi
Jun.27 fukutomi
 
Ui testing with splinter - Fri, 30 May 2014
Ui testing with splinter - Fri, 30 May 2014Ui testing with splinter - Fri, 30 May 2014
Ui testing with splinter - Fri, 30 May 2014
 
A brief introduction to CentOS 7
A brief introduction to CentOS 7A brief introduction to CentOS 7
A brief introduction to CentOS 7
 
How to study english
How to study englishHow to study english
How to study english
 
Overview pcidss
Overview pcidssOverview pcidss
Overview pcidss
 
Hello pivotal tracker
Hello pivotal trackerHello pivotal tracker
Hello pivotal tracker
 
Introducing chrome apps (ogura)
Introducing chrome apps (ogura)Introducing chrome apps (ogura)
Introducing chrome apps (ogura)
 
Do not rm_log_files
Do not rm_log_filesDo not rm_log_files
Do not rm_log_files
 
Introduction to bioinformatics
Introduction to bioinformaticsIntroduction to bioinformatics
Introduction to bioinformatics
 
Implement server push in flask framework
Implement server push in flask frameworkImplement server push in flask framework
Implement server push in flask framework
 
Introduction to systemd
Introduction to systemdIntroduction to systemd
Introduction to systemd
 
Garbled text in email
Garbled text in emailGarbled text in email
Garbled text in email
 
Authentication
AuthenticationAuthentication
Authentication
 
I18n of java script
I18n of java scriptI18n of java script
I18n of java script
 
The language barrier.
The language barrier.The language barrier.
The language barrier.
 
Self Created Load Balancer for MTA on AWS
Self Created Load Balancer for MTA on AWSSelf Created Load Balancer for MTA on AWS
Self Created Load Balancer for MTA on AWS
 

Similar to Implementation of gui framework part1

Single page applications
Single page applicationsSingle page applications
Single page applicationsDiego Cardozo
 
Catching-up web technologies - an endless story
Catching-up web technologies - an endless storyCatching-up web technologies - an endless story
Catching-up web technologies - an endless storyCleber Jorge Amaral
 
BlackBerry 10 Browser
BlackBerry 10 BrowserBlackBerry 10 Browser
BlackBerry 10 BrowserErik Johnson
 
Agile Software Development by Sencha
Agile Software Development by SenchaAgile Software Development by Sencha
Agile Software Development by SenchaLael Rukius
 
Angular JS 2_0 BCS CTO_in_Res V3
Angular JS 2_0 BCS CTO_in_Res V3Angular JS 2_0 BCS CTO_in_Res V3
Angular JS 2_0 BCS CTO_in_Res V3Bruce Pentreath
 
INTRODUCTION.docx
INTRODUCTION.docxINTRODUCTION.docx
INTRODUCTION.docxKaiSane1
 
Developing For The Web
Developing For The WebDeveloping For The Web
Developing For The Webaleemb
 
Flutter vs Java Graphical User Interface Frameworks - text
Flutter vs Java Graphical User Interface Frameworks - textFlutter vs Java Graphical User Interface Frameworks - text
Flutter vs Java Graphical User Interface Frameworks - textToma Velev
 
Svelte the future of frontend development
Svelte   the future of frontend developmentSvelte   the future of frontend development
Svelte the future of frontend developmenttwilson63
 
Techniques For A Modern Web UI (With Notes)
Techniques For A Modern Web UI (With Notes)Techniques For A Modern Web UI (With Notes)
Techniques For A Modern Web UI (With Notes)patrick.t.joyce
 
Micronaut: A new way to build microservices
Micronaut: A new way to build microservicesMicronaut: A new way to build microservices
Micronaut: A new way to build microservicesLuram Archanjo
 
[D2 campus seminar]웹브라우저 엔진
[D2 campus seminar]웹브라우저 엔진[D2 campus seminar]웹브라우저 엔진
[D2 campus seminar]웹브라우저 엔진NAVER D2
 
S02 hybrid app_and_gae_restful_architecture_v2.0
S02 hybrid app_and_gae_restful_architecture_v2.0S02 hybrid app_and_gae_restful_architecture_v2.0
S02 hybrid app_and_gae_restful_architecture_v2.0Sun-Jin Jang
 
React for non techies
React for non techiesReact for non techies
React for non techiesAmy Crimmens
 
LAMP is so yesterday, MEAN is so tomorrow! :)
LAMP is so yesterday, MEAN is so tomorrow! :) LAMP is so yesterday, MEAN is so tomorrow! :)
LAMP is so yesterday, MEAN is so tomorrow! :) Sascha Sambale
 
Designing Powerful Web Applications - Monterey
Designing Powerful Web Applications - MontereyDesigning Powerful Web Applications - Monterey
Designing Powerful Web Applications - MontereyDave Malouf
 
F3-DP-2015-Milata-Tomas-java-ee-batch-editor (1)
F3-DP-2015-Milata-Tomas-java-ee-batch-editor (1)F3-DP-2015-Milata-Tomas-java-ee-batch-editor (1)
F3-DP-2015-Milata-Tomas-java-ee-batch-editor (1)Tomáš Milata
 

Similar to Implementation of gui framework part1 (20)

Single page applications
Single page applicationsSingle page applications
Single page applications
 
Catching-up web technologies - an endless story
Catching-up web technologies - an endless storyCatching-up web technologies - an endless story
Catching-up web technologies - an endless story
 
BlackBerry 10 Browser
BlackBerry 10 BrowserBlackBerry 10 Browser
BlackBerry 10 Browser
 
Fewd week4 slides
Fewd week4 slidesFewd week4 slides
Fewd week4 slides
 
Agile Software Development by Sencha
Agile Software Development by SenchaAgile Software Development by Sencha
Agile Software Development by Sencha
 
Swing is not dead
Swing is not deadSwing is not dead
Swing is not dead
 
Angular JS 2_0 BCS CTO_in_Res V3
Angular JS 2_0 BCS CTO_in_Res V3Angular JS 2_0 BCS CTO_in_Res V3
Angular JS 2_0 BCS CTO_in_Res V3
 
GWT Architectures and Lessons Learned (WJAX 2013)
GWT Architectures and Lessons Learned (WJAX 2013)GWT Architectures and Lessons Learned (WJAX 2013)
GWT Architectures and Lessons Learned (WJAX 2013)
 
INTRODUCTION.docx
INTRODUCTION.docxINTRODUCTION.docx
INTRODUCTION.docx
 
Developing For The Web
Developing For The WebDeveloping For The Web
Developing For The Web
 
Flutter vs Java Graphical User Interface Frameworks - text
Flutter vs Java Graphical User Interface Frameworks - textFlutter vs Java Graphical User Interface Frameworks - text
Flutter vs Java Graphical User Interface Frameworks - text
 
Svelte the future of frontend development
Svelte   the future of frontend developmentSvelte   the future of frontend development
Svelte the future of frontend development
 
Techniques For A Modern Web UI (With Notes)
Techniques For A Modern Web UI (With Notes)Techniques For A Modern Web UI (With Notes)
Techniques For A Modern Web UI (With Notes)
 
Micronaut: A new way to build microservices
Micronaut: A new way to build microservicesMicronaut: A new way to build microservices
Micronaut: A new way to build microservices
 
[D2 campus seminar]웹브라우저 엔진
[D2 campus seminar]웹브라우저 엔진[D2 campus seminar]웹브라우저 엔진
[D2 campus seminar]웹브라우저 엔진
 
S02 hybrid app_and_gae_restful_architecture_v2.0
S02 hybrid app_and_gae_restful_architecture_v2.0S02 hybrid app_and_gae_restful_architecture_v2.0
S02 hybrid app_and_gae_restful_architecture_v2.0
 
React for non techies
React for non techiesReact for non techies
React for non techies
 
LAMP is so yesterday, MEAN is so tomorrow! :)
LAMP is so yesterday, MEAN is so tomorrow! :) LAMP is so yesterday, MEAN is so tomorrow! :)
LAMP is so yesterday, MEAN is so tomorrow! :)
 
Designing Powerful Web Applications - Monterey
Designing Powerful Web Applications - MontereyDesigning Powerful Web Applications - Monterey
Designing Powerful Web Applications - Monterey
 
F3-DP-2015-Milata-Tomas-java-ee-batch-editor (1)
F3-DP-2015-Milata-Tomas-java-ee-batch-editor (1)F3-DP-2015-Milata-Tomas-java-ee-batch-editor (1)
F3-DP-2015-Milata-Tomas-java-ee-batch-editor (1)
 

Recently uploaded

APPLICATIONS-AC/DC DRIVES-OPERATING CHARACTERISTICS
APPLICATIONS-AC/DC DRIVES-OPERATING CHARACTERISTICSAPPLICATIONS-AC/DC DRIVES-OPERATING CHARACTERISTICS
APPLICATIONS-AC/DC DRIVES-OPERATING CHARACTERISTICSKurinjimalarL3
 
main PPT.pptx of girls hostel security using rfid
main PPT.pptx of girls hostel security using rfidmain PPT.pptx of girls hostel security using rfid
main PPT.pptx of girls hostel security using rfidNikhilNagaraju
 
High Profile Call Girls Nagpur Meera Call 7001035870 Meet With Nagpur Escorts
High Profile Call Girls Nagpur Meera Call 7001035870 Meet With Nagpur EscortsHigh Profile Call Girls Nagpur Meera Call 7001035870 Meet With Nagpur Escorts
High Profile Call Girls Nagpur Meera Call 7001035870 Meet With Nagpur EscortsCall Girls in Nagpur High Profile
 
Microscopic Analysis of Ceramic Materials.pptx
Microscopic Analysis of Ceramic Materials.pptxMicroscopic Analysis of Ceramic Materials.pptx
Microscopic Analysis of Ceramic Materials.pptxpurnimasatapathy1234
 
VIP Call Girls Service Kondapur Hyderabad Call +91-8250192130
VIP Call Girls Service Kondapur Hyderabad Call +91-8250192130VIP Call Girls Service Kondapur Hyderabad Call +91-8250192130
VIP Call Girls Service Kondapur Hyderabad Call +91-8250192130Suhani Kapoor
 
Gfe Mayur Vihar Call Girls Service WhatsApp -> 9999965857 Available 24x7 ^ De...
Gfe Mayur Vihar Call Girls Service WhatsApp -> 9999965857 Available 24x7 ^ De...Gfe Mayur Vihar Call Girls Service WhatsApp -> 9999965857 Available 24x7 ^ De...
Gfe Mayur Vihar Call Girls Service WhatsApp -> 9999965857 Available 24x7 ^ De...srsj9000
 
(SHREYA) Chakan Call Girls Just Call 7001035870 [ Cash on Delivery ] Pune Esc...
(SHREYA) Chakan Call Girls Just Call 7001035870 [ Cash on Delivery ] Pune Esc...(SHREYA) Chakan Call Girls Just Call 7001035870 [ Cash on Delivery ] Pune Esc...
(SHREYA) Chakan Call Girls Just Call 7001035870 [ Cash on Delivery ] Pune Esc...ranjana rawat
 
Architect Hassan Khalil Portfolio for 2024
Architect Hassan Khalil Portfolio for 2024Architect Hassan Khalil Portfolio for 2024
Architect Hassan Khalil Portfolio for 2024hassan khalil
 
Decoding Kotlin - Your guide to solving the mysterious in Kotlin.pptx
Decoding Kotlin - Your guide to solving the mysterious in Kotlin.pptxDecoding Kotlin - Your guide to solving the mysterious in Kotlin.pptx
Decoding Kotlin - Your guide to solving the mysterious in Kotlin.pptxJoão Esperancinha
 
Processing & Properties of Floor and Wall Tiles.pptx
Processing & Properties of Floor and Wall Tiles.pptxProcessing & Properties of Floor and Wall Tiles.pptx
Processing & Properties of Floor and Wall Tiles.pptxpranjaldaimarysona
 
Call Girls in Nagpur Suman Call 7001035870 Meet With Nagpur Escorts
Call Girls in Nagpur Suman Call 7001035870 Meet With Nagpur EscortsCall Girls in Nagpur Suman Call 7001035870 Meet With Nagpur Escorts
Call Girls in Nagpur Suman Call 7001035870 Meet With Nagpur EscortsCall Girls in Nagpur High Profile
 
(MEERA) Dapodi Call Girls Just Call 7001035870 [ Cash on Delivery ] Pune Escorts
(MEERA) Dapodi Call Girls Just Call 7001035870 [ Cash on Delivery ] Pune Escorts(MEERA) Dapodi Call Girls Just Call 7001035870 [ Cash on Delivery ] Pune Escorts
(MEERA) Dapodi Call Girls Just Call 7001035870 [ Cash on Delivery ] Pune Escortsranjana rawat
 
High Profile Call Girls Nagpur Isha Call 7001035870 Meet With Nagpur Escorts
High Profile Call Girls Nagpur Isha Call 7001035870 Meet With Nagpur EscortsHigh Profile Call Girls Nagpur Isha Call 7001035870 Meet With Nagpur Escorts
High Profile Call Girls Nagpur Isha Call 7001035870 Meet With Nagpur Escortsranjana rawat
 
College Call Girls Nashik Nehal 7001305949 Independent Escort Service Nashik
College Call Girls Nashik Nehal 7001305949 Independent Escort Service NashikCollege Call Girls Nashik Nehal 7001305949 Independent Escort Service Nashik
College Call Girls Nashik Nehal 7001305949 Independent Escort Service NashikCall Girls in Nagpur High Profile
 
The Most Attractive Pune Call Girls Budhwar Peth 8250192130 Will You Miss Thi...
The Most Attractive Pune Call Girls Budhwar Peth 8250192130 Will You Miss Thi...The Most Attractive Pune Call Girls Budhwar Peth 8250192130 Will You Miss Thi...
The Most Attractive Pune Call Girls Budhwar Peth 8250192130 Will You Miss Thi...ranjana rawat
 
(RIA) Call Girls Bhosari ( 7001035870 ) HI-Fi Pune Escorts Service
(RIA) Call Girls Bhosari ( 7001035870 ) HI-Fi Pune Escorts Service(RIA) Call Girls Bhosari ( 7001035870 ) HI-Fi Pune Escorts Service
(RIA) Call Girls Bhosari ( 7001035870 ) HI-Fi Pune Escorts Serviceranjana rawat
 
Call Girls Service Nagpur Tanvi Call 7001035870 Meet With Nagpur Escorts
Call Girls Service Nagpur Tanvi Call 7001035870 Meet With Nagpur EscortsCall Girls Service Nagpur Tanvi Call 7001035870 Meet With Nagpur Escorts
Call Girls Service Nagpur Tanvi Call 7001035870 Meet With Nagpur EscortsCall Girls in Nagpur High Profile
 
Structural Analysis and Design of Foundations: A Comprehensive Handbook for S...
Structural Analysis and Design of Foundations: A Comprehensive Handbook for S...Structural Analysis and Design of Foundations: A Comprehensive Handbook for S...
Structural Analysis and Design of Foundations: A Comprehensive Handbook for S...Dr.Costas Sachpazis
 
GDSC ASEB Gen AI study jams presentation
GDSC ASEB Gen AI study jams presentationGDSC ASEB Gen AI study jams presentation
GDSC ASEB Gen AI study jams presentationGDSCAESB
 
Porous Ceramics seminar and technical writing
Porous Ceramics seminar and technical writingPorous Ceramics seminar and technical writing
Porous Ceramics seminar and technical writingrakeshbaidya232001
 

Recently uploaded (20)

APPLICATIONS-AC/DC DRIVES-OPERATING CHARACTERISTICS
APPLICATIONS-AC/DC DRIVES-OPERATING CHARACTERISTICSAPPLICATIONS-AC/DC DRIVES-OPERATING CHARACTERISTICS
APPLICATIONS-AC/DC DRIVES-OPERATING CHARACTERISTICS
 
main PPT.pptx of girls hostel security using rfid
main PPT.pptx of girls hostel security using rfidmain PPT.pptx of girls hostel security using rfid
main PPT.pptx of girls hostel security using rfid
 
High Profile Call Girls Nagpur Meera Call 7001035870 Meet With Nagpur Escorts
High Profile Call Girls Nagpur Meera Call 7001035870 Meet With Nagpur EscortsHigh Profile Call Girls Nagpur Meera Call 7001035870 Meet With Nagpur Escorts
High Profile Call Girls Nagpur Meera Call 7001035870 Meet With Nagpur Escorts
 
Microscopic Analysis of Ceramic Materials.pptx
Microscopic Analysis of Ceramic Materials.pptxMicroscopic Analysis of Ceramic Materials.pptx
Microscopic Analysis of Ceramic Materials.pptx
 
VIP Call Girls Service Kondapur Hyderabad Call +91-8250192130
VIP Call Girls Service Kondapur Hyderabad Call +91-8250192130VIP Call Girls Service Kondapur Hyderabad Call +91-8250192130
VIP Call Girls Service Kondapur Hyderabad Call +91-8250192130
 
Gfe Mayur Vihar Call Girls Service WhatsApp -> 9999965857 Available 24x7 ^ De...
Gfe Mayur Vihar Call Girls Service WhatsApp -> 9999965857 Available 24x7 ^ De...Gfe Mayur Vihar Call Girls Service WhatsApp -> 9999965857 Available 24x7 ^ De...
Gfe Mayur Vihar Call Girls Service WhatsApp -> 9999965857 Available 24x7 ^ De...
 
(SHREYA) Chakan Call Girls Just Call 7001035870 [ Cash on Delivery ] Pune Esc...
(SHREYA) Chakan Call Girls Just Call 7001035870 [ Cash on Delivery ] Pune Esc...(SHREYA) Chakan Call Girls Just Call 7001035870 [ Cash on Delivery ] Pune Esc...
(SHREYA) Chakan Call Girls Just Call 7001035870 [ Cash on Delivery ] Pune Esc...
 
Architect Hassan Khalil Portfolio for 2024
Architect Hassan Khalil Portfolio for 2024Architect Hassan Khalil Portfolio for 2024
Architect Hassan Khalil Portfolio for 2024
 
Decoding Kotlin - Your guide to solving the mysterious in Kotlin.pptx
Decoding Kotlin - Your guide to solving the mysterious in Kotlin.pptxDecoding Kotlin - Your guide to solving the mysterious in Kotlin.pptx
Decoding Kotlin - Your guide to solving the mysterious in Kotlin.pptx
 
Processing & Properties of Floor and Wall Tiles.pptx
Processing & Properties of Floor and Wall Tiles.pptxProcessing & Properties of Floor and Wall Tiles.pptx
Processing & Properties of Floor and Wall Tiles.pptx
 
Call Girls in Nagpur Suman Call 7001035870 Meet With Nagpur Escorts
Call Girls in Nagpur Suman Call 7001035870 Meet With Nagpur EscortsCall Girls in Nagpur Suman Call 7001035870 Meet With Nagpur Escorts
Call Girls in Nagpur Suman Call 7001035870 Meet With Nagpur Escorts
 
(MEERA) Dapodi Call Girls Just Call 7001035870 [ Cash on Delivery ] Pune Escorts
(MEERA) Dapodi Call Girls Just Call 7001035870 [ Cash on Delivery ] Pune Escorts(MEERA) Dapodi Call Girls Just Call 7001035870 [ Cash on Delivery ] Pune Escorts
(MEERA) Dapodi Call Girls Just Call 7001035870 [ Cash on Delivery ] Pune Escorts
 
High Profile Call Girls Nagpur Isha Call 7001035870 Meet With Nagpur Escorts
High Profile Call Girls Nagpur Isha Call 7001035870 Meet With Nagpur EscortsHigh Profile Call Girls Nagpur Isha Call 7001035870 Meet With Nagpur Escorts
High Profile Call Girls Nagpur Isha Call 7001035870 Meet With Nagpur Escorts
 
College Call Girls Nashik Nehal 7001305949 Independent Escort Service Nashik
College Call Girls Nashik Nehal 7001305949 Independent Escort Service NashikCollege Call Girls Nashik Nehal 7001305949 Independent Escort Service Nashik
College Call Girls Nashik Nehal 7001305949 Independent Escort Service Nashik
 
The Most Attractive Pune Call Girls Budhwar Peth 8250192130 Will You Miss Thi...
The Most Attractive Pune Call Girls Budhwar Peth 8250192130 Will You Miss Thi...The Most Attractive Pune Call Girls Budhwar Peth 8250192130 Will You Miss Thi...
The Most Attractive Pune Call Girls Budhwar Peth 8250192130 Will You Miss Thi...
 
(RIA) Call Girls Bhosari ( 7001035870 ) HI-Fi Pune Escorts Service
(RIA) Call Girls Bhosari ( 7001035870 ) HI-Fi Pune Escorts Service(RIA) Call Girls Bhosari ( 7001035870 ) HI-Fi Pune Escorts Service
(RIA) Call Girls Bhosari ( 7001035870 ) HI-Fi Pune Escorts Service
 
Call Girls Service Nagpur Tanvi Call 7001035870 Meet With Nagpur Escorts
Call Girls Service Nagpur Tanvi Call 7001035870 Meet With Nagpur EscortsCall Girls Service Nagpur Tanvi Call 7001035870 Meet With Nagpur Escorts
Call Girls Service Nagpur Tanvi Call 7001035870 Meet With Nagpur Escorts
 
Structural Analysis and Design of Foundations: A Comprehensive Handbook for S...
Structural Analysis and Design of Foundations: A Comprehensive Handbook for S...Structural Analysis and Design of Foundations: A Comprehensive Handbook for S...
Structural Analysis and Design of Foundations: A Comprehensive Handbook for S...
 
GDSC ASEB Gen AI study jams presentation
GDSC ASEB Gen AI study jams presentationGDSC ASEB Gen AI study jams presentation
GDSC ASEB Gen AI study jams presentation
 
Porous Ceramics seminar and technical writing
Porous Ceramics seminar and technical writingPorous Ceramics seminar and technical writing
Porous Ceramics seminar and technical writing
 

Implementation of gui framework part1

  • 1. Implementation of GUI Framework Masahiro Okubo @ HDE
  • 2. Good evening everyone ! I am Masa. The session of today, I will speak in English. In order to develop an administrator screen of our web application, we have implemented the GUI framework. I will describe its implementation. My puppet. Please call me Masa-san ( Powered by google translate)
  • 3. Table of Contents Part1 : Overview of the GUI framework (Today’s session) Part2 : How to use Bootstrap3 Part3 : Introduction of GUI Components using JavaScript Part4 : Communitation with the server using Ajax and JSON Part5 : How to convert a POJO (Plain Old Java Object) JSON Part6 : Web application architecture on the server side This is the table of contents. I’ll do a Part1 today.
  • 4. GUI Framework Architecture This is the Graphical User Interface framework architecture. We have implemented the part of the yellow. Blue is open source products and Green is operating environment. But … I think this is very complex ;-) Modern Web Browsers (Ex. IE9,Firedox,Chome) jQuery Custom JavaScript Library (GUI Components) Bootstrap3 Custom CSS Application program Apache Tomcat JSONIC Apache Click Service Framework Data Access Framework RDB Client Side Server Side
  • 5. Why did I make such a framework? Web application development have to use various technology, such as HTML, CSS, JavaScript, Ajax, Java, Servlet, and so on. therefore that is essentially complex. But, Complexity cause a bug. We need the method of development. it hide complexity and supply simple and unified programming interface. Another, We want to be able to implement the Graphical User Interface very cool. Therefore, the goal of this framework is as follows. 1. Simple and unified programming interface. 2. Able to handle the data easily. (JSON <> POJO) 3. Able to make the cool GUI easily. We have developed our product by using this framework.
  • 6. The results Please look at those pictures. How is it ? Do not you think that it is verl cool ? :-P
  • 7. Next Part1 : Overview of the GUI framework (Today’s session) Part2 : How to use Bootstrap3 (July) Part3 : Introduction of GUI Components using JavaScript Part4 : Communitation with the server using Ajax and JSON Part5 : How to convert a POJO (Plain Old Java Object) JSON Part6 : Web application architecture on the server side Thank you for your attention. Next month, I am going to describe Part2. This is how to make the GUI very cool using Bootstrap3. See you again :-)