Skip to content

Commit

Permalink
feat(app): added gtag tracking
Browse files Browse the repository at this point in the history
  • Loading branch information
abedzantout committed Sep 19, 2019
1 parent 8bbf8a4 commit f7f479c
Show file tree
Hide file tree
Showing 4 changed files with 208 additions and 138 deletions.
1 change: 1 addition & 0 deletions core/gtag.ts
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
// Add your GA tracking id here
export const GA_TRACKING_ID = '';

const isProduction = process.env.NODE_ENV.toLowerCase() === 'production';
Expand Down
9 changes: 9 additions & 0 deletions pages/_app.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
import App from 'next/app';
import React from 'react';
import Router from 'next/router';

import { trackPageView } from '../core/gtag';

Router.events.on('routeChangeComplete', url => trackPageView(url));

export default App
62 changes: 62 additions & 0 deletions pages/_document.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,62 @@
import React, { Fragment } from 'react';
import Document, { Head, Main, NextScript } from 'next/document';

import { GA_TRACKING_ID } from '../core/gtag';

type Props = {
isProduction: boolean,
}
export default class extends Document<Props> {
static async getInitialProps(ctx) {
const isProduction = process.env.NODE_ENV.toLowerCase() === 'production';
const initialProps = await Document.getInitialProps(ctx);
return {...initialProps, isProduction};
}

setGoogleTags(GA_TRACKING_ID) {
return {
__html: `
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', '${GA_TRACKING_ID}');
`,
};
}

render() {
const language = 'en';
const {isProduction} = this.props;
console.log(GA_TRACKING_ID, isProduction);

return (
<html lang={language}>
<Head>
<meta httpEquiv="x-ua-compatible" content="ie=edge"/>
<base href="/"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>

{/* Global Site Tag (gtag.js) - Google Analytics */}
{/* We only want to add the scripts if in production */}
{isProduction && (
<Fragment>
<script
async
src={`https://www.googletagmanager.com/gtag/js?id=${GA_TRACKING_ID}`}
/>
{/* We call the function above to inject the contents of the script tag */}
<script dangerouslySetInnerHTML={this.setGoogleTags(GA_TRACKING_ID)}/>
</Fragment>
)}

</Head>
<body>
<Main/>
<NextScript/>

</body>
</html>
);
}

}
274 changes: 136 additions & 138 deletions utils/contentful.js
Original file line number Diff line number Diff line change
@@ -1,154 +1,152 @@
const authorFields = [
{
id: 'name',
name: 'Name',
type: 'Symbol',
required: true
},
{
id: 'title',
name: 'Title',
type: 'Symbol',
required: true
},
{
id: 'company',
name: 'Company',
type: 'Symbol',
required: true
},
{
id: 'shortBio',
name: 'Short Bio',
type: 'Text',
required: true
},
{
id: 'email',
name: 'Email',
type: 'Symbol',
required: true
},
{
id: 'twitter',
name: 'Twitter',
type: 'Symbol',
required: true
}
{
id: 'name',
name: 'Name',
type: 'Symbol',
required: true
},
{
id: 'title',
name: 'Title',
type: 'Symbol',
required: true
},
{
id: 'company',
name: 'Company',
type: 'Symbol',
required: true
},
{
id: 'shortBio',
name: 'Short Bio',
type: 'Text',
required: true
},
{
id: 'email',
name: 'Email',
type: 'Symbol',
required: true
},
{
id: 'twitter',
name: 'Twitter',
type: 'Symbol',
required: true
}
];

const blogFields = [
{
id: 'title',
name: 'Title',
type: 'Symbol',
required: true
},
{
id: 'slug',
name: 'Slug',
type: 'Symbol',
required: true
},
{
id: 'heroImage',
name: 'Hero Image',
type: 'Object',
required: true
},
{
id: 'description',
name: 'Description',
type: 'Text',
required: true
},
{
id: 'body',
name: 'Body',
type: 'Text',
required: true
},
{
id: 'author',
name: 'Author',
type: 'Link',
required: true,
linkType: 'Entry',
validations: [{linkContentType: ['author']}]
},
{
id: 'publishedDate',
name: 'Published Date',
type: 'Date',
required: true
},
{
id: 'tags',
name: 'Tags',
type: 'Link',
required: true,
linkType: 'Array',
validations: [{linkContentType: ['tag']}]
},
{
id: 'title',
name: 'Title',
type: 'Symbol',
required: true
},
{
id: 'slug',
name: 'Slug',
type: 'Symbol',
required: true
},
{
id: 'heroImage',
name: 'Hero Image',
type: 'Object',
required: true
},
{
id: 'description',
name: 'Description',
type: 'Text',
required: true
},
{
id: 'body',
name: 'Body',
type: 'Text',
required: true
},
{
id: 'author',
name: 'Author',
type: 'Link',
required: true,
linkType: 'Entry',
validations: [{ linkContentType: ['author'] }]
},
{
id: 'publishedDate',
name: 'Published Date',
type: 'Date',
required: true
},
{
id: 'tags',
name: 'Tags',
type: 'Link',
required: true,
linkType: 'Array',
validations: [{ linkContentType: ['tag'] }]
}
];

const tagFields = [
{
id: 'name',
name: 'Name',
type: 'Symbol',
required: true
},
{
id: 'name',
name: 'Name',
type: 'Symbol',
required: true
}
];

module.exports = function (migration, context) {
const tag = migration.createContentType('tag', {
name: 'Tag',
description: 'tag'
});

tagFields.forEach(field => {
tag.createField(field.id, {
name: field.name,
type: field.type,
required: field.required
});
});
module.exports = function(migration, context) {
const tag = migration.createContentType('tag', {
name: 'Tag',
description: 'tag'
});

const author = migration.createContentType('author', {
name: 'Author',
description: 'Author of Blogpost'
tagFields.forEach(field => {
tag.createField(field.id, {
name: field.name,
type: field.type,
required: field.required
});
});

authorFields.forEach(field => {
author.createField(field.id, {
name: field.name,
type: field.type,
required: field.required
});
});
const blog = migration.createContentType('blogPost', {
name: 'BlogPost',
description: 'Blog Post'
});
const author = migration.createContentType('author', {
name: 'Author',
description: 'Author of Blogpost'
});

blogFields.forEach(field => {
if (!field.linkType) {
blog.createField(field.id, {
name: field.name,
type: field.type,
required: field.required
});
} else {
blog.createField(field.id, {
name: field.name,
type: field.type,
linkType: field.linkType,
required: field.required,
validations: field.validations
});
}
authorFields.forEach(field => {
author.createField(field.id, {
name: field.name,
type: field.type,
required: field.required
});
});
const blog = migration.createContentType('blogPost', {
name: 'BlogPost',
description: 'Blog Post'
});


blogFields.forEach(field => {
if (!field.linkType) {
blog.createField(field.id, {
name: field.name,
type: field.type,
required: field.required
});
} else {
blog.createField(field.id, {
name: field.name,
type: field.type,
linkType: field.linkType,
required: field.required,
validations: field.validations
});
}
});
};

0 comments on commit f7f479c

Please sign in to comment.