A View to Vue.js

This article is featured in the new DZone Guide to Web Development. Get your free copy for more insightful articles, industry statistics, and more!
If you’re like me, you’ve likely been bombarded over the past few years by Angular and React content. Every other blog entry, conference session, or keynote seemed to be focused on either of the two. With that context in mind, I can still remember the first time I saw a “Vue.js” talk listed on a conference schedule. While I certainly do not pretend to know everything, at least when it comes to buzzwords and the such, I was pretty sure I had heard of most of the popular front-end frameworks out there and this was one I had decidedly not heard of.

Link: https://dzone.com/articles/a-view-to-vuejs?utm_medium=feed&utm_source=feedpress.me&utm_campaign=Feed%3A+dzone%2Fwebdev

4 AJAX Patterns for Vue.js Apps

If you ask two Vue.js developers “what’s the best way to use AJAX in an app?" you’ll get three different opinions.
Vue doesn’t provide an official way of implementing AJAX, and there are a number of different design patterns that may be used effectively. Each comes with its own pros and cons and should be judged based on the requirements. You may even use several simultaneously!

Link: https://dzone.com/articles/4-ajax-patterns-for-vuejs-apps?utm_medium=feed&utm_source=feedpress.me&utm_campaign=Feed%3A+dzone%2Fwebdev

Creating a Real-Time Data Application Using Vue.js

Vue.js is gaining popularity in the JavaScript community because it is simple and easy to get started with. Vue.js is powerful and with a few lines of code you can achieve a lot.
Pusher makes building real-time applications super easy, and we can easily plug it into a Vue.js app to give our users a great experience.

Link: https://dzone.com/articles/creating-real-time-data-aapplication-using-vuejs?utm_medium=feed&utm_source=feedpress.me&utm_campaign=Feed%3A+dzone%2Fwebdev

Vue.js + Brunch: The Webpack Alternative You’ve Been Hungry For

Imagine if there was a build tool that you could use for Vue.js projects that compiled faster than Webpack, gave you a smaller bundle size, and required only a few lines of configuration.
Brunch is that tool. In this article, I’ll show you how incredibly easy it is to set up a Vue.js + Brunch project, cover some of the pros and cons of Brunch, and serve up a few tasty brunch puns on the way.

Link: https://dzone.com/articles/vuejs-brunch-the-webpack-alternative-youve-been-hu?utm_medium=feed&utm_source=feedpress.me&utm_campaign=Feed%3A+dzone%2Fwebdev

Vue.js 2.5 Released! How Your Business Can Benefit

Vue.js released its latest version, Vue 2.5, just a few days back. It comes with many new features including improved TypeScript and Error handling, improved tooling support, environment-agnostic server-side rendering, and much more that gives you many business benefits. This release contains awesome improvements to help Vue.js developers and to keep things better.
Major Improvements Along With Its Business Benefits:
Better Error Handling
In its previous versions, we’d typically use config.errorHandler and the renderError component option for handling errors in the applications. But we were lacking methods for handling generic errors inside a specific part of the application. So, a new errorCaptured hook has been introduced in this version. A component with this hook captures all errors from its child component tree.

Link: https://dzone.com/articles/vuejs-25-released-how-your-business-can-benefit-fr?utm_medium=feed&utm_source=feedpress.me&utm_campaign=Feed%3A+dzone%2Fwebdev

Migrating a Vue.js App to Vuex

One of the difficult things about getting started with Vuex is that it is not so much a library as it is a design pattern. It follows that implementing Vuex is not so much about using an API, as it is about structuring your code to comply with the pattern. If you’re new to Vuex, this will be daunting.
In this article, I’ll demonstrate how to get started migrating Vuex into an existing Vue.js project. I’ll show you how to identify the parts of your app’s state that belong in Vuex, and those that don’t, how to refactor your component functions into mutations, actions and so on, and finally we’ll discuss the benefits accrued.

Link: https://dzone.com/articles/migrating-a-vuejs-app-to-vuex?utm_medium=feed&utm_source=feedpress.me&utm_campaign=Feed%3A+dzone%2Fwebdev

Avoid This Common Anti-Pattern in Full-Stack Vue/Laravel Apps

If you want your Vue.js single-page app to communicate with a Laravel backend, you will, quite reasonably, think of using AJAX. Indeed, Laravel comes with the Axios library loaded in by default.
However, it’s not advisable to use AJAX to retrieve application state on the initial page load, as it requires an extra round-trip to the server that will delay your Vue app from rendering.

Link: https://dzone.com/articles/avoid-this-common-anti-pattern-in-full-stack-vuela?utm_medium=feed&utm_source=feedpress.me&utm_campaign=Feed%3A+dzone%2Fwebdev

How to Publish Your Vue.js Component on NPM

You’ve made an awesome component with Vue.js that you think other developers could use in their projects. How can you share it with them?
In this article, I’ll show you how to prepare your component so that it can be packaged and published on NPM. I’ll use an example project and demonstrate the following:

Link: https://dzone.com/articles/how-to-publish-your-vuejs-component-on-npm?utm_medium=feed&utm_source=feedpress.me&utm_campaign=Feed%3A+dzone%2Fwebdev

JavaScript Frontend Framework CLI Showdown

Many modern JavaScript frontend frameworks are complemented by a standalone Command Line Interface (CLI) program that assists with setting up a suitable development environment. Since many developers who work with Stream also use one or more of these frameworks, we like to stay up to date. We’re also happy to pass on what we’ve learned. This post offers both rookie and veteran developers a breakdown and comparison of the CLI programs available for Angular, React, and Vue. The aim is to help new developers understand the benefits and tradeoffs associated with using a CLI tool as opposed to setting up the associated tooling from scratch. Experienced developers will appreciate a quick, yet thorough and independent comparison to refer to. This isn’t a benchmark and there isn’t a winner announced; as with most tools, it is a case of “horses for courses."

Link: https://dzone.com/articles/javascript-frontend-framework-cli-showdown-1?utm_medium=feed&utm_source=feedpress.me&utm_campaign=Feed%3A+dzone%2Fwebdev

The Lazy Developer’s Guide to Authentication With Vue.js

I’ll happily admit that like many of you, I’m a lazy developer. I tend to look for solutions someone else has already built before I try to build them myself. In the “old days” of the early 2000s, I used to spend a lot more time coding solutions myself. But today many solutions to coding problems are just a keyword search away. In that spirit, I approached this tutorial using keywords – looking for existing solutions first, then fitting my favorite solution on top of it. I think you’ll like the results!
When I started writing this article, I wanted to show you how to add authentication to a Vue.js app. I started learning Vue.js back in April while authoring my Front End Development for Back End Developers presentation. I bought a pro subscription to Egghead.io and watched Build Vue.js Apps with the Vue-CLI and Nuxt.js by @johnlindquist.

Link: https://dzone.com/articles/the-lazy-developers-guide-to-authentication-with-v-1?utm_medium=feed&utm_source=feedpress.me&utm_campaign=Feed%3A+dzone%2Fwebdev