I like the why behind Matestack:

Implementing two separate systems (backend-api, frontend-app) is a pain: Two different code bases, two repositories to maintain, two different deployment schedules, two test environments, two everything… Being a small dev team, we decided not to adopt this modern web development complexity and decided to create… Matestack!

If you have 30 minutes and want an easy button to learn all about it, Jonas Jabari gave a talk on it at Ruby Unconf 2019.

Crater is free for life with all of the below features catered towards the freelance and small business community.

This looks really polished. It even has a React Native-based mobile app. That’s a lot!

Built with Vue. Play with the live demo right here.

From Yaser Adel Mehraban on getting started with Vue.js.

Vue.js is an approachable, versatile, performant, and progressive framework to build user interfaces with. This core library is focused on building the view layer only. It uses the goodies of Angular (such as template syntax) and React (such as Virtual DOM) and adds a few more enhancements on top.

… Another bonus point of it is that migrating to it is really easy. You just need to add a script tag to your page and you’re good to go.

Jerod, Divya, & Suz get together to discuss top-level await, the JS13kGames winner, Liran Tal’s is-website-vulnerable, Vue 3’s source code, and Facebook’s take on AR/VR/XR. Plus 3 awesome pro tips you don’t want to miss!

n8n (a numeronym for “nodemation”) is a node-based workflow automation tool. The reason for the square quotes around “open source” is because it has a Commons Clause attached to its Apache 2.0 license, which means you can do anything you want with the source code except make money with it. Since n8n itself is built on open source tech such as TypeScript and Vue.js, this is a nice touch by the author in the FAQ:

As n8n itself depends on and uses a lot of other Open Source projects it is only fair and in our interest to also help them. So it is planed to contribute a certain percentage of revenue/profit every month to these projects. How much exactly is not decided yet.

Vue-next is in “pre-alpha” condition, but the team has achieved most of the architectural goals and new features planned, so the source is now public on GitHub. No word yet on when they expect Vue 3 to be officially released, but you can at least dig in to what they’ve got so far!

{
  "How to use": "Paste your JSON here and press Ctrl+Enter to format!",
  "Help": "Check the console for errors if it fails to parse.",
  "Themes": "Toggle dark/light theme with Ctrl+B",
  "Share": "Print a shareable URL to the console with Ctrl+L",
  "Source": "View the source on GitHub at https://github.com/kritzware/json",
  "Info": "Press Ctrl+I at anytime for a reminder of these instructions"
}

Built with Nuxt.js.

[XSM] consists of a global store and the machinary to re-render the component when the state is updated. The store is just a JavaScript object with key and value pairs. By binding the instance reference, this, to the store, each component can react to the changes of the store whether it is re-render or unmount. It is really this simple, no need to use HOC, provider, reducer, decorator, observer, action, dispatcher, etc. Hence, all the three most popular framewokrs work the same way in XSM and that’s why we can keep the code size very small and support the three frameworks without framework specific modules.

Works out of the box with Angular, React, and Vue.

This is not another “setting up” a new project with Vue and TypeScript tutorial. Let’s do some deep dive into more complex topics that are usually not covered but are totally required in real-life projects.

Real life data on how Google indexes javascript-rendered websites today. This has been a controversial subject, and this article by no means settles it entirely, but provides some strong data for what types of dynamic content are well indexable and which are not.

Though to be honest, I think the most important conclusion the author makes might be this one:

If you need your site to perform on search engines other than Google, you will definitely need pre-rendering of some sort.

KBall and Nick catch up with Nara Kaspergen and Jen Looper for a pair of conversations covering Voice UI Devices, using NativeScript for mobile development, and Jen’s work with Vue Vixens helping make the Vue.js community welcoming to women and non-binary people.

A new static site generator baby is born. It’s highly inspired by Gatsby.js (React based) but built on top of Vue.js

If Gatsby intrigues you, but React isn’t your thing… check out Gridsome. It has the same concept of a universal GraphQL for all of your data sources.

Hot on the heels of Rails’ announced rich text editor comes tiptap for Vue, which is built with Prosemirror. But what does “renderless” even mean?

With renderless components you’ll have (almost) full control over markup and styling. I don’t want to tell you what a menu should look like or where it should be rendered in the DOM. That’s all up to you. There is also a good article about renderless components by Adam Wathan.

That’s a great idea as long as you provide some default/swappable rendering for folks who just want to get started quickly. Full demo of tiptap in action right here.

Just visit web-riimote.herokuapp.com on a laptop/desktop AND a smartphone. Your smartphone will be the controller and your laptop/desktop will be the main display.

You don’t have to install an app or anything. Pretty cool! Video demo here.

A searchable and ranked collection of the best Vue.js libraries. Inspired by Ruby Toolbox and built with Vue (duh) and Rails. Have a Vue project that’s not on the list? Tweet @vuetoolbox and they’ll get you added.

Good news — the next generation of Vue CLI, the standard build toolchain for Vue applications, is here. Evan You writes:

Vue CLI 3 is a completely different beast from its previous version. The goal of the rewrite is two-fold:

1. Reduce configuration fatigue of modern frontend tooling, especially when mixing multiple tools together;
2. Incorporate best practices in the toolchain as much as possible so it becomes the default for any Vue app.

This means that any Vue CLI 3 project comes with out-of-the-box support most of today’s preferred ways to build and ship applications.

This interview with Evan You (founder of Vue.js) is all about the path that led him to being able to work full time on open source. It’s a good read 👍

(Want to dive deeper? We’ve interviewed Evan on The Changelog #184 as well as Request For Commits #12)

Select a device, upload your image, and get a beautiful image you can share with the world.

I’ve been closely watching CodeSandbox and have been thoroughly impressed with the work Ives van Hoorne and the 75+ contributors have put into this online code editor for … React, Preact, Vue, and more.

I’ve been thinking about getting Ives on Founders Talk to talk about the business model behind CodeSandbox. It seems to have this interesting self baked, pay what you want, Patron model to cover the expenses of CodeSandbox. Most of the features are free with limits, and being a “Patron” lifts those limits + extra features, and supports the costs and development efforts.

A free ebook by Flavio Copes. Here’s the skinny:

After spending a lot of time diving into Vue, in preparation for a Vue online course I’m building, I created this free resource that contains a lot of material to help anyone go from zero Vue knowledge to having a pretty good overview of this popular JavaScript frontend framework.

The book’s content is behind a newsletter signup. That’s the price of free, I guess. 🤷‍♂️

Vuido makes it possible to create lightweight, native desktop applications using Vue.js. Application using Vuido can run on Windows, OS X and Linux, using native GUI components, and don’t require Electron.

Emphasis added. Vuido uses libui under the hood to drive its cross-platform GUI components.

Nikita Sobolev:

Optional static typing with flow, jest for unit and e2e testing, docker and gitlab CI, and meaningful docs - is a good recipe for success.

If you agree with 👆, then you probably want to give this a spin.

Here’s a shiny new new project from Vue’s creator. There are plenty of static site generators in the wild, but most of them are created with blogging or generic content in mind. VuePress has a specific angle:

VuePress is composed of two parts: a minimalistic static site generator with a Vue-powered theming system, and a default theme optimized for writing technical documentation. It was created to support the documentation needs of Vue’s own sub projects.

The default theme looks great (no surprise there) and the supporting documentation/story telling around VuePress is quite impressive as well. But perhaps you’re wondering, “Why not $X?”, where $X is a similar alternative. Here’s why.

Unlike the guide which walks you through building a Vue app in story form, the cookbook is all about focused examples of how to accomplish specific goals with the framework.

This is an excellent addition to the compendium of documentation in support of the project, and one that’s worthy of emulation once your framework has a base set of docs that are solid.