{"id":18583780,"url":"https://github.com/barrymun/sample-extension","last_synced_at":"2025-05-16T05:10:20.913Z","repository":{"id":199785416,"uuid":"703752790","full_name":"barrymun/sample-extension","owner":"barrymun","description":null,"archived":false,"fork":false,"pushed_at":"2023-10-28T17:08:30.000Z","size":1177,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-02-17T16:46:59.338Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/barrymun.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","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-10-11T21:01:20.000Z","updated_at":"2023-10-26T20:41:06.000Z","dependencies_parsed_at":"2024-11-07T00:26:40.263Z","dependency_job_id":"2a940eb3-3965-4ef4-ac30-a615104c8748","html_url":"https://github.com/barrymun/sample-extension","commit_stats":null,"previous_names":["barrymun/sample-extension"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/barrymun%2Fsample-extension","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/barrymun%2Fsample-extension/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/barrymun%2Fsample-extension/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/barrymun%2Fsample-extension/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/barrymun","download_url":"https://codeload.github.com/barrymun/sample-extension/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254471049,"owners_count":22076587,"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":[],"created_at":"2024-11-07T00:24:40.881Z","updated_at":"2025-05-16T05:10:20.898Z","avatar_url":"https://github.com/barrymun.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Chrome Extension with TypeScript and Next.js Client\n\nThis project demonstrates how to create a Chrome extension using TypeScript, bundled with Webpack, alongside a client application built with Next.js. The extension displays the client side within an iframe, showcasing the URL of the current webpage.\n\n## Table of Contents\n\n- [Project Structure](#project-structure)\n- [Getting Started](#getting-started)\n  - [Prerequisites](#prerequisites)\n  - [Installation](#installation)\n- [Development](#development)\n  - [Extension](#extension)\n  - [Client](#client)\n    - [Docker](#using-docker)\n  - [Common Module](#common-module)\n- [Building for Production](#building-for-production)\n- [License](#license)\n\n## Project Structure\n\n- `extension/`: Chrome extension codebase\n- `client/`: Next.js client application\n- `common/`: Shared utilities and types\n\n## Getting Started\n\n### Prerequisites\n\n- Node.js and yarn\n\n### Installation\n\nClone the repository:\n\n```bash\ngit clone https://github.com/barrymun/sample-extension.git\ncd sample-extension\n```\n\nInstall dependencies for all parts of the project:\n\n```bash\nyarn install\n```\n\n## Development\n\n### Extension\n\nTo build the extension run:\n\n```bash\nyarn extension-build\n```\n\nIt is also possible to start Webpack in watch mode, automatically rebuilding the extension on file changes:\n\n```bash\nyarn extension-watch\n```\n\nTo run the extension locally:\n\n1. Navigate to chrome://extensions/ in Google Chrome.\n2. Enable \"Developer mode\" at the top right.\n3. Click \"Load unpacked\" and select the extension/build directory.\n\n### Client\n\nTo start in dev mode run:\n\n```bash\nyarn client-dev\n```\n\nThis will start the Next.js application, which the extension will load inside an iframe.\n\n#### Using Docker\n\nIf you prefer to run the client inside a Docker container, use the following command:\n\n```bash\nyarn docker-up\n```\n\nThis will build and start the client application inside a Docker container, ensuring a consistent environment for all developers.\n\nSee `package.json` in the root directory for more Docker related scripts.\n\n### Common module\n\nThe `common` module contains shared types, utilities, and other code that both the extension and client need access to. Ensure that this module is installed locally so that changes are reflected across both projects.\n\nTo make changes:\n\n1. Navigate to the common directory.\n2. Make your changes and run npm run build to compile the TypeScript code.\n3. Ensure that the common module is correctly linked in both the extension and client projects.\n\n## Building for Production\n\nTo build the extension and client for production, run the following commands respectively:\n\n```bash\nyarn extension-build\n```\n\n```bash\nyarn client-build\n```\n\n## License\n\nThis project is licensed under the MIT License. See the [LICENSE](/LICENSE) file for details.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbarrymun%2Fsample-extension","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbarrymun%2Fsample-extension","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbarrymun%2Fsample-extension/lists"}