{"id":13727254,"url":"https://github.com/leonardomso/roover","last_synced_at":"2025-03-17T03:31:03.004Z","repository":{"id":36959574,"uuid":"268276924","full_name":"leonardomso/roover","owner":"leonardomso","description":"🐱 A lightweight audio library for React apps.","archived":false,"fork":false,"pushed_at":"2024-02-14T08:54:47.000Z","size":15662,"stargazers_count":94,"open_issues_count":17,"forks_count":10,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-03-16T07:41:33.336Z","etag":null,"topics":["audio","audio-player","hooks","howler-audio-library","howlerjs-library","html5-audio-api","html5-audio-player","player","react","react-hook","reactjs","sound","xstate"],"latest_commit_sha":null,"homepage":"https://roover.vercel.app","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/leonardomso.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":"2020-05-31T12:37:58.000Z","updated_at":"2025-03-05T13:52:12.000Z","dependencies_parsed_at":"2023-02-18T04:45:56.351Z","dependency_job_id":"32cd7c1f-fdb7-482a-9c02-a248e9c00953","html_url":"https://github.com/leonardomso/roover","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/leonardomso%2Froover","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/leonardomso%2Froover/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/leonardomso%2Froover/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/leonardomso%2Froover/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/leonardomso","download_url":"https://codeload.github.com/leonardomso/roover/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243968740,"owners_count":20376441,"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":["audio","audio-player","hooks","howler-audio-library","howlerjs-library","html5-audio-api","html5-audio-player","player","react","react-hook","reactjs","sound","xstate"],"created_at":"2024-08-03T01:03:46.442Z","updated_at":"2025-03-17T03:31:02.575Z","avatar_url":"https://github.com/leonardomso.png","language":"TypeScript","readme":"\u003cbr\u003e\n\u003cp align=\"center\"\u003e\n\u003ca href=\"https://github.com/leonardomso/roover\"\u003e\n\u003cimg src=\"https://i.imgur.com/sHCo4D0.png\" alt=\"Roover\" height=\"250\" width=\"250\"/\u003e\n\u003c/a\u003e\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n\u003cb\u003eManage audio in React with ease\u003c/b\u003e\n\u003c/p\u003e\n\n[![Build Status](https://img.shields.io/github/workflow/status/leonardomso/roover/CI?style=flat\u0026colorA=000000\u0026colorB=000000)](https://github.com/leonardomso/roover/actions?query=workflow%3ALint)\n[![Build Size](https://img.shields.io/bundlephobia/min/roover?label=bundle%20size\u0026style=flat\u0026colorA=000000\u0026colorB=000000)](https://bundlephobia.com/result?p=roover)\n[![Version](https://img.shields.io/npm/v/roover?style=flat\u0026colorA=000000\u0026colorB=000000)](https://www.npmjs.com/package/roover)\n[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg?style=flat\u0026colorA=000000\u0026colorB=000000)](https://opensource.org/licenses/MIT)\n\n## Motivation\n\nModern applications are using audio all the time. Audio can turn a boring application into an interesting one, adding emotion to the content. Most of the modern applications that we use daily are using audio for at least in some part.\n\nWork with audio in React applications is painful. There are not too many good libraries to manage audio and most of the time we need to create our solutions. Manage audio in a modern application is important and should be made by using the best tools and libraries.\n\nThe idea to create this library was to provide a powerful and lightweight audio library for React apps. A custom React Hook that is easy to integrate with and has a ton of features to help speed up development without having to worry about anything.\n\n## Installation\n\n```bash\nyarn add roover\n```\n\n## Usage\n\nAll you need to do is import the `useRoover` hook and use it on your React component.\n\n```typescript\nimport React from 'react';\nimport useRoover from 'roover';\n\nconst src =\n  'https://storage.googleapis.com/media-session/elephants-dream/the-wires.mp3';\n\nconst App = () =\u003e {\n  const {\n    initial,\n    loading,\n    ready,\n    playing,\n    paused,\n    onPlay,\n    onPause,\n  } = useRoover({\n    src,\n    autoplay: true,\n  });\n\n  return (\n    \u003cdiv\u003e\n      \u003cp\u003eLoading: {loading ? 'true' : 'false'}\u003c/p\u003e\n      \u003cp\u003eReady: {ready ? 'true' : 'false'}\u003c/p\u003e\n      \u003cbutton onClick={onPlay}\u003ePlay\u003c/button\u003e\n      \u003cbutton onClick={onPause}\u003ePause\u003c/button\u003e\n    \u003c/div\u003e\n  );\n};\n```\n\n## Example\n\nTo run the example do the following steps:\n\n1. `git clone` the repository\n2. `cd roover/example`\n3. `yarn install`\n4. `yarn start`\n\n## Contributing\n\nYour contributions are welcome! If you have any questions or want to start to contribute to this library in any form, please open an issue. Feel free to open PR.\n\nIf there are any questions about this library or about any other topic, please contact me on Twitter [@leonardomso](https://twitter.com/leonardomso) and I'll gladly answer it.\n\n## License\n\nMIT License © 2021 [Leonardo Maldonado](https://github.com/leonardomso)\n","funding_links":[],"categories":["TypeScript"],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fleonardomso%2Froover","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fleonardomso%2Froover","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fleonardomso%2Froover/lists"}