← Go back

89Tuesday, April 10, 2018
Vue-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

vue-cli-3x 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

https://github.com/Beg-in/vue-babylonjs

A ready-to-go 3d environment for Vue.js using Babylon.js.

GitHub - isaaclyman/Viano

https://github.com/isaaclyman/Viano

A toy that lets you write songs using Vue components.

GitHub - Botre/vue-connection-listener

https://github.com/Botre/vue-connection-listener

Vue event bus plugin listening for online/offline changes.

GitHub - pqina/vue-filepond

https://github.com/pqina/vue-filepond

🔌 A handy FilePond (upload anything library) adapter component for Vue