Skip to content

Commit

Permalink
Added README Files For Tutorials (#1371)
Browse files Browse the repository at this point in the history
* tutorials redme

* update 404 URLs

* tutorials redme

* readme files

* readme

* readme

* Update functional-samples/tutorial.getting-started/README.md

Co-authored-by: Oliver Dunk <[email protected]>

* url change not required

* Update functional-samples/tutorial.tabs-manager/README.md

Co-authored-by: Oliver Dunk <[email protected]>

* Update README.md

* Update functional-samples/tutorial.tabs-manager/README.md

Co-authored-by: Oliver Dunk <[email protected]>

* Update functional-samples/tutorial.hello-world/README.md

Co-authored-by: Oliver Dunk <[email protected]>

* Update functional-samples/tutorial.getting-started/README.md

Co-authored-by: Oliver Dunk <[email protected]>

* Update functional-samples/tutorial.hello-world/README.md

Co-authored-by: Oliver Dunk <[email protected]>

* Update functional-samples/tutorial.getting-started/README.md

Co-authored-by: Oliver Dunk <[email protected]>

* Update functional-samples/tutorial.getting-started/README.md

Co-authored-by: Oliver Dunk <[email protected]>

* Update functional-samples/tutorial.getting-started/README.md

Co-authored-by: Oliver Dunk <[email protected]>

* foxed typo for tabGroups

* Fixed typo for tabGroups

---------

Co-authored-by: Oliver Dunk <[email protected]>
  • Loading branch information
TrickSumo and oliverdunk authored Jan 13, 2025
1 parent 692e9a9 commit 40e9576
Show file tree
Hide file tree
Showing 3 changed files with 40 additions and 0 deletions.
16 changes: 16 additions & 0 deletions functional-samples/tutorial.getting-started/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
# Getting Started With Google Chrome Extensions

This is an extension used in the [Debug extensions][1] tutorial. It changes the HTML body background color of the active tab.
The purpose of this extension is to demonstrate how to create a simple Chrome Extension that uses the `default_popup`, `options_page` and `service_worker` manifest keys and `storage` and `tabs` APIs.

## Running This Extension

1. Clone this repository.
2. Load this directory in Chrome as an [unpacked extension][2].
3. Go to https://developer.chrome.com/docs/extensions/get-started/tutorial/debug or any web page.
4. Click the extension icon in the Chrome toolbar, then click the three dots next to the "Getting Started Example" extension and select "Options".
5. On the Options page, choose a color.
6. Afterward, click the extension icon again, and the page's background color will change when you click the button in the extension popup.

[1]: https://developer.chrome.com/docs/extensions/get-started/tutorial/debug
[2]: https://developer.chrome.com/docs/extensions/mv3/getstarted/development-basics/#load-unpacked
10 changes: 10 additions & 0 deletions functional-samples/tutorial.hello-world/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
# Getting Started With Google Chrome Extensions (Hello World)

This example demonstrates how to create a simple "Hello World" Chrome Extension.
For more details, visit the [official tutorial](https://developer.chrome.com/docs/extensions/get-started/tutorial/hello-world).

## Running This Extension

1. Clone this repository.
2. Load this directory in Chrome as an [unpacked extension](https://developer.chrome.com/docs/extensions/mv3/getstarted/development-basics/#load-unpacked).
3. Click the extension icon in the Chrome toolbar, then select the "Hello Extensions" extension. A popup will appear displaying the text "Hello Extensions".
14 changes: 14 additions & 0 deletions functional-samples/tutorial.tabs-manager/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
# Tab Manager For Chrome Dev Docs

This Chrome extension helps you manage and group your tabs related to Google Chrome Developer documentation. It organizes tabs into a group titled "DOCS" for easier navigation and enhanced productivity.

Purpose of this extension is to demonstrate [chrome.tabGroups](https://developer.chrome.com/docs/extensions/reference/api/tabGroups) API to interact with the browser's tab grouping system.

## Running This Extension

1. Clone this repository.
2. Load this directory in Chrome as an [unpacked extension](https://developer.chrome.com/docs/extensions/mv3/getstarted/development-basics/#load-unpacked).
3. Open these two URLs in separate tabs:
- [https://developer.chrome.com/docs/extensions](https://developer.chrome.com/docs/extensions)
- [https://developer.chrome.com/docs/extensions/reference/api](https://developer.chrome.com/docs/extensions/reference/api)
4. Click the extension icon in the Chrome toolbar, then select the "Tab Manager for Chrome Dev Docs" extension. A popup will appear having title "Google Dev Docs" and button named "Group Tabs". Click on the button to group the two tabs.

0 comments on commit 40e9576

Please sign in to comment.