Skip to content

chore(rebuild): re-incorporate google-analytics #2045

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
May 8, 2018

Conversation

montogeek
Copy link
Member

No description provided.

src/index.jsx Outdated

// Client Side Rendering
if ( window.document !== undefined ) {
ReactDOM.render((
<BrowserRouter>
<BrowserRouter id={gaID}>
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This component triggers an error locally because id is required. I think it is fine, haven't tried passing an empty string, or any string for that matter.

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah, maybe default gaID to an empty string and see what happens? If not, we should change it to something like:

import { BrowserRouter, Route } from 'react-router-dom'
import { BrowserRouter as AnalyticsRouter } from 'react-g-analytics'

if ( process.env.NODE_ENV === 'production' ) {
  BrowserRouter = AnalyticsRouter
}

Then in dev, the normal BrowserRouter will simply ignore the id prop.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That would be cool, but imports are defined as const

Copy link
Member Author

@montogeek montogeek Apr 14, 2018

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What about:

const BrowserRouter = process.env.NODE_ENV === 'production' ? require('react-g-analytics') : require('react-router-dom').BrowserRouter;

Copy link
Member

@EugeneHlushko EugeneHlushko Apr 14, 2018

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

yes or if we want imports just define another variable:

const Router = process.env.NODE_ENV === 'production' ? AnalyticsRouter : BrowserRouter;
...
<Router ...>

P.S. but i guess require is totally fine

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't like inline requires. Your first idea is better

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Idk I feel like we should stick with ES6 imports in as much of the codebase as possible for consistency. I forgot about the const issue but I like the idea of just defining a new var as @EugeneHlushko showed above.

behaviour: 'append'
}
],
require('remark-html'),
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can you separate these changes to another PR? They seem unrelated to the google-analytics fix.

webpack.dev.js Outdated
compress: true,
historyApiFallback: true
}
});
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Same here, I'm not exactly sure what even changed. Was this intentional?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Prettier, sorry!

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ah you have a sublime plugin for it or something, I see now. Yeah if you don't mind, let's wait to make all those changes as a separate commit until after this is done and merged. Then we can integrate it into the build process in a way that hits everyone's builds.

@skipjack
Copy link
Collaborator

skipjack commented Apr 14, 2018

@montogeek aside from my few comments and figuring out the prod/dev discrepancy, I think this is good to go assuming it works ok. How did you test btw? Seems like a tricky thing to play around with (e.g. you don't want to report stuff from a dev instance).

@EugeneHlushko
Copy link
Member

EugeneHlushko commented Apr 14, 2018

I would suggest implementing ga for prod before merging

import { BrowserRouter, Route } from 'react-router-dom'
import { BrowserRouter as AnalyticsRouter } from 'react-g-analytics'

if ( process.env.NODE_ENV === 'production' ) {
  BrowserRouter = AnalyticsRouter
}

Otherwise looks pretty straightforward

@montogeek
Copy link
Member Author

@skipjack I built the site and navigate 2 pages, I saw 2 successful requests to Google Analytics server.

@montogeek
Copy link
Member Author

Feedback addressed.

@skipjack skipjack changed the title feat(site) Add Google Analytics only for production chore(rebuild): re-incorporate google-analytics Apr 15, 2018
@skipjack skipjack mentioned this pull request Apr 15, 2018
16 tasks
Copy link
Member

@EugeneHlushko EugeneHlushko left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

src/index.jsx Outdated
import Site from './components/Site/Site';

// TODO: Re-integrate <GoogleAnalytics analyticsId="UA-46921629-2" />
// Consider `react-g-analytics` package
const Router = process.env.NODE_ENV === 'production' ? AnalyticsRouter : BrowserRouter;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We could use require here inside a conditional and only import the browser required for produciton. DOn't know if with this approach BrowserRouter gets dead code eliminated, if it does I'm fine with it.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think it get DCE, will confirm later.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

One more thing, shouldn't we keep the analyticsId in a dot file so we don't expose it here, though we already did either way I guess 😅

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

GA keys are public any way or do you mean just for configuration purposes? We can put it into package.json file.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah its safe to expose 👍 moving it out to single source of truth from the template is another question, which i suspect shouldn't be tackled in this PR

@montogeek montogeek merged commit 10a0421 into rebuild May 8, 2018
@montogeek montogeek deleted the rebuild-add-google-analytics branch May 8, 2018 10:13
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants