Vue.js application development

Nuxt.js overview, running Vue.js on the server to pre-render on the server

(2018-09-03T21:00:00.000Z) Vue.js is an application framework for the front end running inside browsers. It supports building single-page-applications (SPA) or simply enhancing a web page with fancy interactivity. However it isn't always useful to have a big application running in the client. With Nuxt.js the Vue.js code is pre-rendered on the server so that the initial load of the page has already-rendered HTML. Subsequent interactivity on the page is still managed by client-side Vue.js code running in the browser.

Showing a tree structure, like a file-system, in Vue.js

(2018-07-25T21:00:00.000Z) Many kinds of applications show a tree structure of data items, such as files in a file system. Over the last couple weeks I implemented a simple Markdown editor in Vue.js/Electron - and while the sample application did not show a file-system tree a full version of the application would do so. We use this sort of widget all the time in programs and web applications, but do you know how to implement such a widget? Speaking for myself I could probably work it out - it's nested UL and LI elements with some custom styling and whatnot - but I'd rather use a pre-baked tree component for Vue.js instead. The application shown here demonstrates using one such tree component.

Rudimentary form validation in Vue.js with Buefy/Bulma

(2018-07-20T21:00:00.000Z) As a follow-up to Vue.js application development we want to study form validation. That example includes a little form in which we enter some information, and we want a little bit of validation to make sure we don't add bad entries.

Add/remove list items in Vue.js built with Bulma/Buefy

(2018-07-20T21:00:00.000Z) Most applications with item lists you want to add or remove individual items. With Vue.js it's easy and obvious how to render an item list. What's not so obvious is how to manipulate the list afterwards. The Vue.js documentation doesn't say how to remove items or change items.

Getting started with Vue.js application development

(2018-07-19T21:00:00.000Z) Vue.js is an exciting new framework for developing front-end JavaScript applications. It promises to be a "Progressive" web framework, and I don't think they mean in a Political sense but means that Vue.js can be plugged into the part of an application which requires a richer experience. It is also supposed to be Approachable, works directly from HTML, CSS and JavaScript, while being Versatile and Performant. In this example we'll build a starter application, and embed it into an HTML web page. Specifically, this web page.