← Go back

96Tuesday, May 29, 2018
Reminder: One week left until Vue Contributor Day! Slides from Vue.js Roadtrip Barcelona; Announcing Saber.js and more...

If you’re interested in contributing to the Vue ecosystem, better start planning your schedule for next Wednesday because Vue Contributor Day is just around the corner.

EGOIST, who you might know as a notorious library author (600 repositories and counting) has released a new framework called Saber.js for building static websites based on Vue.js. It works similar to VuePress though it’s probably more for general use cases as it does not enforce any theme system.

Also, Krutie Patel made an awesome diagram describing all the lifecycle hooks in a Nuxt.js app.

Enjoy!

— Damian Dulisz


Stories

VuePress v0.10 released

VuePress got a few new releases recently. The most important changes: VuePress now uses Babel 7 and the rebuild performance has been greatly improved thanks to caching.

Reminder: Vue Contributor Day in just one week! June 6th, 2018

Just a quick reminder – just one week left until the first Vue Contibutor Day. Sign up and be here on June 6th, starting at 6:00 am PDT. The event includes: community updates on tooling, education, mobile development as well an AMA with the attendees.

Nuxt.js Lifecycle Hooks diagram

Here’s a missing piece of the Nuxt.js docs – a diagram that takes you through all the lifecycle hooks in a Nuxt based applications. Created by the awesome @krutiepatel.

Announcing Saber.js

A minimalistic framework for building static websites using Vue.js

  • Zero-config
  • File-system based API, like Next.js and Nuxt.js
  • PWA by default
  • Simple but pluggable
  • Prefetch data using custom block

New Documentation – Ream

Ream is a universal applications framework on top of Vue.js. It is similar to Nuxt.js in that it makes it relatively simple to build SSR based applications, though it follows a more low-level approach.

Vue.js Roadtrip Barcelona – Animate Much More – Slides

Slides from a recent talk by Posva about Animations in Vue.js. In this presentation, Eduardo goes not only through the CSS based transitions but also how to work with state transitions. You will also learn about the difference between tweening and springs usage for your animations.

Vue.js Roadtrip Barcelona – How Vue and GraphQL can evolve your development workflow – Slides

Guillaume Chau is probably the go-to person when it comes to using GraphQL in any Vue application and those slides will show you what you can gain by using GraphQL (and Apollo).

Hello Protovue — Prototyping Component Framework for Vue.js

A very interesting take on "in code" prototyping that should make possible to create working prototypes in a matter of minutes. Those prototypes can be used as a bridge between developers and designers without having to worry about implementation details.

Unsung Heroes of Vue: Natalia Tepluhina

John from oneminutejs, has recently started a new series of interviews with the unsung heroes of the Vue.js community. In this article, he’s exploring the story of Natalia Tepluhina, who most recently became the CTO of Vue Vixens.

Create & Publish Web Components With Vue CLI 3

Web Components might or might not be the future of web development. In this article Anthony Gore explains how to use the @vuejs/web-component-wrapper library to wrap your Vue component in a web component that can be used outside of Vue.js based apps. Or more precisely, without writing any Vue.js specific code. You still have to provide a script link to the Vue library itself.

Reactive Firebase Auth with Vue

Here’s a short and to the point tutorial on how to implement authentication with Firebase as the provider. The end solution is a Vue.js plugin that uses Vuex to manage the authentication status. It also includes some tips on how to control access to different routes based on user auth.

Making a scrolling card list

Ever thought about animating a list with appearing/disappearing elements when scrolling? Keep in mind that it is a transition that can be paused if the user stops scrolling. In this article Eder Diaz explains how to build such a list by using a combination of a custom directive, filters and math.

Building a Real-World Web App With Vue.js & Firebase

Here’s an exceptionally long guide to building a real-life web app with Vue and Firebase. Hence, there’s even a table of contents! However, if you’re looking for a guide that takes you from the very beginning through most of the building process, this one might be for you. It comes together with helpful links to selected parts of different docs that will help you understand everything this is happening and a repository where you can preview the complete project.


Libraries

GitHub - tralves/groceries-ns-vue

https://github.com/tralves/groceries-ns-vue

🍏🍍🍓A NativeScript+Vue iOS and Android app for managing grocery lists