{"id":15710759,"url":"https://github.com/upmostly/react-chrome-extension","last_synced_at":"2025-07-09T05:04:27.890Z","repository":{"id":47719059,"uuid":"254361056","full_name":"upmostly/react-chrome-extension","owner":"upmostly","description":"Boilerplate code to build a Chrome extension in React","archived":false,"fork":false,"pushed_at":"2023-01-04T18:57:10.000Z","size":1268,"stargazers_count":169,"open_issues_count":12,"forks_count":50,"subscribers_count":4,"default_branch":"master","last_synced_at":"2025-05-07T09:52:21.658Z","etag":null,"topics":["chrome-extension","chrome-extensions","javascript","react","reactjs"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","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/upmostly.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}},"created_at":"2020-04-09T12:08:45.000Z","updated_at":"2024-10-17T12:43:38.000Z","dependencies_parsed_at":"2023-02-02T20:02:43.918Z","dependency_job_id":null,"html_url":"https://github.com/upmostly/react-chrome-extension","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/upmostly/react-chrome-extension","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/upmostly%2Freact-chrome-extension","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/upmostly%2Freact-chrome-extension/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/upmostly%2Freact-chrome-extension/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/upmostly%2Freact-chrome-extension/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/upmostly","download_url":"https://codeload.github.com/upmostly/react-chrome-extension/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/upmostly%2Freact-chrome-extension/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":264396622,"owners_count":23601541,"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":["chrome-extension","chrome-extensions","javascript","react","reactjs"],"created_at":"2024-10-03T21:09:51.703Z","updated_at":"2025-07-09T05:04:27.875Z","avatar_url":"https://github.com/upmostly.png","language":"JavaScript","readme":"## react-chrome-extension\n![Alt text](./react-chrome-extension.png?raw=true \"Optional Title\")\n\nThis is the first in a series of React boilerplate projects to help web developers learn and understand React. This project actually came about as I was creating my latest project, [StyleStash - Save Your favorite CSS Styles](https://stylestash.dev).\n\n## Video Code Walkthrough\n\nIf you're more of a visual learner, I've recorded a [20 minute video walkthrough of this project](https://www.youtube.com/watch?v=4x0lQu1TOCQ).\n\n### Local Testing\n\n`npm start`\n\nRuns the app in the development mode.\u003cbr\u003e\nOpen [http://localhost:3000](http://localhost:3000) to view it in the browser.\n\n### Testing Inside Chrome\n\nThis project needs to be built in order to take advantage of the Chrome Extension API, such as using the Content script to get the extension's ID, or using the Chrome Storage API. These features cannot be used when running this project locally.\n\nTo load as a developer extension inside of Chrome:\n\n1. `npm run build` \u003cbr\u003e\n2. Navigate to `chrome://extensions/` in your browser \u003cbr\u003e\n3. Toggle the `Developer mode` switch on in the top right hand corner \u003cbr\u003e\n4. Click the `Load unpacked` button in the top left corner \u003cbr\u003e\n5. Select the `build` folder inside of this project folder \u003cbr\u003e\n\nBuilds the app for Chrome to the `build` folder.\u003cbr\u003e\n\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fupmostly%2Freact-chrome-extension","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fupmostly%2Freact-chrome-extension","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fupmostly%2Freact-chrome-extension/lists"}