{"id":25629209,"url":"https://github.com/noops-challenge/drumbot","last_synced_at":"2026-01-17T03:26:13.448Z","repository":{"id":34947672,"uuid":"191273961","full_name":"noops-challenge/drumbot","owner":"noops-challenge","description":"Drumbot loves drum machines so much that she made an API dedicated to them. Nothing would make her happier than for you to bring this API to life.","archived":false,"fork":false,"pushed_at":"2023-01-04T00:03:44.000Z","size":2057,"stargazers_count":88,"open_issues_count":26,"forks_count":126,"subscribers_count":9,"default_branch":"master","last_synced_at":"2024-04-14T12:52:32.911Z","etag":null,"topics":["audio","drum-machine"],"latest_commit_sha":null,"homepage":"https://noopschallenge.com/challenges/drumbot","language":"Elixir","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/noops-challenge.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":"2019-06-11T01:51:04.000Z","updated_at":"2024-03-18T17:12:53.000Z","dependencies_parsed_at":"2023-01-15T11:00:24.228Z","dependency_job_id":null,"html_url":"https://github.com/noops-challenge/drumbot","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/noops-challenge%2Fdrumbot","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/noops-challenge%2Fdrumbot/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/noops-challenge%2Fdrumbot/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/noops-challenge%2Fdrumbot/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/noops-challenge","download_url":"https://codeload.github.com/noops-challenge/drumbot/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":240222477,"owners_count":19767460,"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","drum-machine"],"created_at":"2025-02-22T19:17:06.267Z","updated_at":"2026-01-17T03:26:13.436Z","avatar_url":"https://github.com/noops-challenge.png","language":"Elixir","funding_links":[],"categories":["Elixir"],"sub_categories":[],"readme":"![](https://user-images.githubusercontent.com/212941/59231343-2a71cd80-8b95-11e9-8bc9-9dfb58467094.png)\n\n## 👋 Drumbot wants you!\n\nDrumbot loves drum machines so much that she made an API dedicated to them.\nNothing would make her happier than for you to bring this API to life.\n\nDrumbot has included a drum machine written using React and the WebAudio API to help you get started.\n\nYou can start with this or create your own from scratch.\n\n### API\nDrumbot's API has the following methods:\n\n`GET /drumbot/patterns`\n\nReturns the list of available patterns\n\n`GET /drumbot/patterns/{pattern-name}`\n\nReturns a pattern.\n\nSee [the API documention](API.md) For all the details!\n\n## React Starter Kit\n\nDrumbot has provided a starter kit \u0026ndash; a drum machine that runs inside a browser, built with React and the WebAudio API.\n\n[See it in action here](https://noops-challenge.github.io/drumbot/index.html)\n\nTo get started with the react example, you'll need recent version of node.js. Fork this repository to your own github account so you can share your work.\n\n```\ncd react-starter\nnpm install\nnpm start\n```\n\nThis example requires WebAudio support,\n\nThe WebAudio API is relatively new and support can be slightly different in each browser. This drum machine should work on Edge, Firefox, Chrome, and Safari.\n\nAlso note that on some mobile devices, WebAudio only plays through headphones \u0026ndash; so if you don't hear anything, plug some in!\n\nThe [WebAudio page on MDN](https://developer.mozilla.org/en-US/docs/Web/API/Web_Audio_API) is a good place to start learning about the WebAudio API.\n\n## Ideas to try\n\nHere are a few ideas for you to try:\n\n#### Change the sounds\n\nThis drum machine loads its sounds from samples that are stored in the .wav format.\n\nThe sounds are found in the `public/samples` folder. Try replacing these with your own sounds.\n\nIf you're feeling adventurous, try synthesizing your own drum sounds using [oscillators](https://developer.mozilla.org/en-US/docs/Web/API/BaseAudioContext/createOscillator).\n\n#### Change the speed!\n\nThis drum machine doesn't let you set the tempo. Try adding a tempo control!\n\n#### Dynamics\n\nThis drum machine plays each sound at an equal volume. Try varying the volume of the sounds or adding a volume knob to each track.\n\nUse the [AudioContext.createGain](https://developer.mozilla.org/en-US/docs/Web/API/BaseAudioContext/createGain) method to create a gain node to control the volume.\n\n#### Stererereo\n\nYou can move sounds around from left to right. Try using [AudioContext.createStereoPanner()](https://developer.mozilla.org/en-US/docs/Web/API/BaseAudioContext/createStereoPanner) to create a [StereoPannerNode](https://developer.mozilla.org/en-US/docs/Web/API/StereoPannerNode).\n\nYou can even get crazy and move sounds around in 3D with a [PannerNode](https://developer.mozilla.org/en-US/docs/Web/API/PannerNode).\n\n#### Make it Swing!\n\nA revolutionary feature on the [Linn LM-1](https://en.wikipedia.org/wiki/Linn_LM-1), one of the earliest drum machines, was \"Swing\" - the ability to make the beat \"swing\" by slightly changing the timing of every other step. Most drum machines since then have included some sort of swing control.  Try adding one to this drum machine.\n\n#### Spice up the design!\n\nDrumbot is not a designer. Are you? Let's see what you got.\n\n#### Create your own drum pattern API.\n\nCan you reverse-engineer the drumbot API and create your own beats? Show us.\n\n#### Add visualizations\n\nUse [AudioContext.createAnalyser](https://developer.mozilla.org/en-US/docs/Web/API/BaseAudioContext/createAnalyser) to analyze the audio data. Create a sound meter or do something else awesome!\n\n#### Change the pattern!\n\nEnable changing the pattern by toggling each spet on or off.\n\n## Nevermind the starter; I want to roll my own!\n\nGreat! Here are some ideas to get you started.\n\n#### Use a different programming language\n\nMost languages and platforms out there can play music, with a little help from a library or two. What's your favorite language?\n\n#### Connect to other devices\n\n Connect to a real drum machine! Hook these patterns up to your favorite music program! Make your smart microwave heat up pizza to the beatza!\n\n### Visualize the rhythm\n\nPlaying sounds is just one of them. Build something else cool with these repeating patterns. Light up your smart lightbulbs or anything else.\n\n## Show drumbot what you made!\n\nPush your work up to your own fork.\n\n\n\nMore about Drumbot here: https://noopschallenge.com/challenges/drumbot\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnoops-challenge%2Fdrumbot","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fnoops-challenge%2Fdrumbot","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnoops-challenge%2Fdrumbot/lists"}