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

PVC VS. FIBERGLASS (FRP) GRAVITY SEWER - UNI BELL
PVC VS. FIBERGLASS (FRP) GRAVITY SEWER - UNI BELLPVC VS. FIBERGLASS (FRP) GRAVITY SEWER - UNI BELL
PVC VS. FIBERGLASS (FRP) GRAVITY SEWER - UNI BELLManishPatel169454
 
Call for Papers - African Journal of Biological Sciences, E-ISSN: 2663-2187, ...
Call for Papers - African Journal of Biological Sciences, E-ISSN: 2663-2187, ...Call for Papers - African Journal of Biological Sciences, E-ISSN: 2663-2187, ...
Call for Papers - African Journal of Biological Sciences, E-ISSN: 2663-2187, ...Christo Ananth
 
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
 
CCS335 _ Neural Networks and Deep Learning Laboratory_Lab Complete Record
CCS335 _ Neural Networks and Deep Learning Laboratory_Lab Complete RecordCCS335 _ Neural Networks and Deep Learning Laboratory_Lab Complete Record
CCS335 _ Neural Networks and Deep Learning Laboratory_Lab Complete RecordAsst.prof M.Gokilavani
 
Extrusion Processes and Their Limitations
Extrusion Processes and Their LimitationsExtrusion Processes and Their Limitations
Extrusion Processes and Their Limitations120cr0395
 
Call Girls Walvekar Nagar Call Me 7737669865 Budget Friendly No Advance Booking
Call Girls Walvekar Nagar Call Me 7737669865 Budget Friendly No Advance BookingCall Girls Walvekar Nagar Call Me 7737669865 Budget Friendly No Advance Booking
Call Girls Walvekar Nagar Call Me 7737669865 Budget Friendly No Advance Bookingroncy bisnoi
 
data_management_and _data_science_cheat_sheet.pdf
data_management_and _data_science_cheat_sheet.pdfdata_management_and _data_science_cheat_sheet.pdf
data_management_and _data_science_cheat_sheet.pdfJiananWang21
 
UNIT-III FMM. DIMENSIONAL ANALYSIS
UNIT-III FMM.        DIMENSIONAL ANALYSISUNIT-III FMM.        DIMENSIONAL ANALYSIS
UNIT-III FMM. DIMENSIONAL ANALYSISrknatarajan
 
Booking open Available Pune Call Girls Pargaon 6297143586 Call Hot Indian Gi...
Booking open Available Pune Call Girls Pargaon  6297143586 Call Hot Indian Gi...Booking open Available Pune Call Girls Pargaon  6297143586 Call Hot Indian Gi...
Booking open Available Pune Call Girls Pargaon 6297143586 Call Hot Indian Gi...Call Girls in Nagpur High Profile
 
Online banking management system project.pdf
Online banking management system project.pdfOnline banking management system project.pdf
Online banking management system project.pdfKamal Acharya
 
VIP Model Call Girls Kothrud ( Pune ) Call ON 8005736733 Starting From 5K to ...
VIP Model Call Girls Kothrud ( Pune ) Call ON 8005736733 Starting From 5K to ...VIP Model Call Girls Kothrud ( Pune ) Call ON 8005736733 Starting From 5K to ...
VIP Model Call Girls Kothrud ( Pune ) Call ON 8005736733 Starting From 5K to ...SUHANI PANDEY
 
Call for Papers - International Journal of Intelligent Systems and Applicatio...
Call for Papers - International Journal of Intelligent Systems and Applicatio...Call for Papers - International Journal of Intelligent Systems and Applicatio...
Call for Papers - International Journal of Intelligent Systems and Applicatio...Christo Ananth
 
Call for Papers - Educational Administration: Theory and Practice, E-ISSN: 21...
Call for Papers - Educational Administration: Theory and Practice, E-ISSN: 21...Call for Papers - Educational Administration: Theory and Practice, E-ISSN: 21...
Call for Papers - Educational Administration: Theory and Practice, E-ISSN: 21...Christo Ananth
 
Call Girls Pimpri Chinchwad Call Me 7737669865 Budget Friendly No Advance Boo...
Call Girls Pimpri Chinchwad Call Me 7737669865 Budget Friendly No Advance Boo...Call Girls Pimpri Chinchwad Call Me 7737669865 Budget Friendly No Advance Boo...
Call Girls Pimpri Chinchwad Call Me 7737669865 Budget Friendly No Advance Boo...roncy bisnoi
 
KubeKraft presentation @CloudNativeHooghly
KubeKraft presentation @CloudNativeHooghlyKubeKraft presentation @CloudNativeHooghly
KubeKraft presentation @CloudNativeHooghlysanyuktamishra911
 
Generative AI or GenAI technology based PPT
Generative AI or GenAI technology based PPTGenerative AI or GenAI technology based PPT
Generative AI or GenAI technology based PPTbhaskargani46
 
Coefficient of Thermal Expansion and their Importance.pptx
Coefficient of Thermal Expansion and their Importance.pptxCoefficient of Thermal Expansion and their Importance.pptx
Coefficient of Thermal Expansion and their Importance.pptxAsutosh Ranjan
 

Recently uploaded (20)

PVC VS. FIBERGLASS (FRP) GRAVITY SEWER - UNI BELL
PVC VS. FIBERGLASS (FRP) GRAVITY SEWER - UNI BELLPVC VS. FIBERGLASS (FRP) GRAVITY SEWER - UNI BELL
PVC VS. FIBERGLASS (FRP) GRAVITY SEWER - UNI BELL
 
Call for Papers - African Journal of Biological Sciences, E-ISSN: 2663-2187, ...
Call for Papers - African Journal of Biological Sciences, E-ISSN: 2663-2187, ...Call for Papers - African Journal of Biological Sciences, E-ISSN: 2663-2187, ...
Call for Papers - African Journal of Biological Sciences, E-ISSN: 2663-2187, ...
 
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...
 
CCS335 _ Neural Networks and Deep Learning Laboratory_Lab Complete Record
CCS335 _ Neural Networks and Deep Learning Laboratory_Lab Complete RecordCCS335 _ Neural Networks and Deep Learning Laboratory_Lab Complete Record
CCS335 _ Neural Networks and Deep Learning Laboratory_Lab Complete Record
 
Extrusion Processes and Their Limitations
Extrusion Processes and Their LimitationsExtrusion Processes and Their Limitations
Extrusion Processes and Their Limitations
 
Call Now ≽ 9953056974 ≼🔝 Call Girls In New Ashok Nagar ≼🔝 Delhi door step de...
Call Now ≽ 9953056974 ≼🔝 Call Girls In New Ashok Nagar  ≼🔝 Delhi door step de...Call Now ≽ 9953056974 ≼🔝 Call Girls In New Ashok Nagar  ≼🔝 Delhi door step de...
Call Now ≽ 9953056974 ≼🔝 Call Girls In New Ashok Nagar ≼🔝 Delhi door step de...
 
NFPA 5000 2024 standard .
NFPA 5000 2024 standard                                  .NFPA 5000 2024 standard                                  .
NFPA 5000 2024 standard .
 
Call Girls Walvekar Nagar Call Me 7737669865 Budget Friendly No Advance Booking
Call Girls Walvekar Nagar Call Me 7737669865 Budget Friendly No Advance BookingCall Girls Walvekar Nagar Call Me 7737669865 Budget Friendly No Advance Booking
Call Girls Walvekar Nagar Call Me 7737669865 Budget Friendly No Advance Booking
 
data_management_and _data_science_cheat_sheet.pdf
data_management_and _data_science_cheat_sheet.pdfdata_management_and _data_science_cheat_sheet.pdf
data_management_and _data_science_cheat_sheet.pdf
 
UNIT-III FMM. DIMENSIONAL ANALYSIS
UNIT-III FMM.        DIMENSIONAL ANALYSISUNIT-III FMM.        DIMENSIONAL ANALYSIS
UNIT-III FMM. DIMENSIONAL ANALYSIS
 
Booking open Available Pune Call Girls Pargaon 6297143586 Call Hot Indian Gi...
Booking open Available Pune Call Girls Pargaon  6297143586 Call Hot Indian Gi...Booking open Available Pune Call Girls Pargaon  6297143586 Call Hot Indian Gi...
Booking open Available Pune Call Girls Pargaon 6297143586 Call Hot Indian Gi...
 
Online banking management system project.pdf
Online banking management system project.pdfOnline banking management system project.pdf
Online banking management system project.pdf
 
VIP Model Call Girls Kothrud ( Pune ) Call ON 8005736733 Starting From 5K to ...
VIP Model Call Girls Kothrud ( Pune ) Call ON 8005736733 Starting From 5K to ...VIP Model Call Girls Kothrud ( Pune ) Call ON 8005736733 Starting From 5K to ...
VIP Model Call Girls Kothrud ( Pune ) Call ON 8005736733 Starting From 5K to ...
 
Call for Papers - International Journal of Intelligent Systems and Applicatio...
Call for Papers - International Journal of Intelligent Systems and Applicatio...Call for Papers - International Journal of Intelligent Systems and Applicatio...
Call for Papers - International Journal of Intelligent Systems and Applicatio...
 
Call for Papers - Educational Administration: Theory and Practice, E-ISSN: 21...
Call for Papers - Educational Administration: Theory and Practice, E-ISSN: 21...Call for Papers - Educational Administration: Theory and Practice, E-ISSN: 21...
Call for Papers - Educational Administration: Theory and Practice, E-ISSN: 21...
 
Call Girls Pimpri Chinchwad Call Me 7737669865 Budget Friendly No Advance Boo...
Call Girls Pimpri Chinchwad Call Me 7737669865 Budget Friendly No Advance Boo...Call Girls Pimpri Chinchwad Call Me 7737669865 Budget Friendly No Advance Boo...
Call Girls Pimpri Chinchwad Call Me 7737669865 Budget Friendly No Advance Boo...
 
Call Girls in Ramesh Nagar Delhi 💯 Call Us 🔝9953056974 🔝 Escort Service
Call Girls in Ramesh Nagar Delhi 💯 Call Us 🔝9953056974 🔝 Escort ServiceCall Girls in Ramesh Nagar Delhi 💯 Call Us 🔝9953056974 🔝 Escort Service
Call Girls in Ramesh Nagar Delhi 💯 Call Us 🔝9953056974 🔝 Escort Service
 
KubeKraft presentation @CloudNativeHooghly
KubeKraft presentation @CloudNativeHooghlyKubeKraft presentation @CloudNativeHooghly
KubeKraft presentation @CloudNativeHooghly
 
Generative AI or GenAI technology based PPT
Generative AI or GenAI technology based PPTGenerative AI or GenAI technology based PPT
Generative AI or GenAI technology based PPT
 
Coefficient of Thermal Expansion and their Importance.pptx
Coefficient of Thermal Expansion and their Importance.pptxCoefficient of Thermal Expansion and their Importance.pptx
Coefficient of Thermal Expansion and their Importance.pptx
 

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 :-)