{"id":13433384,"url":"https://github.com/vibertthio/beact","last_synced_at":"2025-04-09T08:11:07.534Z","repository":{"id":22204725,"uuid":"94702011","full_name":"vibertthio/beact","owner":"vibertthio","description":":guitar::art: DJ and VJ all by yourself in seconds !","archived":false,"fork":false,"pushed_at":"2023-01-25T07:18:20.000Z","size":47628,"stargazers_count":269,"open_issues_count":29,"forks_count":34,"subscribers_count":19,"default_branch":"master","last_synced_at":"2024-04-14T12:45:05.987Z","etag":null,"topics":["creative-coding","dj","sequencer","vj","webaudio"],"latest_commit_sha":null,"homepage":"https://vibertthio.com/beact","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/vibertthio.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}},"created_at":"2017-06-18T17:20:24.000Z","updated_at":"2024-03-31T19:36:29.000Z","dependencies_parsed_at":"2023-02-14T05:45:52.657Z","dependency_job_id":null,"html_url":"https://github.com/vibertthio/beact","commit_stats":null,"previous_names":[],"tags_count":2,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vibertthio%2Fbeact","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vibertthio%2Fbeact/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vibertthio%2Fbeact/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vibertthio%2Fbeact/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/vibertthio","download_url":"https://codeload.github.com/vibertthio/beact/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247999861,"owners_count":21031046,"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":["creative-coding","dj","sequencer","vj","webaudio"],"created_at":"2024-07-31T02:01:25.026Z","updated_at":"2025-04-09T08:11:07.512Z","avatar_url":"https://github.com/vibertthio.png","language":"JavaScript","readme":"\u003e :tada: New Animation Arrival!\n\n\u003c!-- ![logo of beact](./assets/images/bar.png) --\u003e\n![logo of beact](./assets/images/new-ani.png)\n# [Beact](https://beact.herokuapp.com/) \u0026middot; [![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com)\n\n\u003e 🎸🎨 DJ / VJ all by yourself in seconds !\n\nShout out to [Jono](https://jono.fyi/) who built [patatap](https://patatap.com/). The interaction and animations are strongly based on patatap but with sequencer and more audio/visual elements.\n\n- [demo](https://beact.herokuapp.com/) - It's deployed on Heroku, play it now!\n- [video](https://vimeo.com/226318485) - Short video of using Beact for performance!\n- [blog(vibert)](https://medium.com/@vibertthio/beact-audio-visual-art-in-react-44e9c757e40f) - vibert's words after creating Beact!\n- [english version](https://medium.com/@vibertthio/dj-and-vj-all-by-yourself-in-seconds-on-web-e5befc162e0f) - vibert's words after creating Beact!\n- [blog(scya)](http://scyablog.blogspot.tw/2017/07/beact.html) - scya597's words after creating Beact! (only mandarin now, english coming)\n\nAn audio/visual interactive art piece, and an instrument that everyone play with to become a DJ + VJ.\nIt's based on the idea of patatap, and using two.js, tone.js as audio and visual library.\nIt combines sequencer with on concept of patatap.\nI have added some my own animation and will do more to replace ones from patatap.\n\n\n## 0. Table of Contents  \n- [Quick Start](#1-quick-start)\n- [Run on Local](#2-run-on-local)\n- [Development](#3-development)\n- [Deploy](#4-deploy)\n- [Basic Usage](#5-basic-usage)\n- [Advanced Usage](#6-ui-and-advanced-usage)\n- [Credits and Inpirations](#7-credits-and-inspirations)\n\n\n## 1. Quick Start\n1.   open the [demo](https://safe-stream-69256.herokuapp.com/) link.\n2.   press space to start/stop.\n3.   click any block to trigger drum machine note.\n4.   press any alphabet to trigger keyboard note.\n5.   up/down to change bpm.\n6.   left/right to change sound bank of drum machine.\n7.   press 1 ~ 8 for different presets.\n8.   shift+up/down to change animations of keyboard.\n9.   shift+left/right to change animations of drum machine.\n10.   press naruto icon to set naruto animation of keyboard.\n\n![screenshot](./assets/images/b1.png)\n\n## 2. Run on Local\n\u003e It's okay to run Beact without server. It will git some error in console irrelevant, though.\n\nFirst, clone the repo and install dependencies.  \nThen **Rock'n Roll**, baanngg.\n\n```\ngit clone https://github.com/vibertthio/beact beact\ncd beact\nnpm install\nnpm run build\nnpm run start\n```\n\n## 3. Development\n\u003e Run Beact with server, giving you **the Force**.\n\n### 3.1 To install mongodb\n\n```\nbrew install mongo\n```\n\n\n### 3.2 Initial config of mongodb\n\nCreate database directory\n\n```\nsudo mkdir -p /data/db\n```\n\nFind your username\n\n```\nwhoami\n```\n\nTaking ownership to /data/db\n\n```\n// assume your username is John\nsudo chown -Rv John /data/db\n```\n\n\n### 3.3 To run the database\n\n```\nmongod\n```\n\nIf you don't want to run mongod everytime you need, the following command will automatically start your database while the computer is running:\n\n```\nbrew services start mongo\n```\n\n\n### 3.4 To develop Beact\n\n```\nnpm run dev\n```\n\n## 4. Deploy\n\u003e We are using great Heroku for current deploy.\n\n### 4.1 Clone the repo, install dependencies, and build.\n\n```\ngit clone https://github.com/vibertthio/beact Beact\ncd Beact\nnpm install\nnpm run build\n```\n\n### 4.2 Delete /public in \"Ignore build files\" of .gitignore\n\n```\n# Ignore build files\npublic \u003c\u003c (delete)\n```\n\n### 4.3 Deploy\n\n```\nheroku create\nheroku addons:create mongolab:sandbox\nnpm run deploy\n```\n\n## 5. Basic Usage\n\n### 5.1 Keyboard \u0026 Sequencer Pads\n1. click on the drum pad to make your own pattern.\n2. press space to start/stop.\n3. press up/down for bpm changing.\n4. left/right to change sound samples.\n5. press 1~8 to trigger preset patterns.\n6. press a~z to trigger animation and audio just like patatap.\n\n### 5.2 Sidebars\n1. Start / Stop\n2. Pattern : create a pattern, type in the name, and press add to upload yours to server and store.\n3. Chain：chain few patterns into a song.\n4. Recorder：record the drum machine pattern and keyboard together into a recording, and upload to server for you to share and replay.\n\n\n## 6. UI and Advanced Usage\n\n![screenshot](./assets/images/beact-ui-2.png)  \n[Full User Guide](https://safe-stream-69256.herokuapp.com/)\n\n## 7. Credits and Inspirations\n  * crazi ass library [tone.js](https://tonejs.github.io/) and [two.js](https://two.js.org/)\n  * original idea from amazing [patatap](http://patatap.com/)\n  * music samples from amazing [stepkit](http://jxnblk.com/stepkit/)\n","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvibertthio%2Fbeact","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fvibertthio%2Fbeact","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvibertthio%2Fbeact/lists"}