I have a VueJS SPA in which I have defined a build version that I can easily access as a javascript variable.
I have used VueGtag (https://github.com/MatteoGabriele/vue-gtag) to integrate Google Analytics with my SPA. I would like to view reports in Google Analytics for build version, so I can keep track with version adoption.
I've read about Custom Variables, but I can't see to get this to work and passed over to Google Analytics. Here is what I have at the moment:
Vue.use(VueGtag, {
config: {
id: "UA-XXXXXXX-X"
},
}, router);
And in my main App.vue, I have this in mounted():
this.$gtag.customMap({ 'dimension1': 'version' });
this.$gtag.event('version_event', { version: buildTs });
I have already confirmed that buildTs exists and is accessible in App.vue. However, I don't see any reporting of 'version' in GA.
You need to go into GA and under the settings for that property, create a new dimension to track the version.
Take note of the "index" of that custom dimension. It will represent "dimensionX", in your gtag code.
Also, I'd recommend to pick the "session" scope, this just means that the dimension will be the same for the whole session. More info on scope: https://support.google.com/analytics/answer/2709828?hl=en
Related
I'm using Nuxt 2.15 with target: "static" and hosting on a shared hosting "hostinger". I fetch the data from an external API using axios and Vuex state management and here comes the problem where the app doesn't load the new data it gets from the API.
How can I make the app rerenders its data and output the newly updated data it gets from fetching the API?
I assume you are using nuxtServerInit or asyncData for getting the data from API. This used with static mode means that data is get only during generation. Which is great for not too often updated content because it doesn't have to connect to server every time it's faster.
Depend on your needs you can:
Get data from API in mounted() hook this will get data from API every time the page is loaded BUT it also means that it could be loaded with some delay and it probably wouldn't be indexed by search engines
You can go with universal mode (https://nuxtjs.org/docs/configuration-glossary/configuration-mode/) and start your site on node.js server which will use up-to-date data from API each time user will open your site.
EDIT: as #kissu corrected me in comment this one is deprecated, please use this one: target:'server' instead of target:'static', which is default so you can just remove this line (https://nuxtjs.org/docs/configuration-glossary/configuration-target/ )
Newbie to this whole analytics thing and am finding this very confusing
I wanted to use Google Analytics 4 in my nuxt ssr webapp and am feeling overwhelmed with the number of options
Quick issue on nuxtjs/google-analytics says it does not support GA4 and is asking me to use nuxt/gtm
stackoverflow answer on the same question says use vue-gtag
Google's documentation says it covers analytics ads etc
nuxt/google-gtag seems to be another library apart from vue-gtag and nuxt/gtm
what am I even supposed to use?
I just want to integrate Google Analytics 4 on my nuxt.js SSR app
Create a GA account and a GA4 property if you have not already. Keep a note of your Measurement Id (the "G-" Id). The same page can help you to find the id.
Use nuxtjs/google-gtag. Page includes setup help.
When passing the config in your code, use this format:
// example config
'google-gtag':{
id: 'G-XXXXXXXX', // your measurement id
... // rest of the config
}
Just to compare, for Universal Analytics (the previous version of GA), the Id would look like UA-XXXX-XX, instead of G-XXXXXXXX. Learn more with Google Analytics 4 properties tag and instrumentation guide.
Before writing too much code, I thought I'd conceptually understand whether what I am doing is correct.
I have some components, that import a mixin. The mixin has a web api call to retrieve the some links from the (HATEOAS) API, so the UI can use the links without forming its own links. These would look something like:
[
{
"Rel": "GetSupportingData",
"Href": "https://api.com/SupportingData"
},
{
"Rel": "Search",
"Href": "https://api.com/Search"
}
]
So the MIXIN has a method called GetLink("Search") that would retrieve the links from the API and return the link requested.
This is all ok, but as the mixin is imported to a lot of components, I don't want each time its used to make the WEB API call to get the links before filtering them. I was therefore wondering if I should use Vuex to manage the state of the links and retrieve them if the store count was zero?
The examples of Vuex I have seen instantiate it on the component, so what I'm doing feels like it may not be correct.
You can store the web api links to store that is one approach, but when you refresh the page again the store needs to be filled with the api links
So, the alternate approach is to use localStorage or indexedDB of browser
Everytime when you load the application first it goes to localstorage or indexedDB and checks for the api links. If its present, it restores to Vues store. Or calling mixin method to fetch api links and loads to browser storage and vuex store
I'm finding conflicting information on creating one time use deep links.
expire desktop_url generated through branch SDK after one time use
The documentation on "type" says "Must be an int. Set to 1 to limit deep link to a single use. Set to 2 to make the link show up under Quick Links while adding $marketing_title to data. Does not work with the Native SDKs." (https://docs.branch.io/links/integrate/)
I created a link using the included JSON with a POST to https://api2.branch.io/v1/url.
{
"branch_key": "*********************",
"data": {
"entityId": "282fd3da-5200-45f4-80a2-4f3a1c36bff6",
"$link_exp_date": 1567271700000
},
"type": 1,
"feature": "test_feature",
"tags": []
}
I expected the URL to be available for one time use. However I am able to successfully use the link multiple times until it expires. And retrieving the link using GET https://api.branch.io/v1/url doesn't return any properties that indicate the link was used.
Even before creating a deep link and testing, you need to integrate the Branch SDK in your respective app (Android, iOS etc).
The simple way to create a deep link is via dashboard and test this when the app is installed.
I am creating a state machine for YouTrack using JavaScript, and am trying to send an email to everyone in a group. In the old Workflows, this was done like this:
{group:PHP Developers}.notifyAllUsers("Subject","message");
I can't find anything in the new JavaScript API to do this, where can I find the global (not issue or project) groups?
In JS API it will look as follows:
entities.UserGroup.findByName('PHP Developers')
.notifyAllUsers('Subject','message');
However, another (and way more reliable) way to get a particular user group is to add it to requirements and the reference inside the code:
ctx.phpdevs.notifyAllUsers('Subject','message');
...
requirements: {
...
phpDevs: {
type: entities.UserGroup,
name: 'PHP Developers'
}
}
You may find more details in official documentation: UserGroup and Finding Specific Entities.