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

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
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024Rafal Los
 
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, AdobeApidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobeapidays
 
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdfUnderstanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdfUK Journal
 
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...Drew Madelung
 
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024The Digital Insurer
 
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...apidays
 
Artificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : UncertaintyArtificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : UncertaintyKhushali Kathiriya
 
Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024The Digital Insurer
 
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
 
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
 
Scaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationScaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationRadu Cotescu
 
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
 
Manulife - Insurer Innovation Award 2024
Manulife - Insurer Innovation Award 2024Manulife - Insurer Innovation Award 2024
Manulife - Insurer Innovation Award 2024The Digital Insurer
 
Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...apidays
 
Real Time Object Detection Using Open CV
Real Time Object Detection Using Open CVReal Time Object Detection Using Open CV
Real Time Object Detection Using Open CVKhem
 
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024The Digital Insurer
 
A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)Gabriella Davis
 
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
 
Top 10 Most Downloaded Games on Play Store in 2024
Top 10 Most Downloaded Games on Play Store in 2024Top 10 Most Downloaded Games on Play Store in 2024
Top 10 Most Downloaded Games on Play Store in 2024SynarionITSolutions
 

Último (20)

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
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024
 
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, AdobeApidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
 
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdfUnderstanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
 
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
 
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
 
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
 
Artificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : UncertaintyArtificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : Uncertainty
 
Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024
 
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
 
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
 
Scaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationScaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organization
 
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
 
Manulife - Insurer Innovation Award 2024
Manulife - Insurer Innovation Award 2024Manulife - Insurer Innovation Award 2024
Manulife - Insurer Innovation Award 2024
 
Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...
 
Real Time Object Detection Using Open CV
Real Time Object Detection Using Open CVReal Time Object Detection Using Open CV
Real Time Object Detection Using Open CV
 
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
 
A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)
 
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
 
Top 10 Most Downloaded Games on Play Store in 2024
Top 10 Most Downloaded Games on Play Store in 2024Top 10 Most Downloaded Games on Play Store in 2024
Top 10 Most Downloaded Games on Play Store in 2024
 

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. זה תלוי, צריך להתחשב במספר גורמים