https://goo.gl/67anC7
https://goo.gl/67anC7
Vue.js
Orienté Composants
Le Framework JavaScript Progressif
<script src="https://unpkg.com/vue">
npm install vue
import Vue from 'vue'
npm install -g vue-cli
vue init webpack-simple my-app
cd my-app
npm install
npm run dev
Réactivité automatique & optimisée
Virtual DOM
Propriétés calculées & cache
<p>{{ message }}</p>
<script>
app.message = 'Hello world.'
// Do other things
app.message = 'This is awesome!'
</script>
Minimiser les opérations DOM
Diffing très rapide
Moteur de rendu autre que le DOM?
{
computed: {
currentThread () {
return this.threads.find(this.threadId)
}
}
}
Templates, JSX, Hyperscript
Routing
State management
<ul>
<li v-for="task of tasks">
<span>{{ task.text }}</span>
<a v-on:click="removeTask(task)">Delete</a>
</li>
</ul>
{
render (h) {
return <ul>
{tasks.map(task => <li>
<span>{task.text}</span>
<a onClick={removeTask(task)}>Delete</a>
</li>)}
</ul>
}
}
const routes = [
{ path: '/', component: Home },
{ path: '/about', component: About },
{ path: '*', component: NotFound },
]
Dans moins de 30kb min+gzip
vue+vue-router+vuex = 28.11kb
jQuery = 29.41kb
angular2 hello world + tree shaking = ~50kb
en 2012
Première version publique
Version 1.0
Version 2.0
Dans la version 2.x
Render functions
Hyperscript
JSX
Composants fonctionnels
Compilation des templates "Ahead Of Time"
Rapidité du premier rendu de la page
SEO
Progressive enhancement
Progressive Web App
Multiples vues nommées
Comportement du scroll customisable
Liens de routage améliorés
Simplification de l'API
Sous-modules emboîtés
Namespace pour les sous-modules
Actions asynchrones chainables
Déprécié au profil de solutions spécialisées
comme la librairie recommandé
axios
scoped slots
v-model pour les composants
API simplifiés
transitions améliorées
animation de listes
v-else-if
typescript typings
keep-alive conditionnel
github.com/vuejs/vue-migration-helper
vuejs.org/v2/guide/migration
Presque 40 000 stars sur GitHub
1 500 000 téléchargements npm en 2016 (+300%)
21 400 000 visites sur le site officiel
84 000 utilisateurs hebdomadaires des devtools
patreon.com/evanyou
Weex : Rendu natif sur smartphone
Amélioration de la documentation pour les tests
Continuer d'améliorer l'expérience de développement
Améliorer la découverte de l'écosystème
Explorer les technologies web émergentes
conf.vuejs.org
Wrocław, Pologne, Été 2017
La première conférence Vue.js officielle !
@akryum
@vuejs
vuejs.org
vuejs.org/guide
vuejs.org/api
github.com/vuejs/awesome-vue
forum.vuejs.org
medium.com/the-vue-point
vuejobs.com