89Tuesday, April 10, 2018Vue-cli 3.x Sneak Peek, New Vue.js docs update, How to use render props and scoped-slots together and more!
Hello!
Last week, you might have seen a pretty viral tweet by Guillaume Chau giving a sneak peek of a project he’s been working on recently. For those of you wondering what exactly is it gonna be – that’s the new interface for Vue-cli 3.x.
Here is a comment by Guillaume about the incoming changes to the Vue-cli:
Vue-cli 3.x is a complete rewrite, with a lot of new awesome features. You will be able to select features like routing, Vuex or Typescript, then add and upgrade building blocks called "vue-cli plugins". But having so much more options also means the tool is now more complex and harder to start using. That's why we thought having a full-blown GUI would help discover the new features, search and install vue-cli plugins and unlock more possibilities overall while not being limited by a terminal interface. To sum up, vue-cli will not only allow you to bootstrap a new project easily, but it will also remain useful for ongoing work afterwards! — Guillaume Chau
Starting new projects with Vue-cli 3.x
Truth be told, I’m not sure if this can be called a CLI tool anymore. 🤔
Enjoy!
— Damian Dulisz
Stories
Programmatic Event Listeners — Vue.js Documentation Update
After a recent discussion on Twitter on how to programmatically register listeners to lifecycle hooks, the solution pictured above is now documented in the Vue.js docs thanks to Chris Fritz. 🎉
Methods, Computed, and Watchers in Vue.js
Do you feel like you still sometimes confuse when to use computed properties and when watchers? Or maybe there’s someone on your team that has this problem? Help yourself and read this article by Sarah Drasner explaining the different use cases for each of those functionalities.
Integrating Apollo with Vue and Vuex
GraphQL is a really fascinating technology, however, when used with Apollo it truly becomes powerful. Things like reactively syncing the state from your server with all clients become a breeze. In this tutorial, you will learn how to integrate Apollo with Vue and Vuex.
Leveraging Render Props in Vue
Render Props is a technique that gained lots of traction in the React world. However, as you might already know, render props are quite similar to what Vue calls scoped-slots. In this article, Dillon Chanis gives a detailed explanation on how to use render props in Vue and how do they compare to scoped slots. There are even examples of how to use both of those techniques together.
A deep dive in the Vue.js source code: Table of contents
For those of you interested in diving into the Vue.js source code, here’s the table of contents of a recent series that does just that. So far it covers 17 topics.
Vue CLI 3 — The Deep Dive
Obaseki Nosa explains precisely what has changed and how to take advantage of new features of the Vue-cli 3.0. Read this to learn more about the new plugin based architecture powering the new Vue CLI.
VueConf 2018 was awesome!
John Bintz gives a nice summary of his impressions from the recent VueConf US conference in New Orleans. If you missed it this year, make sure you show up next time!
Libraries
GitHub - Beg-in/vue-babylonjs
A ready-to-go 3d environment for Vue.js using Babylon.js.
GitHub - isaaclyman/Viano
A toy that lets you write songs using Vue components.
GitHub - mattrothenberg/vue-storybook
Custom <story> blocks for Vue single file components.
GitHub - Botre/vue-sauce
"View source" mixin for Vue.
GitHub - Botre/vue-connection-listener
Vue event bus plugin listening for online/offline changes.
GitHub - pqina/vue-filepond
🔌 A handy FilePond (upload anything library) adapter component for Vue
