Better Application Acceptance With LogRocket

Application Acceptance

The application acceptance or testing, is a critical stage for any project. The success of your project will be decided on this stage. Too long and you lose much time and time can to be money. Too short and potentially you will have many errors in production.

Application acceptance can be between 20 and 40 percent of your project. So you must have best processes and methods to realize it. I say this because this tool presents here, can to be helping you but isn’t a miracle to realize good testing stage. We must have the better testing process or an expert in this domain!

What is LogRocket?

LogRocket is a helper tool to show using of your application. You can see all users and all interactions between your users and your application. Permit to analyse and understand how your application it used and how users make test, check page, scroll…

LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster

Why to use LogRocket?

I have identified 3 best using:

Anomaly never reproduce? You can check the session of your users to understand, communicate and solve error.

At some time, I have delivery an application and we have started the testing stage. My client hasn’t never made test before. So I create an organisation and process to have the best application acceptance and best feedback. Some time after beginning, He pushes ticket that say:

“I have an error when I try to create many users. But this error doesn’t replay all time”

I think that you can understand. So I try to reproduce the error on my local but impossible. Dammit, LogRocket at this moment of the project isn’t deploy on the application :’(.

Screen shot, log, store… You have many tools to check your application and how user uses it.

You can check your application used and have sate of your application at any time. You can detect error logs or errors API… Their customer services can automatically create a ticket, Trello task or others. It’s the power and you will won many time :D.

The last point and it’s very good tools:

Mode LIVE to see tests realized by a user

When your users tests your application, LogRocket propose LIVE mode. You can see in live all actions made.

If I take an experience of myself, my client call me and tell me: “this feature never works”. I try to reproduce the error, but there aren’t anomalies in my local. So, I call back to my client and say, “can you try to test now?”.

He begins the test and I use LIVE mode to check theses actions, moves, anything can to understand how he can have an error. After checking, I see the problem, I fix it and most important, I make a communication on the true error and action to fix it.

How to add LogRocket on your VueJs application

It’s very easy to had this application on your project! You can start by register you on the LogRocket web site and create your project.

VueJs

Get npm package

npm i --save logrocket

Import and init the package. In my application I have add this in mutation of my “vuex” store because it’s the start point of my application. Don’t forgot to check NODE_ENV because we can see after that this application can to be used only on testing stage.

import LogRocket from 'logrocket';
if(process.env.NODE_ENV === "development") {
    LogRocket.init('your_logrocket_project/your_logrocket_appli');
}

Next stape it’s init and send user information. Here I have choose to add name, email, subscriptionType and accessToken. But you haven’t limited on data to send to init user. identify function can permit at LogRocket to identify user session played.

if(process.env.NODE_ENV === "development") {
    LogRocket.identify(authUser.id, {
        name: `${authUser.firstName} ${authUser.lastName}`,
        email: `${authUser.email}`,

        // Add your own custom user variables here, ie:
        subscriptionType: authUser.roleId,
        accessToken: localStorage.getItem('token')
    });
}

Vuex

And to finish you can go more. You can add vuex plugin to have all mutations of your store. For this install package `logrocket-vuex`.

import createPlugin from 'logrocket-vuex';

Import and init the package.

import createPlugin from 'logrocket-vuex';
let logRocketPlugin = null;
if(process.env.NODE_ENV === "development") {
    LogRocket.init('publicis/publicis');
    logRocketPlugin = createPlugin(LogRocket);
}

And add the init package in vuex plugin.

if(process.env.NODE_ENV === "development" && logRocketPlugin) {
    storeConfig.plugins = [logRocketPlugin];
}

It’s all, it’s finish :D Now you can connect to your LogRocket account and test it.

GDPR

Yes, I know, but I must talk this because it’s very important to understand the stakes.

Private indivudual

Yes, this application can to be affect a private life. At finally you are a «spy»!

Data protection

You never had master data in your staging server. So when your data are fake, you can use this package without problems. Else if, you should have procesess to create a staging serveur with fake data and use LogRocket on it.

Never use LogRocket on the master server!

Thanks for your time :D