Les deux révisions précédentesRévision précédenteProchaine révision | Révision précédenteProchaine révisionLes deux révisions suivantes |
informatique:javascript [10/07/2018 09:07] – [Popper.js] cyrille | informatique:javascript [12/06/2023 15:22] – [Alpine.js] cyrille |
---|
| |
Voir aussi; | Voir aussi; |
* [[/informatique/javascript/jquery|/informatique/javascript/jquery]] | |
| * [[:informatique:javascript:jquery|/informatique/javascript/jquery]] |
* [[https://hackernoon.com/a-map-to-modern-javascript-development-2017-16d9eb86309c|A Map To Modern JavaScript Development (2017)]] | * [[https://hackernoon.com/a-map-to-modern-javascript-development-2017-16d9eb86309c|A Map To Modern JavaScript Development (2017)]] |
| |
De la doc: | De la doc: |
| |
* [[https://developer.mozilla.org/fr/JavaScript|Centre de documentation Mozilla]] | * [[https://developer.mozilla.org/fr/JavaScript|Centre de documentation Mozilla]] |
* [[https://developer.mozilla.org/en-US/docs/Web/JavaScript/Introduction_to_Object-Oriented_JavaScript|Introduction to Object-Oriented JavaScript]], [[http://javascript.info/tutorial/oop|Javascript OOP patterns]] (POO) | * [[https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Objects/Object-oriented_JS|Object-oriented JavaScript for beginners]] |
* [[http://orizens.com/wp/topics/oop-javascript-jquery-binding-events-and-keep-the-contex/|OOP Javascript, Jquery, Binding events and keep the context (this)]] (POO) | * [[https://developer.mozilla.org/en-US/docs/Web/JavaScript/Introduction_to_Object-Oriented_JavaScript|Introduction to Object-Oriented JavaScript]], [[http://javascript.info/tutorial/oop|Javascript OOP patterns]] (POO) |
| * [[http://orizens.com/wp/topics/oop-javascript-jquery-binding-events-and-keep-the-contex/|OOP Javascript, Jquery, Binding events and keep the context (this)]] (POO) |
* Callbacks vs Events | * Callbacks vs Events |
* [[http://dean.edwards.name/weblog/2009/03/callbacks-vs-events/|Callbacks vs Events]] well presents the difference | * [[http://dean.edwards.name/weblog/2009/03/callbacks-vs-events/|Callbacks vs Events]] well presents the difference |
* [[https://jsperf.com/event-vs-callback|performance test]] | * [[https://jsperf.com/event-vs-callback|performance test]] |
* [[https://developers.google.com/web/fundamentals/primers/promises/?hl=en#promise-terminology|About Promise]] et sur la page [[https://cyrille.giquello.fr/informatique/javascript/jquery|jquery]] (promise, deferred) | * [[https://developers.google.com/web/fundamentals/primers/promises/?hl=en#promise-terminology|About Promise]] et sur la page [[https://cyrille.giquello.fr/informatique/javascript/jquery|jquery]] (promise, deferred) |
| |
| |
Liste d'outils et librairies : | Liste d'outils et librairies : |
* http://www.hlrnet.com/frinprog.htm | |
| |
[[http://jsperf.com/jsPerf]] - JavaScript performance playground: jsPerf aims to provide an easy way to create and share test cases, comparing the performance of different JavaScript snippets by running benchmarks. | * [[http://www.hlrnet.com/frinprog.htm|http://www.hlrnet.com/frinprog.htm]] |
| |
| [[http://jsperf.com/jsPerf|http://jsperf.com/jsPerf]] |
| - JavaScript performance playground: jsPerf aims to provide an easy way to create and share test cases, comparing the performance of different JavaScript snippets by running benchmarks. |
| |
===== Tools ===== | ===== Tools ===== |
| |
[[http://fr.slideshare.net/community_streamdataIO/2015-0622-parisjs-websocket-vs-sse-v2|Websocket vs SSE]] (//[[/glossaire/SSE|Server Sent events (SSE)]]//) | [[http://fr.slideshare.net/community_streamdataIO/2015-0622-parisjs-websocket-vs-sse-v2|Websocket vs SSE]] (//[[/glossaire/SSE|Server Sent events (SSE)]]//) |
| |
| ==== FullPage ==== |
| |
| Create Beautiful Fullscreen Scrolling Websites |
| |
| https://alvarotrigo.com/fullPage |
| |
| one page website |
==== Flexigrid ==== | ==== Flexigrid ==== |
| |
==== Popper.js ==== | ==== Popper.js ==== |
| |
{{ :informatique:6f515cba0f81af6fb612d092632254e1.png}} | {{ :informatique:6f515cba0f81af6fb612d092632254e1.png?140}} |
| |
Easily position tooltips, popovers (popup) or anything with just a line of code. Used by Bootstrap 4. | Easily position tooltips, popovers (popup) or anything with just a line of code. Used by Bootstrap 4. |
| |
| |
==== YUI TreeView Control ==== | ==== Tree View ==== |
| |
| === FancyTree === |
| |
| https://github.com/mar10/fancytree |
| |
| https://github.com/mar10/fancytree/wiki |
| |
| https://wwwendt.de/tech/fancytree/demo/#sample-ext-glyph-svg.html |
| === YUI TreeView Control === |
| |
[[http://developer.yahoo.com/yui/treeview/]] | [[http://developer.yahoo.com/yui/treeview/]] |
| |
| |
==== Dojo Dijit Tree ==== | === Dojo Dijit Tree === |
| |
http://dojotoolkit.org/reference-guide/dijit/Tree.html | http://dojotoolkit.org/reference-guide/dijit/Tree.html |
| |
http://www.jqplot.com | http://www.jqplot.com |
| |
| ==== Chart.js ==== |
| |
| Simple yet flexible JavaScript charting for designers & developers |
| |
| https://www.chartjs.org/ |
| |
==== plotly.js ==== | ==== plotly.js ==== |
Video.js is an open source library for working with video on the web, also known as an HTML video player. | Video.js is an open source library for working with video on the web, also known as an HTML video player. |
| |
| ==== graph visualization ==== |
| |
| === Sigma.js === |
| |
| [[/informatique/javascript/sigmajs|Sigma.js]] |
| |
| === Dracula.js === |
| |
| :!: depecrated https://www.graphdracula.net/ |
| |
| === d3js === |
| |
| https://d3js.org/ |
| |
| * [[https://d3-graph-gallery.com/network.html|Network graph]] |
| * [[https://d3-graph-gallery.com/graph/network_basic.html|Most basic network chart in d3.js]] |
| |
===== 3D & Game engine ===== | ===== 3D & Game engine ===== |
| |
* [[http://tech.yes-co.nl/2009/08/25/jquery-versus-dojo-versus-yui/|JQuery versus Dojo versus YUI]] (2009) | * [[http://tech.yes-co.nl/2009/08/25/jquery-versus-dojo-versus-yui/|JQuery versus Dojo versus YUI]] (2009) |
* [[http://blog.creonfx.com/javascript/mootools-vs-jquery-vs-prototype-vs-yui-vs-dojo-comparison-revised|MooTools vs jQuery vs Prototype vs YUI vs Dojo comparison revised]] (2009) | * [[http://blog.creonfx.com/javascript/mootools-vs-jquery-vs-prototype-vs-yui-vs-dojo-comparison-revised|MooTools vs jQuery vs Prototype vs YUI vs Dojo comparison revised]] (2009) |
| |
| ==== Alpine.js ==== |
| |
| https://github.com/alpinejs/alpine/ |
| |
| AlpineJs permet de manipuler le DOM sans se lancer dans une SPA, très léger (<10ko gzippé et minifié) et n'utilise pas de DOM virtuel. Sa syntaxe est similaire à VueJS. C'est un bon outil entre jQuery et VueJs. |
| |
| * [[https://www.weblogin.fr/blog/119-alpinejs-le-framework-js-entre-jquery-et-vuejs|AlpineJS le framework JS entre JQuery et VueJS]] |
| |
==== Vue.js ==== | ==== Vue.js ==== |
* [[https://yuche.github.io/vue-strap/|VueStrap.js]] is Bootstrap components built with Vue.js | * [[https://yuche.github.io/vue-strap/|VueStrap.js]] is Bootstrap components built with Vue.js |
* [[https://github.com/surfbirdapp/surfbird|surfbird]] a Twitter client built on [[/informatique/mobile_app#electron|Electron]] and [[/informatique/javascript#Vue.js]] | * [[https://github.com/surfbirdapp/surfbird|surfbird]] a Twitter client built on [[/informatique/mobile_app#electron|Electron]] and [[/informatique/javascript#Vue.js]] |
| * Wordpress |
| * [[https://www.sitepoint.com/building-a-wordpress-plugin-with-vue/|Building a WordPress Plugin with Vue]] 2018 - utilise un endpoint WP-API (ex: ''/wp-json/wp/v2/posts?filter[orderby]=date'' |
| * [[https://github.com/bshiluk/vue-wordpress|vue-wordpress]] Starter Template for building WordPress themes as Vue.js SPAs |
| * |
==== React.js ==== | ==== React.js ==== |
| |
[[http://lunrjs.com|LUNR.js]] a simple full-text search in your browser. | [[http://lunrjs.com|LUNR.js]] a simple full-text search in your browser. |
| |
| ==== Webapp & Offline mode ==== |
| |
| * [[https://verekia.com/html5/tutoriel-application-web-offline-html5-cache-manifest/|Tutoriel : Une application web offline HTML5 avec le cache manifest]] |
| * [[https://developers.google.com/web/fundamentals/codelabs/offline/|Adding a Service Worker and Offline into your Web App]] |
| * [[https://www.sitepoint.com/offline-web-application-tutorial/|How To Create an Offline Web Application]] (02/2010) |
===== Démos ===== | ===== Démos ===== |
| |