In a new project, I’ve been working on a user profile page. I want to persist the form data from the Vuex Store even after a user reloads the page, and also want to clear it out at will or on logout. I want the user to be able to fill in their profile details, reload the page, and return to find each form field still populated with their filled-in data.

Vuex-persistedstate is an npm-package that lets us store our Vuex state into localStorage or cookies.

Completed project 🌱

Repo 🌱

Installation

  1. Add Vuex-persistedstate to your project.
yarn add or npm…


In this article, I am going to show you how to connect to a Graph-Ql API in your Nuxt.js Project.

Final Project & Github

Why Graph-QL? In a nutshell, GraphQL is a query language with an easy syntax that describes how to ask for data, and is generally used to load data from a server to a client. It lets the client specify exactly what data it needs. It makes it easier to aggregate data from multiple sources. It uses a type system to describe data. For a deep dive I recommend reading the official documentations.

To get started, we need to install a few things.

  1. Install a new Nuxt.js…


When you want to show your app to someone but don’t want or can’t deploy it. If only they could see your browser in dev mode to help fix that error showing in the console or see your new design and ok it. — Debbie O'Brien

Introducing nuxt/n-grok. ngrok exposes your localhost to the world for easy testing and sharing! No need to mess with DNS or deploy just to have others test out your changes.

Quick guide

  1. Add @nuxtjs/ngrok dependency using yarn or npm to your project
yarn add @nuxtjs/ngrok

2. Add @nuxtjs/ngrok to the buildModules section of your nuxt.config.js

buildModules…


Let me show you how to move everything out of an overcrowded root store file into separate easier to maintain module files.

Using a store to manage the state is important for every big application. That’s why Nuxt.js implements Vuex in its core. In this article, I’m assuming you have a single store/index.js handling all of your state. This is the Classic mode. When starting out and learning, it can be easier to choose this.

However, when the project starts becoming bigger this single file will inevitably start getting long, crowded, and hard to maintain. To avoid all this drama…


In this article, you’re going to learn how to set user roles using Auth Custom Claims and store user data to the Cloud Firestore when a new Firebase user account is created.

In addition, I will be showing you how to guard routes based on user role when signing in.

Finally, I will show you how to get all the user accounts when the signed-in user has admin privileges and I will show you how to change user roles using callable Cloud Functions.

These are the 3 user roles we’ll be creating:

  • The Admin role will have access to all the users stored on the database and will be given permission to change user roles using Security Rules.
  • The Customer role will have access to Customer View and it will be set…


I’ve always been creative and resourceful. In 2008 while in high school, I joined a band. We got signed to a record label and almost became famous. On a broken Acer laptop that my father gave me, I produced our instrumentals. The laptop had issues, so I taught myself how to repair computers. In 2014, I was no longer part of the band. I started a fashion business alongside my father. We manufactured custom bomber jackets from bales of sample fabrics. The design and procurement of raw materials were one of my many roles. I built our online store using…

Alex Kasongo

Hi, my name is Alex. I’m a front-end engineer, passionate for the web, responsive design, & typography.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store