SlideShare uma empresa Scribd logo
1 de 49
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
www.e4d.co.il
www.choroshin.com
JavaScript UI Components
Israel JavaScript Conference
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
Today we will Show you demos that will make you say wow!
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
- Web examples
Click on the image for example
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
- Web examples
Click on the image for example
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
- Web examples
Click on the image for example
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
- Web examples
Click on the image for example
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
- Web examples
Click on the image for example
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
- Web examples
Click on the image for example
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
- Web examples
Click on the image for example
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
- Web examples
Click on the image for example
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
- Web examples
Click on the image for example
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
- Web examples
Click on the image for example
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
- Web examples
Click on the image for example
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
- Web examples
Click on the image for example
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
- Web examples
Click on the image for example
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
- Web examples
Click on the image for example
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
- Web examples
Click on the image for example
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
- Web examples
Click on the image for example
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
- Web examples
Click on the image for example
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
- Web examples
Click on the image for example
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
- Web examples
Click on the image for example
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
- Mobile examples
Click on the image for example
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
- Mobile examples
Click on the image for example
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
- Mobile examples
Click on the image for example
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
- Mobile examples
Click on the image for example
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
What is the difference between:
Plugin and a Widget?
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
Things to consider when choosing
a Web UI Component
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
Purchase - Pros
Purchase - Cons
Purchase or use “Open-source” ?
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
‘Open-source’ - Pros
‘Open-source’ - Cons
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
Community Ecosystem
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
Building large, single-page web apps with a smart component
models isn’t easy today. Web Components help developer
encapsulate they HTML, CSS and JavaScript so it doesn’t
interfere with the rest of the page and the page doesn’t
interfere with it.
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
So what is this all about? Essentially,
Web Components give developers an
easier way to create web sites and
recyclable widgets on these sites with
the help of the HTML, CSS and
JavaScript they already know.
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
http://jsfiddle.net/choroshin/h3mez/
http://html5-
demos.appspot.com/static/webcomponent
s/index.html#6
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
With Shadow DOM, elements can get a new kind of node
associated with them. This new kind of node is called
a shadow root. An element that has a shadow root
associated with it is called a shadow host. The content of a
shadow host isn’t rendered; the content of the shadow root
is rendered instead.
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
A number of Google engineers are also working
on Project Polymer, which aims to write a web
application framework that’s built upon the idea of
Web Components and will allow developers to use
the ideas behind Web Components on browsers
that don’t even feature all of the necessary
technologies yet.
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
It’s worth noting that, for the time being,
developers can’t rely on this to work in all
browsers. Chrome Canary includes support for
Web Components, but it’s hidden behind a
number of flags
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
Polymer
http://jsfiddle.net/choroshin/Kd
G2S/
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
http://techcrunch.com/2013/05/19/google-believes-web-
components-are-the-future-of-web-development/
http://html5-
demos.appspot.com/static/webcomponents/index.html#1
http://www.polymer-project.org/
http://www.html5rocks.com/en/tutorials/webcomponents/shadowdo
m/
http://www.youtube.com/watch?feature=player_embedded&v=0g0oO
OT86NY
http://www.w3.org/TR/2013/WD-components-intro-20130606/
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
URLPurchase/open-sourceType
http://demos.kendoui.comPurchaseUi widgets
http://demo.mobiscroll.com/PurchaseMobile ui widgets
http://www.highcharts.com/PurchaseCharts
http://cubiq.org/open-sourceMobile ui widgets
09/2012http://www.nobodymuch.com/
-filter-sort-plugin-jquery-/datatables
tables.html
open-sourceDataGrid
http://yuilibrary.com/open-sourceUi widgets
http://www.devexpress.com/Support/
5Demos/#!platform=html
PurchaseUi widgets
http://www.chartjs.org/open-sourceCharts
ui.com/web/2http://wopen-sourceDataGrid
http://amsul.ca/pickadate.js/open-sourceDate picker
http://www.datatables.net/open-sourceDataGrid
-15http://www.hotscripts.com/blog/
-html-enhance-grids-data-javascript
tables/
open-sourceDataGrid collection
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
URLPurchase/open-sourceType
http://www.jqwidgets.com/open-sourceUi widgets
http://tympanus.net/open-sourceUi widgetsplugins
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
www.choroshin.com
www.e4d.co.il
www.choroshin.com

Mais conteúdo relacionado

Semelhante a Ui components - js-il.com

Js il 2013 breeze.js
Js il 2013 breeze.jsJs il 2013 breeze.js
Js il 2013 breeze.jsEyal Vardi
 
AngularJS : Superheroic Javascript MVW Framework
AngularJS : Superheroic Javascript MVW FrameworkAngularJS : Superheroic Javascript MVW Framework
AngularJS : Superheroic Javascript MVW FrameworkEdureka!
 
Prototyping app using JS and HTML5 (Ciklum Kharkiv)
Prototyping app using JS and HTML5 (Ciklum Kharkiv)Prototyping app using JS and HTML5 (Ciklum Kharkiv)
Prototyping app using JS and HTML5 (Ciklum Kharkiv)Yuriy Silvestrov
 
STLDODN - Get Rid of CRUD faster!
STLDODN - Get Rid of CRUD faster!STLDODN - Get Rid of CRUD faster!
STLDODN - Get Rid of CRUD faster!kshaffar
 
Quick prototyping apps using JS - Ciklum, Vinnitsa
Quick prototyping apps using JS - Ciklum, VinnitsaQuick prototyping apps using JS - Ciklum, Vinnitsa
Quick prototyping apps using JS - Ciklum, VinnitsaYuriy Silvestrov
 
JavaScript Training Day 01 Iqra Technology.pptx
JavaScript Training Day 01 Iqra Technology.pptxJavaScript Training Day 01 Iqra Technology.pptx
JavaScript Training Day 01 Iqra Technology.pptxMohammadShoaib60236
 
AngularJS : Superheroic JavaScript MVW Framework
AngularJS : Superheroic JavaScript MVW FrameworkAngularJS : Superheroic JavaScript MVW Framework
AngularJS : Superheroic JavaScript MVW FrameworkEdureka!
 
Angular JS - Develop Responsive Single Page Application
Angular JS - Develop Responsive Single Page ApplicationAngular JS - Develop Responsive Single Page Application
Angular JS - Develop Responsive Single Page ApplicationEdureka!
 
Webinar on Angular JS titled 'Develop Responsive Single Page Application'
Webinar on Angular JS titled 'Develop Responsive Single Page Application'Webinar on Angular JS titled 'Develop Responsive Single Page Application'
Webinar on Angular JS titled 'Develop Responsive Single Page Application'Edureka!
 
JS FAST Prototyping with AngularJS & RequireJS
JS FAST Prototyping with AngularJS & RequireJSJS FAST Prototyping with AngularJS & RequireJS
JS FAST Prototyping with AngularJS & RequireJSYuriy Silvestrov
 
Virendra Jain Portfolio
Virendra Jain PortfolioVirendra Jain Portfolio
Virendra Jain PortfolioVirendra Jain
 
Enhancing SharePoint with Responsive Web Design
Enhancing SharePoint with Responsive Web DesignEnhancing SharePoint with Responsive Web Design
Enhancing SharePoint with Responsive Web DesignEric Overfield
 
(In)Security Implication in the JS Universe
(In)Security Implication in the JS Universe(In)Security Implication in the JS Universe
(In)Security Implication in the JS UniverseStefano Di Paola
 
Best-Practices-Web-Usability
Best-Practices-Web-UsabilityBest-Practices-Web-Usability
Best-Practices-Web-UsabilityLarry Wilson
 
Angular JS Basics
Angular JS BasicsAngular JS Basics
Angular JS BasicsMounish Sai
 
Postmodern Web Apps
Postmodern Web AppsPostmodern Web Apps
Postmodern Web Appsmalteubl
 
IRJET- Web Page Builder
IRJET- Web Page BuilderIRJET- Web Page Builder
IRJET- Web Page BuilderIRJET Journal
 
DeveloperWeek Global 2020 - OpenJS Foundation - The First 25 Years of Javascr...
DeveloperWeek Global 2020 - OpenJS Foundation - The First 25 Years of Javascr...DeveloperWeek Global 2020 - OpenJS Foundation - The First 25 Years of Javascr...
DeveloperWeek Global 2020 - OpenJS Foundation - The First 25 Years of Javascr...Bethany Nicolle Griggs
 

Semelhante a Ui components - js-il.com (20)

Mvvm and KnockoutJS
Mvvm and KnockoutJSMvvm and KnockoutJS
Mvvm and KnockoutJS
 
Js il 2013 breeze.js
Js il 2013 breeze.jsJs il 2013 breeze.js
Js il 2013 breeze.js
 
AngularJS : Superheroic Javascript MVW Framework
AngularJS : Superheroic Javascript MVW FrameworkAngularJS : Superheroic Javascript MVW Framework
AngularJS : Superheroic Javascript MVW Framework
 
Prototyping app using JS and HTML5 (Ciklum Kharkiv)
Prototyping app using JS and HTML5 (Ciklum Kharkiv)Prototyping app using JS and HTML5 (Ciklum Kharkiv)
Prototyping app using JS and HTML5 (Ciklum Kharkiv)
 
STLDODN - Get Rid of CRUD faster!
STLDODN - Get Rid of CRUD faster!STLDODN - Get Rid of CRUD faster!
STLDODN - Get Rid of CRUD faster!
 
Quick prototyping apps using JS - Ciklum, Vinnitsa
Quick prototyping apps using JS - Ciklum, VinnitsaQuick prototyping apps using JS - Ciklum, Vinnitsa
Quick prototyping apps using JS - Ciklum, Vinnitsa
 
JavaScript Training Day 01 Iqra Technology.pptx
JavaScript Training Day 01 Iqra Technology.pptxJavaScript Training Day 01 Iqra Technology.pptx
JavaScript Training Day 01 Iqra Technology.pptx
 
AngularJS : Superheroic JavaScript MVW Framework
AngularJS : Superheroic JavaScript MVW FrameworkAngularJS : Superheroic JavaScript MVW Framework
AngularJS : Superheroic JavaScript MVW Framework
 
Angular JS - Develop Responsive Single Page Application
Angular JS - Develop Responsive Single Page ApplicationAngular JS - Develop Responsive Single Page Application
Angular JS - Develop Responsive Single Page Application
 
Webinar on Angular JS titled 'Develop Responsive Single Page Application'
Webinar on Angular JS titled 'Develop Responsive Single Page Application'Webinar on Angular JS titled 'Develop Responsive Single Page Application'
Webinar on Angular JS titled 'Develop Responsive Single Page Application'
 
JS FAST Prototyping with AngularJS & RequireJS
JS FAST Prototyping with AngularJS & RequireJSJS FAST Prototyping with AngularJS & RequireJS
JS FAST Prototyping with AngularJS & RequireJS
 
Virendra Jain Portfolio
Virendra Jain PortfolioVirendra Jain Portfolio
Virendra Jain Portfolio
 
Enhancing SharePoint with Responsive Web Design
Enhancing SharePoint with Responsive Web DesignEnhancing SharePoint with Responsive Web Design
Enhancing SharePoint with Responsive Web Design
 
(In)Security Implication in the JS Universe
(In)Security Implication in the JS Universe(In)Security Implication in the JS Universe
(In)Security Implication in the JS Universe
 
Best-Practices-Web-Usability
Best-Practices-Web-UsabilityBest-Practices-Web-Usability
Best-Practices-Web-Usability
 
Angular JS Basics
Angular JS BasicsAngular JS Basics
Angular JS Basics
 
Postmodern Web Apps
Postmodern Web AppsPostmodern Web Apps
Postmodern Web Apps
 
Exploring internet
Exploring internetExploring internet
Exploring internet
 
IRJET- Web Page Builder
IRJET- Web Page BuilderIRJET- Web Page Builder
IRJET- Web Page Builder
 
DeveloperWeek Global 2020 - OpenJS Foundation - The First 25 Years of Javascr...
DeveloperWeek Global 2020 - OpenJS Foundation - The First 25 Years of Javascr...DeveloperWeek Global 2020 - OpenJS Foundation - The First 25 Years of Javascr...
DeveloperWeek Global 2020 - OpenJS Foundation - The First 25 Years of Javascr...
 

Mais de Eyal Vardi

Smart Contract
Smart ContractSmart Contract
Smart ContractEyal Vardi
 
Rachel's grandmother's recipes
Rachel's grandmother's recipesRachel's grandmother's recipes
Rachel's grandmother's recipesEyal Vardi
 
Performance Optimization In Angular 2
Performance Optimization In Angular 2Performance Optimization In Angular 2
Performance Optimization In Angular 2Eyal Vardi
 
Angular 2 Architecture (Bucharest 26/10/2016)
Angular 2 Architecture (Bucharest 26/10/2016)Angular 2 Architecture (Bucharest 26/10/2016)
Angular 2 Architecture (Bucharest 26/10/2016)Eyal Vardi
 
Angular 2 NgModule
Angular 2 NgModuleAngular 2 NgModule
Angular 2 NgModuleEyal Vardi
 
Upgrading from Angular 1.x to Angular 2.x
Upgrading from Angular 1.x to Angular 2.xUpgrading from Angular 1.x to Angular 2.x
Upgrading from Angular 1.x to Angular 2.xEyal Vardi
 
Angular 2 - Ahead of-time Compilation
Angular 2 - Ahead of-time CompilationAngular 2 - Ahead of-time Compilation
Angular 2 - Ahead of-time CompilationEyal Vardi
 
Routing And Navigation
Routing And NavigationRouting And Navigation
Routing And NavigationEyal Vardi
 
Angular 2 Architecture
Angular 2 ArchitectureAngular 2 Architecture
Angular 2 ArchitectureEyal Vardi
 
Angular 1.x vs. Angular 2.x
Angular 1.x vs. Angular 2.xAngular 1.x vs. Angular 2.x
Angular 1.x vs. Angular 2.xEyal Vardi
 
Angular 2.0 Views
Angular 2.0 ViewsAngular 2.0 Views
Angular 2.0 ViewsEyal Vardi
 
Component lifecycle hooks in Angular 2.0
Component lifecycle hooks in Angular 2.0Component lifecycle hooks in Angular 2.0
Component lifecycle hooks in Angular 2.0Eyal Vardi
 
Template syntax in Angular 2.0
Template syntax in Angular 2.0Template syntax in Angular 2.0
Template syntax in Angular 2.0Eyal Vardi
 
Http Communication in Angular 2.0
Http Communication in Angular 2.0Http Communication in Angular 2.0
Http Communication in Angular 2.0Eyal Vardi
 
Angular 2.0 Dependency injection
Angular 2.0 Dependency injectionAngular 2.0 Dependency injection
Angular 2.0 Dependency injectionEyal Vardi
 
Angular 2.0 Routing and Navigation
Angular 2.0 Routing and NavigationAngular 2.0 Routing and Navigation
Angular 2.0 Routing and NavigationEyal Vardi
 
Async & Parallel in JavaScript
Async & Parallel in JavaScriptAsync & Parallel in JavaScript
Async & Parallel in JavaScriptEyal Vardi
 
Angular 2.0 Pipes
Angular 2.0 PipesAngular 2.0 Pipes
Angular 2.0 PipesEyal Vardi
 
Angular 2.0 forms
Angular 2.0 formsAngular 2.0 forms
Angular 2.0 formsEyal Vardi
 

Mais de Eyal Vardi (20)

Why magic
Why magicWhy magic
Why magic
 
Smart Contract
Smart ContractSmart Contract
Smart Contract
 
Rachel's grandmother's recipes
Rachel's grandmother's recipesRachel's grandmother's recipes
Rachel's grandmother's recipes
 
Performance Optimization In Angular 2
Performance Optimization In Angular 2Performance Optimization In Angular 2
Performance Optimization In Angular 2
 
Angular 2 Architecture (Bucharest 26/10/2016)
Angular 2 Architecture (Bucharest 26/10/2016)Angular 2 Architecture (Bucharest 26/10/2016)
Angular 2 Architecture (Bucharest 26/10/2016)
 
Angular 2 NgModule
Angular 2 NgModuleAngular 2 NgModule
Angular 2 NgModule
 
Upgrading from Angular 1.x to Angular 2.x
Upgrading from Angular 1.x to Angular 2.xUpgrading from Angular 1.x to Angular 2.x
Upgrading from Angular 1.x to Angular 2.x
 
Angular 2 - Ahead of-time Compilation
Angular 2 - Ahead of-time CompilationAngular 2 - Ahead of-time Compilation
Angular 2 - Ahead of-time Compilation
 
Routing And Navigation
Routing And NavigationRouting And Navigation
Routing And Navigation
 
Angular 2 Architecture
Angular 2 ArchitectureAngular 2 Architecture
Angular 2 Architecture
 
Angular 1.x vs. Angular 2.x
Angular 1.x vs. Angular 2.xAngular 1.x vs. Angular 2.x
Angular 1.x vs. Angular 2.x
 
Angular 2.0 Views
Angular 2.0 ViewsAngular 2.0 Views
Angular 2.0 Views
 
Component lifecycle hooks in Angular 2.0
Component lifecycle hooks in Angular 2.0Component lifecycle hooks in Angular 2.0
Component lifecycle hooks in Angular 2.0
 
Template syntax in Angular 2.0
Template syntax in Angular 2.0Template syntax in Angular 2.0
Template syntax in Angular 2.0
 
Http Communication in Angular 2.0
Http Communication in Angular 2.0Http Communication in Angular 2.0
Http Communication in Angular 2.0
 
Angular 2.0 Dependency injection
Angular 2.0 Dependency injectionAngular 2.0 Dependency injection
Angular 2.0 Dependency injection
 
Angular 2.0 Routing and Navigation
Angular 2.0 Routing and NavigationAngular 2.0 Routing and Navigation
Angular 2.0 Routing and Navigation
 
Async & Parallel in JavaScript
Async & Parallel in JavaScriptAsync & Parallel in JavaScript
Async & Parallel in JavaScript
 
Angular 2.0 Pipes
Angular 2.0 PipesAngular 2.0 Pipes
Angular 2.0 Pipes
 
Angular 2.0 forms
Angular 2.0 formsAngular 2.0 forms
Angular 2.0 forms
 

Último

AXA XL - Insurer Innovation Award Americas 2024
AXA XL - Insurer Innovation Award Americas 2024AXA XL - Insurer Innovation Award Americas 2024
AXA XL - Insurer Innovation Award Americas 2024The Digital Insurer
 
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot TakeoffStrategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoffsammart93
 
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...DianaGray10
 
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost SavingRepurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost SavingEdi Saputra
 
2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...Martijn de Jong
 
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc
 
FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024The Digital Insurer
 
Corporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptxCorporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptxRustici Software
 
A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?Igalia
 
Apidays Singapore 2024 - Modernizing Securities Finance by Madhu Subbu
Apidays Singapore 2024 - Modernizing Securities Finance by Madhu SubbuApidays Singapore 2024 - Modernizing Securities Finance by Madhu Subbu
Apidays Singapore 2024 - Modernizing Securities Finance by Madhu Subbuapidays
 
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...apidays
 
Architecting Cloud Native Applications
Architecting Cloud Native ApplicationsArchitecting Cloud Native Applications
Architecting Cloud Native ApplicationsWSO2
 
AWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of TerraformAWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of TerraformAndrey Devyatkin
 
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ..."I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...Zilliz
 
Polkadot JAM Slides - Token2049 - By Dr. Gavin Wood
Polkadot JAM Slides - Token2049 - By Dr. Gavin WoodPolkadot JAM Slides - Token2049 - By Dr. Gavin Wood
Polkadot JAM Slides - Token2049 - By Dr. Gavin WoodJuan lago vázquez
 
MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MIND CTI
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FMESafe Software
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerThousandEyes
 
Strategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a FresherStrategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a FresherRemote DBA Services
 
Navi Mumbai Call Girls 🥰 8617370543 Service Offer VIP Hot Model
Navi Mumbai Call Girls 🥰 8617370543 Service Offer VIP Hot ModelNavi Mumbai Call Girls 🥰 8617370543 Service Offer VIP Hot Model
Navi Mumbai Call Girls 🥰 8617370543 Service Offer VIP Hot ModelDeepika Singh
 

Último (20)

AXA XL - Insurer Innovation Award Americas 2024
AXA XL - Insurer Innovation Award Americas 2024AXA XL - Insurer Innovation Award Americas 2024
AXA XL - Insurer Innovation Award Americas 2024
 
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot TakeoffStrategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
 
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
 
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost SavingRepurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
 
2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...
 
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
 
FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024
 
Corporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptxCorporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptx
 
A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?
 
Apidays Singapore 2024 - Modernizing Securities Finance by Madhu Subbu
Apidays Singapore 2024 - Modernizing Securities Finance by Madhu SubbuApidays Singapore 2024 - Modernizing Securities Finance by Madhu Subbu
Apidays Singapore 2024 - Modernizing Securities Finance by Madhu Subbu
 
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
 
Architecting Cloud Native Applications
Architecting Cloud Native ApplicationsArchitecting Cloud Native Applications
Architecting Cloud Native Applications
 
AWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of TerraformAWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of Terraform
 
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ..."I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
 
Polkadot JAM Slides - Token2049 - By Dr. Gavin Wood
Polkadot JAM Slides - Token2049 - By Dr. Gavin WoodPolkadot JAM Slides - Token2049 - By Dr. Gavin Wood
Polkadot JAM Slides - Token2049 - By Dr. Gavin Wood
 
MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
Strategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a FresherStrategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a Fresher
 
Navi Mumbai Call Girls 🥰 8617370543 Service Offer VIP Hot Model
Navi Mumbai Call Girls 🥰 8617370543 Service Offer VIP Hot ModelNavi Mumbai Call Girls 🥰 8617370543 Service Offer VIP Hot Model
Navi Mumbai Call Girls 🥰 8617370543 Service Offer VIP Hot Model
 

Ui components - js-il.com

  • 1. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | www.e4d.co.il www.choroshin.com JavaScript UI Components Israel JavaScript Conference
  • 2. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
  • 3. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
  • 4. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
  • 5. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
  • 6. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | Today we will Show you demos that will make you say wow!
  • 7. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | - Web examples Click on the image for example
  • 8. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | - Web examples Click on the image for example
  • 9. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | - Web examples Click on the image for example
  • 10. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | - Web examples Click on the image for example
  • 11. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | - Web examples Click on the image for example
  • 12. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | - Web examples Click on the image for example
  • 13. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | - Web examples Click on the image for example
  • 14. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | - Web examples Click on the image for example
  • 15. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | - Web examples Click on the image for example
  • 16. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | - Web examples Click on the image for example
  • 17. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | - Web examples Click on the image for example
  • 18. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | - Web examples Click on the image for example
  • 19. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | - Web examples Click on the image for example
  • 20. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | - Web examples Click on the image for example
  • 21. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | - Web examples Click on the image for example
  • 22. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | - Web examples Click on the image for example
  • 23. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | - Web examples Click on the image for example
  • 24. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | - Web examples Click on the image for example
  • 25. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | - Web examples Click on the image for example
  • 26. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | - Mobile examples Click on the image for example
  • 27. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | - Mobile examples Click on the image for example
  • 28. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | - Mobile examples Click on the image for example
  • 29. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | - Mobile examples Click on the image for example
  • 30. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | What is the difference between: Plugin and a Widget?
  • 31. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | Things to consider when choosing a Web UI Component
  • 32. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | Purchase - Pros Purchase - Cons Purchase or use “Open-source” ?
  • 33. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | ‘Open-source’ - Pros ‘Open-source’ - Cons
  • 34. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | Community Ecosystem
  • 35. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
  • 36. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | Building large, single-page web apps with a smart component models isn’t easy today. Web Components help developer encapsulate they HTML, CSS and JavaScript so it doesn’t interfere with the rest of the page and the page doesn’t interfere with it.
  • 37. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | So what is this all about? Essentially, Web Components give developers an easier way to create web sites and recyclable widgets on these sites with the help of the HTML, CSS and JavaScript they already know.
  • 38. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | http://jsfiddle.net/choroshin/h3mez/ http://html5- demos.appspot.com/static/webcomponent s/index.html#6
  • 39. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
  • 40. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | With Shadow DOM, elements can get a new kind of node associated with them. This new kind of node is called a shadow root. An element that has a shadow root associated with it is called a shadow host. The content of a shadow host isn’t rendered; the content of the shadow root is rendered instead.
  • 41. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | A number of Google engineers are also working on Project Polymer, which aims to write a web application framework that’s built upon the idea of Web Components and will allow developers to use the ideas behind Web Components on browsers that don’t even feature all of the necessary technologies yet.
  • 42. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | It’s worth noting that, for the time being, developers can’t rely on this to work in all browsers. Chrome Canary includes support for Web Components, but it’s hidden behind a number of flags
  • 43. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | Polymer http://jsfiddle.net/choroshin/Kd G2S/
  • 44. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | http://techcrunch.com/2013/05/19/google-believes-web- components-are-the-future-of-web-development/ http://html5- demos.appspot.com/static/webcomponents/index.html#1 http://www.polymer-project.org/ http://www.html5rocks.com/en/tutorials/webcomponents/shadowdo m/ http://www.youtube.com/watch?feature=player_embedded&v=0g0oO OT86NY http://www.w3.org/TR/2013/WD-components-intro-20130606/
  • 45. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | URLPurchase/open-sourceType http://demos.kendoui.comPurchaseUi widgets http://demo.mobiscroll.com/PurchaseMobile ui widgets http://www.highcharts.com/PurchaseCharts http://cubiq.org/open-sourceMobile ui widgets 09/2012http://www.nobodymuch.com/ -filter-sort-plugin-jquery-/datatables tables.html open-sourceDataGrid http://yuilibrary.com/open-sourceUi widgets http://www.devexpress.com/Support/ 5Demos/#!platform=html PurchaseUi widgets http://www.chartjs.org/open-sourceCharts ui.com/web/2http://wopen-sourceDataGrid http://amsul.ca/pickadate.js/open-sourceDate picker http://www.datatables.net/open-sourceDataGrid -15http://www.hotscripts.com/blog/ -html-enhance-grids-data-javascript tables/ open-sourceDataGrid collection
  • 46. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | URLPurchase/open-sourceType http://www.jqwidgets.com/open-sourceUi widgets http://tympanus.net/open-sourceUi widgetsplugins
  • 47. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
  • 48. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com |
  • 49. Israel JavaScript Conference | 03 – 6325707 | info@e4d.co.il | www.js-il.com | www.choroshin.com www.e4d.co.il www.choroshin.com

Notas do Editor

  1. הבאז הגדול של HTML5 והתפתחות טכנולוגית נתנה סוף סוף אפשרות לייצר אפליקציות WEB שמתנהגות כמו אפלקציותDESCTOP (GMAIL,OUTLOOK) אתמול פתחתי את המצגת בPPהוואביולשנייה הייתי בטוח שפתחתי אותה מהDESCTOP .חדשות אפשרה פיתוח של אפליקציות SPA
  2. על פי בדיקה פשוטה ב GOOGLETRENDS ניתן לראות שיש מגמה מאוד ברורה , לאן הולכת התעשייה.ולמה אני מספר לכם את כל זה?
  3. ההתפתחות הטכנולוגית והביקוש לאפליקציות DESCTOP יצרה ביקוש רב לרכיבים מדליקים שחווית השימוש בהם תהיה כמו אפליקציה NATIVEwrite once run anywhere
  4. זה תלוי, צריך להתחשב במספר גורמים