Nuxt - How can I run a code in client-side after server-side-rendering?

Question

I created a plugin injecting a noty (https://ned.im/noty/#/) so I can use it globally, it looks like this:

export default ({ app }, inject) => {

    const notify = function (options = {}) {
        if (process.client) {
            new Noty(options).show();
        }
    }

    app.$notify = notify;
    inject('notify', notify);

}

This plugin shows a noty only on the client-side. On the server-side a noty does not appear, cause it can be displayed only in browser. I have a page with product details and I am receiving data in asyncData method. When the product was not found I would like to show a noty with proper message and redirect user to a product list page. When I change a route in client-side everything works awesome. However on the first page load (eg. I change an url manually in the browser) which happens on the server-side a noty does not appear, only a redirect works. My question is: how to show a noty in this case? How to create a noty in the browser after SSR or what is the best other solution to my problem?

Is there any way to run some code after client-side is already rendered (after server-side-rendering)?

Answer 1

Okay, I found a module for that: https://github.com/potato4d/nuxt-client-init-module