Changing Nested State in Vuex
I've been updating the Atlanta Code Camp website to improve our administration workflow. With the Call for Speakers coming up soon, I wanted to make sure we had a good way of picking only the best talks.
One of the things I've done is move it to a Single App with Vuex at the center of it. But I ran into an oddity with Vuex that I thought I'd share.
Did Vue.js Just Blink?
There is a lot of buzz around the internet about Vue.js 3.0's announcement about a new composition model. There are a lot of questions about it and I think much of it is 'they moved my cheese' more than 'they're breaking everything'.
So let's talk about it...
Using an InputMask with Vue (e.g. The Vue Ecosystem)
One of the first times I started working with Vue, I was concerned about it's long-term success. I was coming from Angular and their ecosystem is huge.
I was delighted to find that the ecosystem is pretty varied. The Vue website tries to make it easier to find the kinds of libraries and components that you might need. It comes from two places on the website.
Should I Be Using the ASP.NET Core SPA Templates?
I've been writing demos for Vue, Angular, and React for my SignalR micro-courses over on my Wilder Minds site. For Angular and React, I started out with the the SPA templates, but I found them confusing and hard to do a minimal example.
I tend to suffer from "You Moved My Cheese" and wondered if I was throwing the baby out with the bathwater. Let me talk about my experiences creating projects with and without the templates.
Vuex and Asynchronicity
If you're using Vuex for state management in your Vue.js applications, there is a good chance that you need to use async operations (e.g. API calls). I have been doing this a while, but falling back to using Promises in most cases.
As I've been using async/await in C# for a while and wanted to try out async and await in JavaScript. In implementing the change, I thought I'd share how I did this in a simple Vue app.
Vue's Single File Components vs. React's JSX
I have to admit, my first experiences with React several years ago were meet with a lot of cynicism. The idea of mixing JavaScript and Markup made me clutch my pearls to the core.
Now I know that you can use React without using JSX, but I think that is missing the point in a lot of ways. Of course, I'm not a React expert so I am sure you'll let me know how wrong I am ; )
Creating a Vuex Plugin
If you're building larger scale Vue objects and you're not using Vuex to centralize your state, please stop and go learn Vuex. Really.
For those of you still here, sometimes it's helpful to be able to monitor state changes to perform other tasks. For example, to send messages or communicate with servers that aren't about state (e.g. SignalR is a good example). That's where Vuex plugins come in.
A Vuex plugin is a simple function that is called once during the setup of a Vuex store. Typically you'd just create the function/arrow function taking an instance of the store:
export default store => {
};
Inside the function, you just want to subscribe to changes to the store as you need. An easy way to think about this is to use subscribe to a mutation:
A Vue to a Skill - New Article in Code Magazine
I'm back writing again. I've missed it. You'll see more and more articles in different publications from me in the near future.
The first of these articles is for Code Magazine. It's a quick overview of how Vue works and how you can use it for more than just SPAs. Check it out here:
Vue.js Presentation at the Atlanta .NET Users Group
I had a great time presenting to the Atlanta .NET Users' Group last night. I talked about where I think Vue.js.
I got to espouse my opinion (again) about SPA being large monoliths instead of building 'islands of functionality'. I learned a new achronym too, "Multiple Page Apps" or MPAs for this type of client-side dev.
Should You Be Using the Vue CLI?
The Vue team has been working hard. Much like Angular, the Vue team has a command-line interface (CLI) to help develop projects with Vue.
If all you're doing is building a SPA, the CLI can really help simplify setting up a project. But is that all you should be doing with Vue?
Talking Vue with .NET Zuid
If you're not in the south part of the Netherlands, you might have missed my most recent appearance last night. Great hosts, guests and sponsors make the night and easy and fun talk.
After a long day at Techorama NL, I was whisked away to Eindhoven for a talk at the .NET Zuid group (e.g. Southern .NET Group). I was able to show them the basics of Vue.js and pontificate about my continued hatred of the phrase "Single Page Applications".
The Reports of the Death of JavaScript are Greatly Exaggerated
Not John BoltonThe notorious quip by Mark Twain came to mind today as I was reviewing comments to my recent blog post about Blazor, a lot of the comments talked about WebAssembly being the death of JavaScript.
The fact is that we've all been here before. In fact, we've been here many times. And I, for one, don't want to simply see WebAssembly as something to replace JavaScript. Here are my thoughts.
Who is Blazor for Exactly?
In case you haven't been following the news about WebAssembly (e.g. WASM), it's a new way to build something akin to bytecode for the browser. The latest versions of most browsers now support it including Chrome, Firefox and Edge.
Microsoft has built an experimental release of something called Blazor that builds web projects in WebAssembly so you can write all your code in C#. But after playing with one of the builds, I'm starting to think about who this really is for. Let's delve into what WebAssembly is and then how Blazor works to explain what I think.
Kansas City Developers Conference
So KCDC is over for another year. This was my first year at the event and the organizers made me so welcome. Highly recommended!
I had the opportunity to teach both VueJS and Visual Studio Code for the attendees. As promised, here is the code and the slides from the event!
Why I Moved to Vue.js from Angular 2
I know I’m going to upset some people, but hang in and read the whole article…really. In updating my blog recently, one of the changes I wanted to make was to update my use of the JavaScript framework I used for the contact page.
When I built this blog, I wanted to get comfortable with Angular 2. I shoehorned Angular 2 into the contact page as an excuse to use it. Never a good decision.
How'd You Build That Map?
When I started the Wilder World Tour, I built a simple map so my Mom could know where I was during the trip. I thought others might be interested too.
I’d been meaning to find an extra day or two to wrap this all in a little wrapper and share it. I finally found time the last couple of days. The result is travelMap, a library that allows you to build your own travel maps including showing current location, lines between locations, and popup information about each stop.
AngularJS and VS Code in Singapore
I’m currently in southeast Asia for my world tour. While in Singapore, I had the pleasure to chat with a great group of developers about AngularJS.
I love when I get great questions and the developers at this event were really keyed into the web stack and asked the hard questions about AngularJS (and of course AngularJS 2.0).
Visual Studio and WebStorm: Am I Mad?
I might be. In many of the projects I help with we have to handle back-end and front-end coding for web projects. This means I need the best in breed in tools no matter where I’m writing code.
In many cases this is Visual Studio. I love this tool and have for years. While it’s not without it’s own foibles, it does most things really well. But not everything.
My New Course: WebStorm Fundamentals
Last week my seventeenth course for Pluralsight! I love building content for Pluralsight and it allows me to teach technologies that I am utilizing in my own life. This new course is no different.
The new course is all about using WebStorm 9 to build web applications. The course was built using the WebStorm 9 EAP so I was able to cover new features as well as the basics.
It Is Too Soon to Panic on AngularJS 2.0
So AngularJS team finally is talking more publically about what they’re trying to do. At the ngEurope conference last week, they talked very opening about their new strategy for AngularJS 2.0 and it has a lot of people freaked out. Sounds a lot like some reaction to Silverlight in fact.
I’m seeing a flood of hate on the AngularJS team at the moment. I am not sure it is justified. Here’s why:
New Course: Front-end Web Dev Quick Start
It’s that time again. I’ve recently released a new course on Pluralsight. This time I tackle Web Development for complete beginners.
If you are a developer who wants to move from either back-end development or from desktop development to client-side web development, this course may be for you. The concept around the course is to get you up to speed with the very basics of web development in a short amount of time. In fact, in just over three hours, you should be able to get a basic understanding of web development.
It Is Time to Learn JavaScript
JavaScript is having a great year. With the continuation of web development, Node.js, and even Apple adding JavaScript as a replacement for their AppleScript.
You may be waiting until you have to learn JavaScript, but maybe you should learn JavaScript to make you a better developer. Let me pitch it to you:
Choose Your Own Adventure with Node.js View Engines
As some of you know, I’ve been delving into Node.js for a new Pluralsight course that is coming out soon. One of the interesting aspects to me is the idea of server-side view engines. As an ASP.NET (and ASP before that) guy, I’ve been using server-side view engines for a long time…not that we always called them that.
Most Node.js templates out there (including the Express.js application template that ships with the Node.js Tools for Visual Studio) includes the Jade View Engine.
Node.js and Visual Studio? Sure!
I’ve been working on a new course for Pluralsight on “Node.js for .NET Developers”. It’s been a fun course to write and one of the aspects of the course that I find interesting is that the open source Node.js Tools for Visual Studio plugin actually works really well.
What I particular like is that it doesn’t change the way you use Node.js – it can live side-by-side with command-line tooling like NPM, Bower, or even node.exe. It doesn’t try to do more than it should.
Why is DOM-Centric JavaScript Hard to Test?
While producing my recent course on Large Scale JavaScript, I was digging into the testability of JavaScript. So much of the JavaScript I see out there continues to be jQuery driven, DOM-centric JavaScript.
Sure, many of my readers are moving towards AngularJS, Ember and other client-side libraries that encourage modularization, testability, and separation of concerns, but not all web developers are. Ultimately we need to test our JavaScript no matter what the nature of it is.
My Courses
| Vue.js by Example (New Lower Price) |
| Bootstrap 4 by Example (New Lower Price) |
| Intro to Font Awesome 5 (Free Course) |
