106Wednesday, August 8, 2018
Updates from the Vue Sprint; Vue.js Summit in Säo Paulo, Brasil announced; VueConf TO tickets available now;

Hey there,

the Vue.js Sprint has already ended – it was truly a amazing week. 8 people, 6 days, ~10h of work per day). We managed to make significant progress on several projects, most notably, but not limited to, the Vue Devtools.

There’s also an updated version of the this website where you can now search through all the stories we published. See Search link in navbar.

Other projects like the eslint-plugin-vue have also seen additional improvements.

We also managed to organise a rather large meet-up for the local community which gathered around 130 people. Talks were recorded and are expected to be published by next week.

All this is thanks to you and your continuous support on Open Collective. 💚❤️💛 I will be writing a more detailed article about what exactly has been done, hopefully by the end of the week.

Great news for everyone living in South and Central America – A new Vue conference called Vue.js Summit is coming to Säo Paulo, Brazil in late August. Check it out!

Also, VueConf TO early bird tickets are available now! Many great talks and workshops there.

— Damian Dulisz

PS Really sorry for the slight delay – moving places is never easy. 🏡


Stories

Vue.js Summit 2018 – August 31st in São Paulo, Brasil

On the very last day of August, probably the biggest Vue.js event in Latin America is comming to Säo Paulo, Brasil. Join to participate in workshops and conference talks. The registration is open now!

Shuffle a Deck of Cards in Vue.js

Shuffling a deck of cards is a great example to learn about Vue transition system, especially the transition-group API. Here’s a nice article that will teach you just that.

Modern component reusability: Render props in React & scoped slots in Vue

One of the issues all front-end developers face is how to make UI components reusable. How do we craft components in such a way that satisfies the narrow use case that is clear to us now, while also making them reusable enough to work in a variety of circumstances?

This is a very good question and Jonathan Harrell suggest to use the render-less component approach as one of the possible answers. The article is especially interesting since it also compares how render-less components can be implemented in both React and Vue using scoped-slots in the latter case.

Managing async operations states in Vue components

Maxim Yelisyeyev has recently released a new plugin called vue-async-operations, which can help you manage state of asynchronous calls inside your component. Along the library, he also published an article that depicts how it can be used to increase your productivity while working with asynchronous data. The API reminds me of Vuelidate somewhat.

Publish a VuePress site on GitHub pages with Travis

Wondering how to connect VuePress based site deployment with Travis? Look no further as Samuel Pouyt has written a nice article about exactly that.

How to Add Structured JSON+LD Data to Nuxt.js

Adding structured JSON+LD data allows your pages to be displayed in Google search results in a more specialised way – like a product or recipe. This might hugely improve your SEO and is quite easily implemented if you’re already using Nuxt.js. Read the article by Matt Hagemann to learn how to make us of it!

Vuex next steps: Namespaces and dynamic modules

Besides the basics, Vuex provides some additional features that can be especially useful inside larger applications. Here, Arik Liber gives a nice introduction to the less known features of Vuex like Namespaces and dynamic modules.

Using schemas to generate your forms with Vue, and more!

Building forms is usually quite easy. Unless – of course – it has to be generated dynamically depending on backend service response. In such cases many developers reach out to schema based solutions. There’s one such solution for Vue called vue-form-generator that can help you with that task. Here’s how to use it.

Build a Project Management Tool with Vue.js, node.js and Apollo

Here’s a rather advanced tutorial on how to build a project management tool using Vue, Node and Apollo.


Libraries

GitHub - rlafranchi/vuex-rails-plugin

https://github.com/rlafranchi/vuex-rails-plugin

A Vuex plugin that easily maps Rails resources to Vuex modules

GitHub - zh-rocco/vue-auto-storage

https://github.com/zh-rocco/vue-auto-storage

An automatic storage plugin for Vue2, persist state in data with localStorage.