{"id":17845738,"url":"https://github.com/guidevloper/nullstack-view-counter","last_synced_at":"2025-04-02T15:25:04.305Z","repository":{"id":167446545,"uuid":"643039401","full_name":"GuiDevloper/nullstack-view-counter","owner":"GuiDevloper","description":"Nullstack example of counting views and avoiding requests from non-user sources","archived":false,"fork":false,"pushed_at":"2023-07-06T08:34:37.000Z","size":681,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-02-08T06:27:14.715Z","etag":null,"topics":["nullstack"],"latest_commit_sha":null,"homepage":"https://nullstack-view-counter.vercel.app","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/GuiDevloper.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-05-19T23:55:51.000Z","updated_at":"2023-05-20T02:53:12.000Z","dependencies_parsed_at":null,"dependency_job_id":"d8fee50c-dbf8-43a7-8e2c-6b00af4597d0","html_url":"https://github.com/GuiDevloper/nullstack-view-counter","commit_stats":null,"previous_names":["guidevloper/nullstack-view-counter"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/GuiDevloper%2Fnullstack-view-counter","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/GuiDevloper%2Fnullstack-view-counter/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/GuiDevloper%2Fnullstack-view-counter/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/GuiDevloper%2Fnullstack-view-counter/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/GuiDevloper","download_url":"https://codeload.github.com/GuiDevloper/nullstack-view-counter/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246839330,"owners_count":20842220,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["nullstack"],"created_at":"2024-10-27T21:36:48.347Z","updated_at":"2025-04-02T15:25:04.275Z","avatar_url":"https://github.com/GuiDevloper.png","language":"TypeScript","readme":"# nullstack-view-counter\n\nNullstack example of counting views and avoiding requests from non-user sources.\n\n## Reasoning\n\nNullstack in production environment by default loads the page and activate a service-worker that loads again, making double-run at the first user visit (calling any initial [server function](https://nullstack.app/server-functions) too).\n\nAlso many bots (like VercelBot) requests the page, making more runs (and logs).\n\nThis example caches the root page `/`, and also checks the user-agent from requests, trying to count only real users visits.\n\n- In **server.ts** all `get` requests are intercepted and cached for 3s (enough for worker) - Comment line 12 for the initial request double-run again.\n\n- In **src/ViewCount.tsx** the logic happens. A server variable stores the count - Without the above caching, the initial goes wrong, pressing `Sync with server` shows how the server got hit twice.\n\n- In **src/utils.ts** there's a method to check if the user agent isn't among known bots, blocking the server count for them.\n\n## How to run this project\n\n1. Install the dependencies: `npm install`\n\n2. Rename the **.env.example** file to **.env**\n\n3. Run the app in production mode:\n\n```sh\nnpm run build \u0026\u0026 node .production/server.js\n```\n\n5. Open [http://localhost:3000](http://localhost:3000) in a anonymous/zero-cache tab.\n\n6. Check the terminal and view.\n\n\u003e :bulb: Vercel Serverless instances does have a temporary state being a good environment to test this behavior in production and storing logs.\n\n## Learn more\n\n[Read Nullstack documentation](https://nullstack.app/documentation)","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fguidevloper%2Fnullstack-view-counter","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fguidevloper%2Fnullstack-view-counter","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fguidevloper%2Fnullstack-view-counter/lists"}