{"id":21527418,"url":"https://github.com/uvacoder/web-apis-cards","last_synced_at":"2026-04-20T14:02:10.540Z","repository":{"id":103087973,"uuid":"421456477","full_name":"Uvacoder/web-apis-cards","owner":"Uvacoder","description":null,"archived":false,"fork":false,"pushed_at":"2021-12-05T07:13:38.000Z","size":1953,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-08-26T19:02:22.877Z","etag":null,"topics":["aaa","abc","abcstarter","abctest","api","cards","collection","curated","mywip","vercel"],"latest_commit_sha":null,"homepage":"https://web-apis.vercel.app","language":"JavaScript","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/Uvacoder.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","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},"funding":{"custom":["https://blog.greenroots.info/sponsor","https://buymeacoffee.com/greenroots","https://paypal.me/greenrootsinfo"]}},"created_at":"2021-10-26T14:23:06.000Z","updated_at":"2023-02-07T14:09:15.000Z","dependencies_parsed_at":null,"dependency_job_id":"a3b342df-39d7-43de-aaba-e8b1f590a298","html_url":"https://github.com/Uvacoder/web-apis-cards","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/Uvacoder/web-apis-cards","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Uvacoder%2Fweb-apis-cards","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Uvacoder%2Fweb-apis-cards/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Uvacoder%2Fweb-apis-cards/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Uvacoder%2Fweb-apis-cards/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Uvacoder","download_url":"https://codeload.github.com/Uvacoder/web-apis-cards/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Uvacoder%2Fweb-apis-cards/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":32050451,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-20T11:35:06.609Z","status":"ssl_error","status_checked_at":"2026-04-20T11:34:48.899Z","response_time":94,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.6:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"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":["aaa","abc","abcstarter","abctest","api","cards","collection","curated","mywip","vercel"],"created_at":"2024-11-24T01:48:50.132Z","updated_at":"2026-04-20T14:02:10.484Z","avatar_url":"https://github.com/Uvacoder.png","language":"JavaScript","funding_links":["https://blog.greenroots.info/sponsor","https://buymeacoffee.com/greenroots","https://paypal.me/greenrootsinfo","https://www.buymeacoffee.com/greenroots"],"categories":[],"sub_categories":[],"readme":"# 🔌 WEB APIS PLAYGROUND\n\n\nhttps://github.com/atapas/webapis-playground\n\n\n\u003c!-- ALL-CONTRIBUTORS-BADGE:START - Do not remove or modify this section --\u003e\n[![All Contributors](https://img.shields.io/badge/all_contributors-17-orange.svg?style=flat-square)](#contributors-)\n\u003c!-- ALL-CONTRIBUTORS-BADGE:END --\u003e\n\nThe `Web APIs Playground` is a project to showcase the JavaScript Web APIs with examples and demonstrations. Client-side JavaScript APIs provides wrapper functions for many low-level tasks like,\n\n- Device Hardware Interactions\n- Client-side storage interactions\n- 3D Graphics, WebGL\n- Notifications\n- Audio, Video\n- and many, many more.\n\nPlease [follow this link](https://developer.mozilla.org/en-US/docs/Web/API) to know about different Web APIs and their usages.\n\n# 🎯 Vision and Mission of this Playground\n\nThe primary mission is to provide working examples of the JavaScript web APIs with simple demonstration that can be accessed using browsers on different devices. It may help many beginners to this topic in understanding how to code and use the Web APIs.\n\n# 🏗️ How to ADD a new DEMO?\n\n[Here is a step-by-step guide](./HOW-TO-ADD-DEMO.md) to help you add a new demo.\n\n# ⚒️ It's developed using Next.js\n\nThis project is developed using the `Next.js`. If you have implemented a similar project using JavaScript or any other frameworks like React, Angular, Vue, please create an issue to include them in the README.\n\n# 🤲 Want to Motivate?\n\nWho doesn't need motivation? Please give the project a star(⭐) and/or share it in your dev circle.\n\n## Many Thanks to all the `Stargazers` who has supported this project with stars(⭐)\n\n[![Stargazers repo roster for @atapas/webapis-playground](https://reporoster.com/stars/atapas/webapis-playground)](https://github.com/atapas/webapis-playground/stargazers)\n\n# 🏃‍♀️ How to Run the project locally\n\nTo run the project locally,\n\n- Please clone it.\n- Browse to the project directory.\n- Install dependencies\n\n```bash\nnpm install\n# Or\nyarn install\n```\n\n- Run the application locally\n\n```bash\nnpm run dev\n# Or\nyarn dev\n```\n\n- Open the browser and navigate to `http://localhost:3000`\n\n# 🚀 What's Included?\n\nSo far, it includes the following examples:\n\n1. 📂 File System API\n1. 📺 FullScreen API\n1. 📋 Clipboard API\n1. 📡 Broadcast\n1. 📷 Image Capture\n1. 📶 Network Info\n1. 🧐 Resize Observer\n1. 💳 Payment Request\n1. 📳 Vibration API\n1. 🔋 Battery API\n1. 🐢 Drag and Drop\n1. ⚓ Geolocation API\n1. 🖼️ Picture in Picture\n1. 💻 Screen Capture\n1. ✍️ CSS Font Loading\n1. 🎙️ Web Speech API\n\n# 🤝 Open Source\n\nThis project is opensource and open for contributions. If you are looking for any examples and demonstrations that are missing, please [open a issue from here](https://github.com/atapas/webapis-playground/issues). You can also contrinute to the source code by adding an exaple, improving code, and providing suggestions.\n\n# 🤝 Contributing to `playground`\n\nAny kind of positive contribution is welcome! Please help us to grow by contributing to the project.\n\nIf you wish to contribute, you can work on any issues [listed here](https://github.com/atapas/webapis-playground/issues) or create one on your own. After adding your code, please send us a Pull Request.\n\n\u003e Please read [`CONTRIBUTING`](CONTRIBUTING.md) for details on our [`CODE OF CONDUCT`](CODE_OF_CONDUCT.md), and the process for submitting pull requests to us.\n\n# 🙏 Support\n\nWe all need support and motivation. `WebAPIs Playground` is not an exception. Please give this project a ⭐️ to encourage and show that you liked it.\n\nIf you found the app helpful, consider supporting us with a coffee.\n\n\u003ca href=\"https://www.buymeacoffee.com/greenroots\"\u003e\n    \u003cimg src=\"https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png\" height=\"50px\"\u003e\n\u003c/a\u003e\n\n## Contributors ✨\n\nThanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)):\n\n\u003c!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section --\u003e\n\u003c!-- prettier-ignore-start --\u003e\n\u003c!-- markdownlint-disable --\u003e\n\u003ctable\u003e\n  \u003ctr\u003e\n    \u003ctd align=\"center\"\u003e\u003ca href=\"https://usman-s.me\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/51731966?v=4?s=100\" width=\"100px;\" alt=\"\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eMax Programming\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/atapas/webapis-playground/commits?author=max-programming\" title=\"Code\"\u003e💻\u003c/a\u003e\u003c/td\u003e\n    \u003ctd align=\"center\"\u003e\u003ca href=\"https://tapasadhikary.com\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/3633137?v=4?s=100\" width=\"100px;\" alt=\"\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eTapas Adhikary\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/atapas/webapis-playground/commits?author=atapas\" title=\"Code\"\u003e💻\u003c/a\u003e\u003c/td\u003e\n    \u003ctd align=\"center\"\u003e\u003ca href=\"http://niteshseram.in\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/51370246?v=4?s=100\" width=\"100px;\" alt=\"\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eNitesh Seram\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/atapas/webapis-playground/commits?author=niteshseram\" title=\"Code\"\u003e💻\u003c/a\u003e \u003ca href=\"#a11y-niteshseram\" title=\"Accessibility\"\u003e️️️️♿️\u003c/a\u003e \u003ca href=\"https://github.com/atapas/webapis-playground/issues?q=author%3Aniteshseram\" title=\"Bug reports\"\u003e🐛\u003c/a\u003e\u003c/td\u003e\n    \u003ctd align=\"center\"\u003e\u003ca href=\"https://wsameer.github.io/v1/\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/8468992?v=4?s=100\" width=\"100px;\" alt=\"\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eSameer Waskar\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/atapas/webapis-playground/commits?author=wsameer\" title=\"Code\"\u003e💻\u003c/a\u003e\u003c/td\u003e\n    \u003ctd align=\"center\"\u003e\u003ca href=\"https://github.com/omriattiya\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/26112374?v=4?s=100\" width=\"100px;\" alt=\"\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eOmri Attiya\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/atapas/webapis-playground/commits?author=omriattiya\" title=\"Code\"\u003e💻\u003c/a\u003e\u003c/td\u003e\n    \u003ctd align=\"center\"\u003e\u003ca href=\"https://tiger-yash.github.io/\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/74406801?v=4?s=100\" width=\"100px;\" alt=\"\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eYash Raj\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/atapas/webapis-playground/commits?author=tiger-yash\" title=\"Code\"\u003e💻\u003c/a\u003e\u003c/td\u003e\n    \u003ctd align=\"center\"\u003e\u003ca href=\"https://rehansattar.now.sh/\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/26999472?v=4?s=100\" width=\"100px;\" alt=\"\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eRehan  Sattar\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/atapas/webapis-playground/commits?author=rehan-sattar\" title=\"Code\"\u003e💻\u003c/a\u003e \u003ca href=\"https://github.com/atapas/webapis-playground/issues?q=author%3Arehan-sattar\" title=\"Bug reports\"\u003e🐛\u003c/a\u003e\u003c/td\u003e\n  \u003c/tr\u003e\n  \u003ctr\u003e\n    \u003ctd align=\"center\"\u003e\u003ca href=\"https://ahsanayaz.com\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/9844254?v=4?s=100\" width=\"100px;\" alt=\"\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eMuhammad Ahsan Ayaz\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/atapas/webapis-playground/commits?author=AhsanAyaz\" title=\"Code\"\u003e💻\u003c/a\u003e\u003c/td\u003e\n    \u003ctd align=\"center\"\u003e\u003ca href=\"http://koustov.com\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/7145967?v=4?s=100\" width=\"100px;\" alt=\"\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eKoustov\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/atapas/webapis-playground/issues?q=author%3Akoustov\" title=\"Bug reports\"\u003e🐛\u003c/a\u003e \u003ca href=\"https://github.com/atapas/webapis-playground/commits?author=koustov\" title=\"Code\"\u003e💻\u003c/a\u003e\u003c/td\u003e\n    \u003ctd align=\"center\"\u003e\u003ca href=\"https://github.com/aanchal-fatwani\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/63228776?v=4?s=100\" width=\"100px;\" alt=\"\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eAanchal\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/atapas/webapis-playground/commits?author=aanchal-fatwani\" title=\"Code\"\u003e💻\u003c/a\u003e\u003c/td\u003e\n    \u003ctd align=\"center\"\u003e\u003ca href=\"https://abhikhatri67.github.io/\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/15958423?v=4?s=100\" width=\"100px;\" alt=\"\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eAbhishek Khatri\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/atapas/webapis-playground/commits?author=abhikhatri67\" title=\"Code\"\u003e💻\u003c/a\u003e\u003c/td\u003e\n    \u003ctd align=\"center\"\u003e\u003ca href=\"https://www.avneesh.tech/\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/76690419?v=4?s=100\" width=\"100px;\" alt=\"\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eAvneesh Agarwal\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/atapas/webapis-playground/commits?author=avneesh0612\" title=\"Code\"\u003e💻\u003c/a\u003e\u003c/td\u003e\n    \u003ctd align=\"center\"\u003e\u003ca href=\"https://github.com/kvnal\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/72142540?v=4?s=100\" width=\"100px;\" alt=\"\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eKunal Singh\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/atapas/webapis-playground/commits?author=kvnal\" title=\"Code\"\u003e💻\u003c/a\u003e\u003c/td\u003e\n    \u003ctd align=\"center\"\u003e\u003ca href=\"https://github.com/rzhekova\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/35401262?v=4?s=100\" width=\"100px;\" alt=\"\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eRosie Z\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/atapas/webapis-playground/commits?author=rzhekova\" title=\"Code\"\u003e💻\u003c/a\u003e\u003c/td\u003e\n  \u003c/tr\u003e\n  \u003ctr\u003e\n    \u003ctd align=\"center\"\u003e\u003ca href=\"https://github.com/mverissimo\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/371844?v=4?s=100\" width=\"100px;\" alt=\"\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eMatheus Verissimo\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/atapas/webapis-playground/commits?author=mverissimo\" title=\"Code\"\u003e💻\u003c/a\u003e\u003c/td\u003e\n    \u003ctd align=\"center\"\u003e\u003ca href=\"http://abiolaesther.me\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/49586787?v=4?s=100\" width=\"100px;\" alt=\"\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eAbiola\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/atapas/webapis-playground/commits?author=Abiola-Farounbi\" title=\"Code\"\u003e💻\u003c/a\u003e\u003c/td\u003e\n    \u003ctd align=\"center\"\u003e\u003ca href=\"http://linkedin.com/in/emitdutcher\"\u003e\u003cimg src=\"https://avatars.githubusercontent.com/u/27447016?v=4?s=100\" width=\"100px;\" alt=\"\"/\u003e\u003cbr /\u003e\u003csub\u003e\u003cb\u003eEmit\u003c/b\u003e\u003c/sub\u003e\u003c/a\u003e\u003cbr /\u003e\u003ca href=\"https://github.com/atapas/webapis-playground/commits?author=develemit\" title=\"Code\"\u003e💻\u003c/a\u003e\u003c/td\u003e\n  \u003c/tr\u003e\n\u003c/table\u003e\n\n\u003c!-- markdownlint-restore --\u003e\n\u003c!-- prettier-ignore-end --\u003e\n\n\u003c!-- ALL-CONTRIBUTORS-LIST:END --\u003e\n\nThis project follows the [all-contributors](https://github.com/all-contributors/all-contributors) specification. Contributions of any kind welcome!\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fuvacoder%2Fweb-apis-cards","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fuvacoder%2Fweb-apis-cards","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fuvacoder%2Fweb-apis-cards/lists"}