archive/rsnext
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions
rsnext/examples/with-google-analytics
History
José Fernando Höwer Barbosa 268dd6e80b
Simplify with-google-analytics example (#43894) 
<!--
Thanks for opening a PR! Your contribution is much appreciated.
To make sure your PR is handled as smoothly as possible we request that
you follow the checklist sections below.
Choose the right checklist for the change that you're making:
-->
## Documentation / Examples

- [x] Make sure the linting passes by running `pnpm build && pnpm lint`
- [x] The "examples guidelines" are followed from [our contributing
doc](https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md)

First of all thanks for this amazing project and all the help you
provide with these examples.

It seems there is code duplication in this example. After some tests
locally seem to _document.js is not necessary for `gtag` to work
properly.


9d97a1e34a/examples/with-google-analytics/pages/_app.js (L30-L34)


9d97a1e34a/examples/with-google-analytics/pages/_document.js (L13-L17)

I am aware of https://github.com/vercel/next.js/pull/40645 and I would
like to ask @dave-hay, @SukkaW and @ijjk to consider this is still
necessary. If so why then not move all content of the scripts from _app
to _document?

In any case, I am open to adding here some comments explaining what is
the reason for this code duplication if necessary.

<hr/>

Changes that come from  https://github.com/vercel/next.js/pull/43897

1. The `event` hashChangeComplete should be removed since `/home` and
`/home/#section` is not new pageview, but just reference to the same
page.

If we go from /home to /home/#section (with a button click or a link for
example) this shouldn't trigger a new page visit on `gtag`.

For this reason, I think we should revert the changes from
https://github.com/vercel/next.js/pull/36079. If there is a better
argument of why this should stay I am also open to creating comments to
clarify this on the example since I don't think should be the default
behavior and not useful in most cases.

2. The `id="gtag-init"` was added with no context to the example from
https://github.com/vercel/next.js/pull/29530

If there is a reason for this id in the script to existing I am open to
adding a comment that clarifies this since in my experience is not
necessary at all.


Edit: Batching with https://github.com/vercel/next.js/pull/43897 as
recommended by
https://github.com/vercel/next.js/pull/43897#issuecomment-1344635000

---------

Co-authored-by: JJ Kasper <jj@jjsweb.site>
2023-02-07 14:58:52 -08:00
..
components Run next/link codemod for Next.js 13 on examples (#41913) 2022-10-30 21:00:45 +01:00
lib [examples] Replace the GA_TRACKING_ID string with env variable (#21817) 2021-02-16 10:25:09 -06:00
pages Simplify with-google-analytics example (#43894) 2023-02-07 14:58:52 -08:00
.env.local.example [examples] Replace the GA_TRACKING_ID string with env variable (#21817) 2021-02-16 10:25:09 -06:00
.gitignore Update default gitignore templates (#39051) 2022-07-26 20:08:40 -05:00
package.json Update Examples to use React 18 (#42027) 2022-10-28 17:43:20 +00:00
README.md docs(examples): improve DX while copying command to create new project (#38410) 2022-07-26 21:57:48 -05:00

README.md

Example app with analytics

This example shows how to use Next.js along with Google Analytics. A custom _app is used to inject tracking snippet and track pageviews and event.

Deploy your own

Deploy the example using Vercel:

Deploy with Vercel

How to use

Execute create-next-app with npm, Yarn, or pnpm to bootstrap the example:

npx create-next-app --example with-google-analytics with-google-analytics-app

yarn create next-app --example with-google-analytics with-google-analytics-app

pnpm create next-app --example with-google-analytics with-google-analytics-app

Deploy it to the cloud with Vercel (Documentation).