A React Web App for Creating and Sharing Drum Loops. See Drum Root API for Back End Service.

• Create Drum Loops
• Record Custom Sounds
• Save and Share Drum Loops With Others

• React - JavaScript UI Library
• Next.js - Server Side Rendering
• Styled Components - Styling
• Jest - JavaScript Testing Framework
• React Testing Library - A library to test React UI components
• Puppeteer - A Node Library for Controlling Headless Chrome or Chromium. Used for end to end Testing
• Storybook - Tool for Developing UI Components in Isolation

• Express - Web Framework for Node.js
• PostgreSql - Relational Database(Coming Soon)
• Redis - In-Memory Data Structure Store used for Authorization(Coming Soon)

• Project Lead - rgavinc
• Front End Lead - needed
• Back End Lead - yashShelatkar
• QA Lead - zbc
• Database Lead - Aneesh
• Designer/ Styling Lead - needed

• Dhaval - Front End Lead Oct 2019 - Nov 2019
• rvvergara - QA Lead Oct 2019 - Dec 2019
• marcoseoane - Front End Lead Nov 2019 - Dec 2019
• linconkusunoki - Designer/ Styling Lead Oct 2019 - Jan 2020

The backend code should be running in order for the front end to behave correctly. See Drum Root API.

To get started with the front end, fork the repository and run the following commands:

npm install
npm run dev

If you wanted to run this site in production, you should install modules then build the site with npm run build and run it with npm start:

npm install
npm run build
npm start

You should run npm run build again any time you make changes to the site.

Storybook is a way to view the components in isolation. To view Drum Root's storybook, run the following command:

npm run storyboook

If you are the first time to start the tests, run the following command to ensure all related packages installed:

npm install

To get started with Unit Test, run the following command:

npm run test

To get started with Integration/End to End Test, run the following command:

npm run test:e2e